我想显示所有列表项，而不是一个项
我想显示所有列表项，而不是一个项
提问于 2016-08-17 14:14:00
<html>
<head>
<link rel="stylesheet" type="text/css" href="mango.css">
<script>
function mango(){
document.getElementById("apple").style.display="block";
}
</script>
</head>
<body>
</body>
<ul id="main" onclick="mango()">main1
<li id="apple">sub1</li>
<li id="apple">sub2</li>
<li id="apple">sub3</li>
</ul>
<ul id="main">main2
<li>sub11</li>
<li>sub2</li>
<li>sub11</li>
</ul>
</html>关联的CSS：
#main li{
list-style-type: none;
display: none;
}在给定的程序中，当我单击显示第一个列表项的main1，而不是显示that.can下的所有列表项时，您是否帮助我？
回答 1
Stack Overflow用户
回答已采纳
发布于 2016-08-17 14:17:25
我已经用class替换了id，并相应地更改了js。根据浏览器的不同，使用具有相同值的多个id将导致不需要的行为。
<html>
<head>
<link rel="stylesheet" type="text/css" href="mango.css">
<script>
function mango(){
document.querySelectorAll(".apple")
.forEach(function(node){
node.style.display="block";
})
}
</script>
</head>
<body>
</body>
<ul id="main" onclick="mango()">main1
<li class="apple">sub1</li>
<li class="apple">sub2</li>
<li class="apple">sub3</li>
</ul>
<ul id="main">main2
<li>sub11</li>
<li>sub2</li>
<li>sub11</li>
</ul>
</html>页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/38989278
复制相关文章
相似问题
腾讯云开发者
