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

前端之家收集整理的这篇文章主要介绍了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>

猜你在找的JavaScript相关文章