除了Document类型之外,Element类型是Web编程中最常用的类型。
Element类型用于表现XML或HTML元素,提供了对元素标签名、子节点及特性的访问。
nodeType的值:1nodeName的值:元素的标签名nodeValue的值:nullparentNode的值:Document/Element子节点Element、Text、Comment、ProcessingInstruction、CDATASection、EntityReference <div id = "myDiv"></div> var div = document.getElementById("myDiv"); // HTML中,标签名始终都以全部大写表示 //XML(XHTML标签名始终会与源代码保持一致) alert(div.tagName);//"DIV" alert(div.tagName == div.nodeName)//true每个元素都有一个或多个特性,这些特性的用途是给出相应元素或其内容的附加信息,操作特性的DOM方法主要有三个:
方法参数功能getAttribute()接收一个参数:与实例名相同获取自定义特性setAttribute()接收两个参数:要设置的特性名和值修改或创建该属性并设置相应的值removeAttribute()接受一个参数:所要删除的元素名彻底删除元素的特性 var div = document.getElementById("myDiv"); alert (div.getAttribute("id")); //"myDiv"getAttribute()不经常使用,,只是用对象的属性,在取得自定义特性值的情况下,才会是有用getAttribute().
Element类型是使用attributes属性的唯一一个DOM节点类型。 attributes属性中包含一个NameNodeMap,与NodeList类似,是一个动态集合。
元素可以由任意树木的子节点和后代节点,因为元素可以是其他元素的子节点。
<ul id = "myList"> <li>item1</li> <li>item2</li> <li>item3</li> </ul>在IE浏览器中,< ul>元素有3个子节点,分别是3个< li>元素;在其他浏览器中有7个元素,分别是3个< li>元素和4个文本节点(< li>元素的空百符),把所有的空白符删除,那么所有浏览器就会返回相同的子节点。 因此在执行某项操作前,都要先检查一下nodeType属性:
for (var i = 0, len = element.childNodes.length; i < len; i++){ //遍历子节点,当子节点的nodeType等于1的情况下,才会执行某些操作 if(element.childNodes[i].nodeType == 1){ //执行某些操作 } }