如何在HTML中的列表对象中获取元素的ID？

Question

我想获取我声明的列表的所有ID，我该怎么做？

我试图这样做然后在JavaScript中我想将所有这些值放在一个列表中。不要注意警报，它常常会看到它的内容是什么。

＆＃13;

＆＃13;

function getIDs() {
  for (i = 1; i < document.getElementById("myUL1").getElementsByTagName("li").length; i++) {
    var e = document.getElementById(i).value;
    alert(e);
  }
}

＆＃13;

<ul id="myUL1">
  <li id=1 value=A>First</li>
  <li id=2 value=B>Second</li>
  <li id=3 value=C>Third</li>
  <li id=4 value=D>Fourth</li>
</ul>

<button onclick="getIDs()" style="border-radius: 0px; height:30px">Test</button>

＆＃13;

＆＃13;

＆＃13;

Answer 1

您需要改进以下内容

• 要迭代所有元素，for循环中的条件应为i <=
• li元素没有value属性，请使用getAttribute

＆＃13;

＆＃13;

function getIDs() {
  
	for(i = 1; i <= document.getElementById("myUL1").getElementsByTagName("li").length; i++){
		var e = document.getElementById(i).getAttribute("value");
		console.log(e);
	}
	
}

＆＃13;

<ul id="myUL1">
  <li id=1 value=A>First</li>
  <li id=2 value=B>Second</li>
  <li id=3 value=C>Third</li>
  <li id=4 value=D>Fourth</li>
</ul>

<button onclick="getIDs()" style="border-radius: 0px; height:30px">Test</button>

＆＃13;

＆＃13;

＆＃13;

修改

修改了示例，以便更好地了解如何检索id（来自评论）

＆＃13;

＆＃13;

function getIDs() {
  var lis = document.getElementById("myUL1").getElementsByTagName("li");
  for (li of lis) {
    console.log(li.getAttribute("id")); // paints id
    console.log(li.getAttribute("value")); // paints value
  }
}

＆＃13;

<ul id="myUL1">
  <li id="myUL1-Li1" value=A>First</li>
  <li id="myUL1-Li2" value=B>Second</li>
  <li id="myUL1-Li3" value=C>Third</li>
  <li id="myUL1-Li4" value=D>Fourth</li>
</ul>

<button onclick="getIDs()" style="border-radius: 0px; height:30px">Test</button>

＆＃13;

＆＃13;

＆＃13;

Answer 2

由于您已使用&引用元素，因此无需使用<?xml version="1.0" encoding="utf-8" ?> <fax> ... <fromname> Test Email &amp; Transaction from Test Branch </fromname> ... </fax> 。

如果您需要保留使用custom data-* attribute属性可以检索的HTMLElement.dataset的任意数据，document...getElementsByTagName("li")也不会拥有有效的getElementById()属性。

＆＃13;

＆＃13;

li

＆＃13;

value

＆＃13;

＆＃13;

＆＃13;