<div id="showproduct_box">
<dl class="productItem" onclick="onlickFirstctg(this);">
<dt class="maxLen">
<a href="baidu.com">百度</a>
</dt>
<dd>
<div class="maxLen SecondCatalogbgimg">
<a href="google.cn">谷歌</a>
</div>
</dd>
</dl>
</div>
<script type="text/javascript">
var oldobj = document.getElementById("showproduct_box").getElementsByTagName("dl")[0];
function onlickFirstctg(obj) {
if (oldobj == obj) return;
if (oldobj != null) {
oldobj.className = oldobj.className.indexOf("productItem") > -1 ? "productItem" : "";
}
obj.className = oldobj.className.indexOf("productItem") > -1 ? "visible productItem" : "visible";
oldobj = obj;
}
</script>
//各位大虾能不能讲下上面的原理,我知道上面意思就是点击加新的样式
//但我怎么看是越看越没理解,比如说oldobj和obj本来就是同一对象可是为什么还要分旧的和新的,但不这样分还就只能显示不能隐藏了
//最后就是那个oldobj=obj让我费解,我已经换位思考过了,基本都能想通了,我现在只想核对下自己的答案是否正确
//虽然这些比较基础可是我就想弄懂些,求大虾们详解
这边只有一个dl,,如果你再添加一个,估计你就理解了
oldobj 就是每次 把当前点击的那个 dl 赋给它,不晓得你的样式是啥作用。
比如:<dl> 有很多个, 每次只有一个 dl的样式字体是 红色,其它 都是黑色,每次点击时 改变当前字体颜色红色,其它都变为黑色?
你会怎么做?
1. 如果你没记录上一个红色字体的dl,就只有遍历 所有的dl了,再统一变黑色,再把当前的变红色。
2.如果你记录了上一个红色字体的dl,就不用遍历了所有的dl了,就直接把上一个dl字体变黑色,再把当前单击的字体变红色。
你用的就是方法2这种。
这段代码没问题吗? oldobj 永远不会为Null的
oldobj是指上次点击的,如果当前点击的和上次点击的是同一个就不用改变样式,不同才改变,点击之后将当前的对象obj保存到oldobj里它就成为了“下次点击的上次点击的对象”。