Javascript getElementsByTagName（“table”）-让td走上奇妙的道路

我有一个简单的例子

 <table border="1px">
  <tr> 
    <td> </td>
    <td> <input type="button" value="Click" onclick="insertText()"/> </td>
  </tr>
 </table>

因为它是：

• 表元素本身的

  var td=document.getElementsByTagName（“表”）[0]

• tr元素的子元素[0]
• 和

  子元素[0]

  再次用于第一个td元素

这就是我所想的，但很明显，这返回了tr元素，只添加了另一个

。children[0]

给了我td元素

var td = document.getElementsByTagName("table")[0].children[0].children[0].children[0];

---

为什么会这样，或者我在这里遗漏了什么？

这是因为您忘记了自动插入DOM的

元素

您的桌子的真实外观：

<table border="1px">
  <tbody>
    <tr> 
      <td> </td>
      <td> <input type="button" value="Click" onclick="insertText()"/> </td>
    </tr>
  </tbody>
</table>

因此，您需要深入研究三个级别的子元素，以确定所需的

元素

---

旁注：如果你想知道更多关于

元素在未声明的情况下自动注入

元素的原因，。

@stack\u temp当然：）当我下班回到家的时候，我会试着补充一点解释，我以为它们是老派的，我只使用嵌入式div。

<table border="1px">
  <tbody>
    <tr> 
      <td> </td>
      <td> <input type="button" value="Click" onclick="insertText()"/> </td>
    </tr>
  </tbody>
</table>