本文探讨了HTML DOM中Element节点属性操作的原理及测试代码实现，指出获取某些节点属性值时面临的问题，并提供了相应的解决思路。
Node接口本身有一个attributes属性，并且所有类型的节点都继承了该属性。但是，事实上只有Element类型的节点才能有属性。Element节点的attibutes属性类型为NamedNodeList。NamedNodeMap可以通过数字和名字索引节点。
NamedNodeMap具有以下几个常用的方法：
1.getNamedItem(name):根据name获取属性节点。
2.setNamedItem(node):将节点添加进NamedNodeMap中，并且按照name索引。
3.removeNamedItem(name):删除name对应的节点
4.item(pos):类似于NodeList中的item()方法，通过节点的索引位置查找节点。
上述方法返回的都是一个Attr类型的节点，也就是Node.ATTRIBUTE_NODE。NamedNodeMap具有一个length属性表示其中包含几个元素。
但是考虑到上述方法过于累赘，DOM还定义了三个方法来操作属性：
getAttribute(name):通过name获取属性值
setAttribute(name,newValue):设置属性值
removeAttribute(name):删除属性
根据上面说的，我写了点测试代码：
- <html>
- <head>
- <title></title>
- <scripttype="text/javascript">
- functiontest(){
- varoHtml=document.documentElement;
- varoBody=oHtml.lastChild;
- varoP=oBody.lastChild;
- varoId=oP.getAttribute("id");
- alert(oId);
- }
- </script>
- </head>
- <bodyonload="test()">
- <pstyle="color:red"id="pId"></p>
- </body>
- </html>
事实上，不管IE8、Chrome还是Firefox都没办法取到<p>的id属性值。这一点很是困惑。。。
参考书目：
《JavaScript高级编程》Nicolas C. Zakas著， 曹力 张欣 等译。
扫一扫
3541
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
