javascript – 如何使用getElementById获取ul标签中的li标签的值

在这段代码中我得到警告0而不是’abc’

<ul>
    <li>First Node</li>
    <li id="repoFolder" value="abc">Lazy Node</li>
</ul>
<button onclick="rootFolder()">Click Me</button>

JS：

function rootFolder() {
    alert(document.getElementById("repoFolder").value);
}

解决方法

您需要读取属性值,因为 HTMLLiElement没有value属性：

document.getElementById("repoFolder").getAttribute("value");

由于在li标签的规范中没有定义value属性,因此最好使用data-attribute(使用.getAttribute(“data-value”))：

<li id="repoFolder" data-value="abc">Lazy Node</li>

那么HTML将是有效的,IDE将不会抱怨未知属性.

查看下面的演示.

function rootFolder() {
    alert(document.getElementById("repoFolder").getAttribute('data-value'));
}

<ul>
    <li>First Node</li>
    <li id="repoFolder" data-value="abc">Lazy Node</li>
</ul>
<button onclick="rootFolder()">Click Me</button>