本文共 1630 字，大约阅读时间需要 5 分钟。

元素节点

Element类型是最常用的节点类型，它具有以下特征：

• nodeType值为1
• nodeName值为元素的标签名称，也可以使用tagName属性。在HTML中，返回标签名始终为大写，在脚本中比较需要全部小写化：if(element.tagName.toLowerCase() == “div”){}
• nodeValue值为null
• parentNode是Document或Element类型节点
• 其子节点可能是Element、Text、Comment、ProcessingInstruction、CDATASection或者EntityReference

所有HTML元素都是HTMLElement类型或者其子类的实例，HTMLElement又是Element的子类，在继承Element类型时添加了一些属性，添加的这些属性分别对应每个HTML元素下列标准特性：

• id：元素在文档中的唯一标识符
• title：有关元素的附加说明信息，一般通过工具提示显示出来
• lang：元素内容的语言编码，很少使用
• dir：语言方向，值为“ltr”（从左至右），“rtl”（从右至左），很少使用
• className：与元素的class特性对应，即为元素指定的CSS类样式

上述这些属性都可以用来取得或修改相应的特性值

访问元素

1. getElementById()方法：

document.getElementById(ID)//ID表示文档对应元素的id值。如果不存在指定元素，返回null。该方法只适用于document对象

示例：获得div的引用，然后查看节点类型等信息

			
   						
   
    盒子
   
			

document.getElementsByTagName(tagName)//tagName表示指定名称的标签，该方法返回值为一个节点集合，适用length属性可以获取集合中包含元素的个数，利用下标可以访问其中某个元素对象

示例：使用循环获取每个p元素，并设置class属性

var p = document.getElementsByTagName("p");for(var i = 0; i < p.length; i++){
   	p[i].setAttribute("class", "red");}

创建元素

createElement()方法能够根据参数指定的标签名称创建一个新的元素，并返回新建元素的引用。

var element = document.createElement("tagName");//element表示新建元素的引用，tagName指定创建元素的标签名称

示例：下面代码在当前文档中创建了一个段落标记p，并把该段落的引用存储到变量p中。由于该变量表示一个元素节点，所以它的nodeType属性值等于1，而nodeName属性值等于p。

var p = document.createElement("p"); //创建段落元素var info = "nodeName：" + p.nodeName; //获取元素名称info += ",nodeType：" + p.nodeType;//获取元素类型，如果为1则表示元素节点alert(info);

注意：使用createElement()方法创建的新元素不会被自动添加到文档里，因为新元素还没有nodeParent属性，仅在JavaScript上下文中有效。如果要把这个元素添加到文档里，还需要使用appendChild()、insertBefore()或replaceChild()方法实现。

示例：将新创建的p元素增加到body元素下：

var p = document.createElement("p");document.body.appendChild(p);

转载地址：http://jssqb.baihongyu.com/