无法识别DIV ID？

这是我的项目的一小段代码。那么在这里，我只是提取表的第一行元素的ID，但是有一些错误的提取div的ID和选择标记？任何人都可以帮助我吗？无法识别DIV ID？

<html> 
    <head> 
    <script> 
     function add(tableID) {   
      var table = document.getElementById(tableID);   
      var colCount = table.rows[0].cells.length; 

      alert("cell length "+colCount); 

      for(var i=0; i<colCount; i++) { 
       alert(table.rows[0].cells[i].childNodes[0].id); 
      }    
     } 
    </script> 
    </head> 
    <body> 
    <table border="1" id="dataTable" > 
     <tr> 
     <td><INPUT type="checkbox" id="cb" name="chk[]" disabled="true"/></td> 
     <td><input type="text" id="txt" name="t" size="3" maxlength="3" readonly="true" value="1"></td> 
     <td> 
      <select id='slct'> 
      <option value='-1' selected>- - - - - Select - - - - -</option> 
      <option value="0">xyz</option> 
      </select> 
     </td> 
     <td>     
      <div id="div">qwerty</div> 
     </td> 
     </tr> 
    </table> 

    <br> 

    <button onclick="add('dataTable')">show</button> 
    </body> 
</html>

来源

2014-07-19 Vikas Verma

标记之间的任何字符，甚至是空白，都是HTML文本节点（一行中的多个非标记字符全部组合成一个节点）。这意味着第三个和第四个TD的第一个（也是最后一个）子节点都是文本节点（只有空格）。

table.rows[0].cells[0].childNodes.length === 1 
table.rows[0].cells[1].childNodes.length === 1 
table.rows[0].cells[2].childNodes.length === 3 
table.rows[0].cells[3].childNodes.length === 3

如果你修改了HTML来此...

<td><select id='slct'> 
    <option value='-1' selected>- - - - - Select - - - - -</option> 
    <option value="0">xyz</option> 
</select></td> 
<td><div id="div">qwerty</div></td>

，你会得到你的JavaScript您的预期行为。

来源

2014-07-19 17:30:49 illandril

谢谢你救我的一天:) –

问题很简单，因为排除故障的方法也是如此。

尝试登录了的childNodes安慰：

for(var i=0; i<colCount; i++) { 
    console.log(table.rows[0].cells[i].childNodes); 
}

你会看到，在每个单元中的第一childNode是textNode。这是源于换行符。

使用children，而不是排除textNodes

for (var i = 0; i < colCount; i++) {   
    console.log(table.rows[0].cells[i].children[0].id); 
}

DEMO

来源

2014-07-19 17:31:43 charlietfl

无法识别DIV ID？

回答

相关问题