javascript - 在 DOM 中找不到 nextElement/nextElementSibling。是因为它是 img 吗？

Question

我无法通过一些 JavaScript 代码在 DOM 中找到下一个元素。 我想更改 img src，但是当我尝试访问 img 元素时，即使它存在，我也会得到“null”。

谢谢

我试过 nextElement 和 nextElementSibling 都没有用

var node1 = document.getElementById('ctl00_ctl39_g_1398ff2c_c26e_44d8_b382_346b589f7224_tvLinksn0');
console.log('1 ... ' + node1.id);
var node1img = document.getElementById(node1.id).href;
console.log('3 ... ' + node1img);
console.log('3 ... ' + document.getElementById(node1.id).nextElementSibling);

<table cellpadding="0" cellspacing="0" style="border-width:0;">
  <tr>
    <td>
      <a id="ctl00_ctl39_g_1398ff2c_c26e_44d8_b382_346b589f7224_tvLinksn0" href="javascript:TreeView_ToggleNode(ctl00_ctl39_g_1398ff2c_c26e_44d8_b382_346b589f7224_tvLinks_Data,0,ctl00_ctl39_g_1398ff2c_c26e_44d8_b382_346b589f7224_tvLinksn0,&#39; &#39;,ctl00_ctl39_g_1398ff2c_c26e_44d8_b382_346b589f7224_tvLinksn0Nodes)">
        <img src="http://intranetnlb/PublishingImages/plus.gif" alt="Expand &lt;div class=&#39;treeviewHeadingPre&#39;>&lt;/div>&lt;div class=&#39;treeviewHeading&#39;>An Post Subsidiaries&lt;/div>" style="border-width:0;" />
      </a>
    </td>
  </tr>
</table>

我希望找到 img 标签

Answer 1

<img>是你的 child a元素。它不在旁边:

node1.getElementsByTagName("img")[0];

请注意 document.getElementById(node1.id)是多余的 node1已经包含该元素。

---

通过获取 src 进行演示属性示例:

var node1 = document.getElementById('ctl00_ctl39_g_1398ff2c_c26e_44d8_b382_346b589f7224_tvLinksn0');
console.log('1 ... ' + node1.id);
var node1img = node1.href;
console.log('3 ... ' + node1img);
console.log('3 ... ' + node1.getElementsByTagName("img")[0].src);

<table cellpadding="0" cellspacing="0" style="border-width:0;">
  <tr>
    <td>
      <a id="ctl00_ctl39_g_1398ff2c_c26e_44d8_b382_346b589f7224_tvLinksn0" href="javascript:TreeView_ToggleNode(ctl00_ctl39_g_1398ff2c_c26e_44d8_b382_346b589f7224_tvLinks_Data,0,ctl00_ctl39_g_1398ff2c_c26e_44d8_b382_346b589f7224_tvLinksn0,&#39; &#39;,ctl00_ctl39_g_1398ff2c_c26e_44d8_b382_346b589f7224_tvLinksn0Nodes)">
        <img src="http://intranetnlb/PublishingImages/plus.gif" alt="" style="border-width:0;" />
      </a>
    </td>
  </tr>
</table>

---

节点: alt你的标签 <img>似乎破坏了您的标记，因为它的内容没有正确转义。因此，我将其从答案中删除。