在页面上发现一个脚本错误,通过Chrome的Debug发现问题出现在一个js方法
function switchToTab(obj) { for (var i = 0; i < obj.parentNode.childNodes.length; i++) { obj.parentNode.childNodes[i].setAttribute("class", ""); obj.parentNode.childNodes[i].setAttribute("className", ""); } obj.setAttribute("class", "selected"); obj.setAttribute("className", "selected"); }
注:setAttribute("className", value);是为了兼容IE,因为使用IE内核的浏览器不认识"class",要用"className"替代。
对setAttribute的了解可以参考这篇文章:http://www.cnblogs.com/seili/archive/2010/10/18/1854004.html
调试会报如下错误:Uncaught TypeError: Object #<Text> has no method 'setAttribute'
#<Text>是什么东东?在Chrome的控制台(Console)输入 obj.parentNode.childNodes 会发现每个子标签之间有一个#Text,这是因为你用原生的DOM API,是会选择到页面上的空白文本节点,空白文本节点不是标签,没有setAttribute方法。碰到这样的情况,还是用jQuery吧。
function switchToTab(obj) { $(obj).parent().children().each(function () { $(this).removeClass("selected"); }); $(obj).addClass("selected"); }
这样就解决问题了。