Question

我有这样的HTML文档

<html>
 <head></head>
  <body>
    <div id="test_id"> First element </div>
    <div> Second element </div>
  </body>
</html>

我可以通过div访问第一个getElementById元素，但是我可以通过某种方式访问第二个元素吗？

Answer 1

您可以将Document.querySelectorAll()与 特定索引 一起使用，如下所示：

var secondDiv = document.querySelectorAll('div')[1];
console.log(secondDiv);

<html>
 <head></head>
  <body>
    <div id="test_id"> First element </div>
    <div> Second element </div>
  </body>
</html>

Answer 2

您可以尝试：

var x = document.getElementById("test_id").nextSibling

Answer 3

document.getElementsByTagName("div")将所有div返回到HTMLCollection对象中，第一个div为0，第二个div为1：

var second = document.getElementsByTagName("div")[1]

console.log(second.innerHTML)

<html>
 <head></head>
  <body>
    <div id="test_id"> First element </div>
    <div> Second element </div>
  </body>
</html>

Answer 4

方法1：获取父元素，然后计算到所需的元素，然后按其名称读取

document.getElementById("test_id").parentElement.getElementByTagName("div")[0].innerHTML;

方法2：直接计数到div，就像提到的那样，但在某些情况下将不起作用

document.getElementByTagName("div")[1]