"parentNode"
常用来获取某个元素的父节点. 把 parentNodes 理解为容器, 在容器中有个子节点
例:
<div id="parent">
<b id="child">My text</b>
</div>
在上面的代码中, 你看到把"爹"作为一个 div 容器, 该容器中有个"孩子", 就是粗体的文字部分. 如果你打算用getElementById() 方法获取粗体元素并且想知道它"爹"是谁, 返回的信息将是一个 div. 演示下面的脚本, 你就知道是怎么回事啦 ...
“children”
有些时候你发现调用childNodes属于没有获得你期望的值。比如:
html:
<a href="javascript:void(0);" onclick="selectCategory(‘1,this);">
<span>apple</span>
</a>
JS:
function selectCategory(val,obj){
var text = obj.children[0].innerHTML;
}
我们希望获得的text属性值为“apple”,但实际上的值是undefined,也就是说获取失败。
原因:
childNodes属性返回值包含了元素节点和文本节点,此例中obj.children[0]返回的实际是空格。
解决方案:
1)去掉<span>和<a>之间的空格。
2)改用 obj.children[0].innerHTML。children属性只返回元素节点。
"childNodes"
,它返回指定元素的子元素集合,包括HTML节点,所有属性,文本。
例子:
function setCount(count) {
var counts = count.split(",");
for (var i = 0; i < counts.length; i++) {
var j = i + 1;
document.getElementById(‘Text‘ + j).innerText = counts[i];
}
}
function setTable() {
var table = document.getElementById("bodyTb");
var n = 1
for (var i = 2; i <= 7; i++) {
var row = table.rows(i);
if (i == 3) {
for (var j = 2; j <= 14; j++) {
row.insertCell(j).innerHTML = " <span style=‘width:100%‘ id=‘Text" + n + "‘ ondblclick=‘EXCDWE(this)‘></span>";
n++;
}
}
else {
for (var j = 1; j <= 13; j++) {
row.insertCell(j).innerHTML = " <span style=‘width:100%‘ id=‘Text" + n + "‘ ondblclick=‘EXCDWE(this)‘></span>";
n++;
}
}
}
}