在网页开发中，经常需要隐藏或显示某些元素，这就涉及到切换div的问题。通常，在js中切换div的方法有两种：一种是通过改变元素的display属性来实现，另一种是通过改变元素的className来实现。我们用一个实例来说明如何使用这两种方法来切换div。下面是html页面中包含了两个div，分别有不同的id和class：

<div id="div1"><p> div1 内容 </p></div><div id="div2" ><p> div2 内容 </p></div>

在第二个div中，我们添加了一个hidden类，这个类的定义如下：

.hidden{display:none;}

这个类的作用是隐藏元素。对于第一种方法，我们可以使用js的style属性来改变div的display属性，代码如下：

var div2=document.getElementById("div2");div2.style.display="none"; //隐藏div2div2.style.display="block"; //显示div2

这样可以动态改变元素的display属性，来实现显示和隐藏div2。对于第二种方法，我们可以使用className属性来改变元素的class属性，代码如下：

var div2=document.getElementById("div2");div2.className=""; //显示div2div2.className="hidden"; //隐藏div2

这样可以动态改变元素的class属性，来实现显示和隐藏div2。需要注意的是，如果一个元素同时应用了多个类，那么使用className属性来改变class属性时，需要保留原有的类，不然原有的类都会被覆盖。代码如下：

var div2=document.getElementById("div2");div2.className+=" show"; //在原有的class后添加show类，显示div2div2.className+=" hidden"; //在原有的class后添加hidden类，隐藏div2

这样就可以通过添加和删除类来动态改变元素的显示和隐藏。总之，切换div是网页开发中常用的功能，使用js的style和className属性可以轻松地实现。我们需要根据实际情况来选择使用哪种方法来完成切换div的效果。