有没有一种方法可以使代码变干，或者使用更好的方法来实现这种切换效果？

在前端开发中，可以使用一些技术和方法来使代码变得更加干净和高效，以实现切换效果。以下是一些常用的方法：

1. 使用现代的前端框架：现代的前端框架如React、Vue等提供了组件化的开发方式，可以将代码模块化，使得代码更加干净、可维护和可复用。这些框架还提供了一些内置的动画效果和过渡效果，可以方便地实现切换效果。
2. 使用CSS动画：CSS动画是一种在浏览器中使用CSS属性来实现动画效果的方法。通过使用CSS的transition、transform、animation等属性，可以实现各种切换效果，如淡入淡出、滑动、旋转等。可以通过在元素上添加CSS类来触发动画效果。
3. 使用JavaScript动画库：除了CSS动画，还可以使用一些JavaScript动画库来实现更复杂的切换效果。例如，GreenSock Animation Platform (GSAP)、Animate.css等库提供了丰富的动画效果和API，可以通过编写少量的JavaScript代码来实现各种切换效果。
4. 使用过渡效果库：过渡效果库可以帮助开发者实现各种过渡效果，如渐变、缩放、旋转等。例如，Transitions.js、Velocity.js等库提供了简单易用的API，可以实现平滑的过渡效果。
5. 使用动态加载：对于一些较大的切换效果，可以使用动态加载的方式来提高性能。通过在需要切换的时候动态加载相关的资源，可以减少初始加载时间，并且在切换过程中提供流畅的体验。

总结起来，通过使用现代的前端框架、CSS动画、JavaScript动画库、过渡效果库以及动态加载等方法，可以使代码变得更加干净、高效，并且实现各种切换效果。具体的实现方式可以根据具体的需求和场景选择适合的方法。