从ul块访问标记名称li

Access tag name li from an ul block

本文关键字：li ul 访问      更新时间：2023-09-26

我想显示一个警报，当我点击"aaa"或"bbb" .我怎么能访问li元素没有类"click"从ul与id = parent ?对于其他元素，我使用:

var elements = document.getElementById('parent');
var classElem = document.getElementsByClassName('click');

我想到了这样的东西:liW = elements - classElem但这不起作用。

这是我使用的html:

<html> 
<head>
</head>
<body> <ul id = "parent"> 
<li> aaa </li>
<li> bbb </li>
<li class ="click"> ccc </li>
<li class ="click"> ddd </li> 
</ul> 
<ul> <li> eee </li>
</ul>
</body>

您可以使用Array.filter，如下所示:

var liW = [].filter.call(
    document.getElementById('parent').children, // the LI elements
    function(li) {return !li.classList.contains('click');}
);

这将为您提供一个与<li>标签相对应的节点数组，不具有class="click"。

您可以通过遍历所有子li元素来实现这一点，检查它们中的每个元素是否具有click类，如果没有，则在单击时显示警告。

var elements = document.getElementById('parent').getElementsByTagName('li');
function elementClicked(elem) {
    alert('test');
}
for(var i = 0; i < elements.length; i++) {
    if(!elements[i].classList.contains('click')) {
        elementClicked(elements[i]);
    }
}

您可以将事件侦听器放在父元素(UL)上并检查目标元素是否有这个类。

示例- 

list = document.getElementById('parent');
list.addEventListener('click',function(e){
    if (e.target.className.indexOf('click') === -1) alert(test);
});
相关文章：