我有一堆动态创建的项目供用户选择。在这种情况下,将添加“selected”类。
<li id="test1" class="myElement selected"></li>
<li id="test2" class="myElement"></li>
<li id="test3" class="myElement"></li>
<li id="test4" class="myElement selected"></li>
<li id="test5" class="myElement selected"></li>
<li id="test6" class="myElement"></li>
如何获取所有具有“selected”类 onclick 的元素的 id?
最佳答案
使用Document.querySelectorAll()
使用选择器 .selected[id]
。也就是说,所有具有 selected
类且也 具有 id
属性的元素。
const elementsWithSelectedClass = document.querySelectorAll('.selected[id]')
const selectedElementIds = Array.from(elementsWithSelectedClass) // convert to array
.map(el => el.id) // map to an array of id values
console.info(selectedElementIds)
<ul style="list-style:none">
<li id="test1" class="myElement selected"></li>
<li id="test2" class="myElement"></li>
<li id="test3" class="myElement"></li>
<li id="test4" class="myElement selected"></li>
<li id="test5" class="myElement selected"></li>
<li id="test6" class="myElement"></li>
</ul>
这将为您提供一个 id
值数组。
我正在使用Array.from
转换NodeList
从 querySelectorAll
返回到一个数组,这样我就可以使用 map
方法。
关于javascript - 如何获取具有特定类的多个元素 ID,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/42499846/