JavaScript操纵DOM纠错两则

来源:互联网 发布:手机工程制图软件 编辑:程序博客网 时间:2024/05/01 07:26

浏览器的差异,对dom本身内部机理的不熟悉都有可能产生错误。今天又用错了两个地方。

1、关于class和className
class属性在HTML DOM中扮演很重要的角色,css和DTHML都可能大量用到。但javascript的浏览器差异性仍然存在。动态设置一个element的属性:element.setAttribute("class", vName);语句在firefox中是行的通的,可是IE内核的浏览器却不认识"class",而得改用"className",同样,firefox也不认识"className"。所以常用的方法是二者兼备:
   element.setAttribute("class", vName);
   element.setAttribute("className", vName);  //for IE

2、删除某个节点的所有子节点
这“某个节点”可能使用getElementById或其他方法得到的。删除方法如下:
   while(element.hasChildNodes()==true){
        element.removeChild(element.childNodes[0]);
   }
简简单单两句话,看似没什么了不起。之前我用for循环(有经验的人一看就不该用),先用element.childNodes获得element的子元素集,然后获取该元素集的数组长度,在进行循环删除。当时就发现元素多了一个(55成了56),没在意。后来发现删除到第28个元素就退出循环了,出现了循环中的“奇迹”。想想,莫非childNodes里包括element本身?且DOM是树结构,又采用中序遍历的算法?结果到第28个后把element自己给删掉了,也就什么都没了。

 
原创粉丝点击