childNodes.length与children.length的值常不一样。
因为childNodes包含的不仅仅只有html节点，所有属性，文本等都包含在childNodes里面,你可以通过nodeType来判断是哪种类型的节点，只有当nodeType==1时才使元素节点，2是属性节点，3是文本节点。而children.length只计算元素节点的数量。
包括进行节点长度的计算，节点的移动时都要注意这一点。
要获得一个元素的文本，比如要获得一个P节点的文本，有的人喜欢使用innerHTML，更改也是一样，其实这不太好，因为使用innerHTML浏览器会认为你要插入的东西是一段标签文本，而你只想插入一段纯文本，这就导致浏览器试图去解析你的那段纯文本，这会造成不必要的资源浪费。所以建议使用element.firstChild.nodeValue,为什么是firstChild呢？因为childNodes[0]就是文本节点，不信你可以看看它的nodeType。
分享到：
相关推荐
本文将详细解析`parentNode`、`parentElement`、`childNodes`和`children`之间的区别。 首先，`parentNode`和`parentElement`都是用于获取一个元素的父级节点。它们的主要区别在于兼容性。`parentNode`是W3C标准的...
`childNodes`与`children`属性的区别在于，`children`仅返回元素节点，忽略了文本节点和注释节点。这使得`children`在处理元素级遍历时更为方便，因为它提供了一个只包含元素节点的“干净”列表。 在实际编程中，...
treeItem.children.push(createTree(node.childNodes[i])); } } } return treeItem; } let tree = createTree(xmlDoc.documentElement); ``` 这段代码会创建一个JavaScript对象，模拟XML的结构，其中`name`...
x < xml.childNodes[i].childNodes.length; x++) { var element = xml.childNodes[i].childNodes[x]; var child = {}; // 获取并设置子节点的属性 child.attribute1 = element.getAttribute("attribute1"); ...
2. `children` 属性：与`childNodes`类似，但`children`只返回元素节点，不包括文本节点、注释节点等非元素节点。这是一个便利的属性，如果你只关心元素子节点，使用它会更高效。 ```javascript // 获取ID为"id"的...
j < t.childNodes[i].childNodes.length; j++) { alert(t.childNodes[i].childNodes[j].innerText); } } } ``` 在这个例子中，`getElementById("tb")`用于获取id为"tb"的表格元素。`childNodes`属性返回一个包含...
while (SS_VAR.DivDummy.children.length > 0) { SS_VAR.DivDummy.removeChild(SS_VAR.DivDummy.children(0)); } return oEl; } function SS_blurExcept (except) { SS_cancelEvent(window.event); except ...
childNodes.push(formatTreeData([children[i]])); // 递归处理子部门 } return childNodes; } ``` 以上代码展示了如何将后端返回的部门数据转化为前端EasyUI Tree可用的JSON格式，并加载到Tree组件中。 总结...
var childNodes = parentNode.children; var count = childNodes.length; for (var i = 0; i ; i++) { var tmpNode = childNodes[i]; if (tmpNode.tagName == "INPUT" && tmpNode.type == "checkbox") { ...
i < xmlDoc.documentElement.childNodes.length; i++) { var node = xmlDoc.documentElement.childNodes[i]; // 创建树节点对象 var treeNode = { name: node.nodeName, children: [] }; // 如果当前节点有...
children //childNodes childElementCount //childNodes.length firstElementChild //firstChild lastEelmentChild //lastChild nextElementSibling //nextSibling previousElementSibling //previousSibl
这个例子展示了为什么我们在处理DOM元素时，如果想得到元素节点的列表而不包含任何文本节点，更倾向于使用`children`属性而不是`childNodes`。`children`属性仅返回元素节点，忽略所有文本节点和注释节点，从而避免...
i < oUl.childNodes.length; i++) { if (oUl.childNodes[i].nodeType == 1) { // nodeType为1代表元素节点 oUl.childNodes[i].style.background = 'red'; } } ``` children属性是另一种获取子元素节点的...
- **注意事项**：在 IE7 中，`children` 与 `childNodes` 的效果相同，而在 Firefox 2.0.0.11 中则有所不同。推荐使用 `children` 以获取更好的兼容性。 5. **`parentObj.getElementsByTagName(tagName)`** - **...
var ln = node.childNodes.length; var arr = []; for (var z = 0; z ; z++) { if (node.childNodes[z].nodeName == tagName.toUpperCase()) { // 确保大小写一致 arr.push(node.childNodes[z]); } } return...
if (element.childNodes.length > 0) { for (var i = 0; i < element.childNodes.length; i++) { var child = element.childNodes[i]; console.log('子节点:', i + 1, ':', child.textContent); } } ``` `...