如何根据HTML标签的id属性和标签名称来获取节点

1 通过顶层document节点获取：

（1）

documentgetElementById(elementId)：该方法通过节点的ID，可以准确获得需要的元素，是比较简单快捷的方法。如果页面上含有多个相同id的节点，那么只返回第一个节点。

如今，已经出现了如prototype、Mootools等多个JavaScript库，它们提供了更简便的方法：$(id)，参数仍然是节点的id。这个方法可以看作是documentgetElementById()的另外一种写法，不过$()的功能更为强大，具体用法可以参考它们各自的API文档。

（2）documentgetElementsByName(elementName)：该方法是通过节点的

name获取节点，从名字可以看出，这个方法返回的不是一个节点元素，而是具有同样名称的节点数组。然后，我们可以通过要获取节点的某个属性来循环判断是否为需要的节点。

例如：在HTML中checkbox和radio都是通过相同的name属性值，来标识一个组内的元素。如果我们现在要获取被选中的元素，首先获取改组元素，然后循环判断是节点的checked属性值是否为true即可。

（3）documentgetElementsByTagName(tagName)：该方法是通过节点的Tag获取节点，同样该方法也是返回一个数组，例如：documentgetElementsByTagName('A')将会返回页面上所有超链接节点。在获取节点之前，一般都是知道节点的类型的，所以使用该方法比较简单。但是缺点也是显而易见，那就是返回的数组可能十分庞大，这样就会浪费很多时间。那么，这个方法是不是就没有用处了呢？当然不是，这个方法和上面的两个不同，它不是document节点的专有方法，还可以应用其他的节点，下面将会提到。

2、通过父节点获取：

（1）parentObjfirstChild：如果节点为已知节点（parentObj）的第一个子节点就可以使用这个方法。这个属性是可以递归使用的，也就是支持

parentObjfirstChildfirstChildfirstChild的形式，如此就可以获得更深层次的节点。

（2）parentObjlastChild：很显然，这个属性是获取已知节点（parentObj）的最后一个子节点。与firstChild一样，它也可以递归使用。

在使用中，如果我们把二者结合起来，那么将会达到更加令人兴奋的效果，即：parentObjfirstChildlastChildlastChild

（3）parentObjchildNodes：获取已知节点的子节点数组，然后可以通过循环或者索引找到需要的节点。

注意：经测试发现，在IE7上获取的是直接子节点的数组，而在Firefox20011上获取的是所有子节点即包括子节点的子节点。

（4）parentObjchildren：获取已知节点的直接子节点数组。注意：经测试，在IE7上，和childNodes效果一样，而Firefox20011不支持。这也是为什么我要使用和其他方法不同样式的原因。因此不建议使用。

（5）parentObjgetElementsByTagName(tagName)：使用方法不再赘述，它返回已知节点的所有子节点中类型为指定值的子节点数组。例如：parentObjgetElementsByTagName('A')返回已知的子节点中的所有超链接。

3、通过临近节点获取：

（1）neighbourNodepreviousSibling：获取已知节点（neighbourNode）的前一个节点，这个属性和前面的firstChild、lastChild一样都似乎可以递归使用的。

（2）neighbourNodenextSibling：获取已知节点（neighbourNode）的下一个节点，同样支持递归。

4、通过子节点获取：

（1）childNodeparentNode：获取已知节点的父节点。

var obj = documentgetElementById(id)childNodes

如果你的ID 对应的元素下面有多个子元素的话

你可以这样访问 obj[1],obj[2] 默认是返回对象数组的 使用下标访问

1、getElementById

作用：一般页面里ID是唯一的，用于准备定为一个元素

语法： documentgetElementById(id)

参数：id :必选项为字符串(String)

返回值：对象; 返回相同id对象中的第一个，按在页面中出现的次序,如果无符合条件的对象，则返回 null

example：

documentgetElementById("id1")value;

2、getElementsByName

作用：按元素的名称查找，返回一个同名元素的数组

语法： documentgetElementsByName(name)

参数：name :必选项为字符串(String)

返回值：数组对象; 如果无符合条件的对象，则返回空数组，按在页面中出现的次序

example：

documentgetElementsByName("name1")[0]value;

documentgetElementsByName("name1")[1]value;

3、getElementsByTagName

作用：按HTML标签名查询，返回一个相同标签元素的数组

语法： objectgetElementsByTagName(tagname) object可以是document或eventsrcElementparentElement等

参数：tagname:必选项为字符串(String)，根据HTML标签检索。

返回值：数组对象; 如果无符合条件的对象，则返回空数组，按在页面中出现的次序

example：

documentgetElementsByTagName("p")[0]childNodes[0]nodeValue;

documentgetElementsByTagName("p")[1]childNodes[0]nodeValue

在angularjs中获取元素的id的方法：

<div id="{{ 'object-' + myScopeObjectindex }}"></div>

这样实际解析后的代码：

<div id="object-1"></div>

这样的id就可以通过document获取了。

1、用 childNodes 属性，按顺序取

实现过程：首先创建一个 xml 对象，然后载入 xml 文件，再根据待取节点父节点在 xml 文件中的序号和本身的序号，确定待取节点的位置，最后返回待取节点的值。

//pId 待取节点父节点序号

//cId 待取节点序号

function getXmlNodeValue(pId, cId) {

var xmlDoc = new ActiveXObject("MicrosoftXMLDOM");

xmlDocasync = false;

xmlDocload("employeeInfoxml");

var nodes = xmlDocdocumentElementchildNodes[pId]childNodes[cId];return nodeschildNodes[0]text;

}

调用方法：alert(getXmlNodeValue(1, 2));

2、用 for 循环来取

实现过程：首先创建一个 ie 支持的 xml 对象，如果发生异常，是创建一个 FireFox 支持的空 xml 对象并返回空；然后载入 xml 文件，如要发生异常也返回空；最后，通过 for 循环遍历查找与传入的节点值相同的节点，找到后返回属于该节点的属性值。

//nodeValue 待取节点的所属节点值

function getXmlNodeValueFor(nodeValue){

var xmlDoc;　

try {　

//创建一个 ie 支持的 XML 文档对象　

xmlDoc = new ActiveXObject("MicrosoftXMLDOM");

}catch(e){

try{

//创建FireFox空的XML文档对象

xmlDoc=documentimplementationcreateDocument("","",null);

}catch(e){

alert(emessage);

return "";

}

}

xmlDocasync = false;

try {　

xmlDocload("employeeInfoxml");

}catch(e){

alert(emessage);

return "";

}

var xd=xmlDocdocumentElementchildNodes;

if(xd==null)

return "";

var tempValue;

for(var i=0;i<xdlength;i++){

if(xd[i]childNodes[0]childNodes[0]nodeValue==nodeValue) tempValue=xd[i]childNodes[2]childNodes[0]nodeValue;

}

return tempValue;

}

调用方法：alert(getXmlNodeValueFor("王佳琳"));

以上就是关于如何根据HTML标签的id属性和标签名称来获取节点全部的内容，包括:如何根据HTML标签的id属性和标签名称来获取节点、document.getElementById(id).childNodes为什么只能获取第一个子元素 能给原因吗谢谢、求教 document.getElementById 的用法等相关内容解答，如果想了解更多相关内容，可以关注我们，你们的支持是我们更新的动力！