我有如下的html格式。我试图获得Div,但只有该div有一个带有特定文本的 child 时,我才能获得foo ='bar'属性。
var loop = document.querySelectorAll('[foo="bar"]');
for(var i = 0; i <= loop.length; i++)
//perform action
<div foo='bar'>
<div>
<span>
<span> foobar </span>
</span>
</div>
</div>
<div foo='bar'>
<div>
<span>
<span> barfoo </span>
</span>
</div>
</div>
<div foo='bar'>
<div>
<span>
<span> foobar </span>
</span>
</div>
</div>
在上面的示例html中,我想获取第一个和第三个div,其中foo = bar并忽略第二个div,因为它没有带有foobar文本的子范围。
我上面的javascript将获取所有3个,但是在我的循环中如何在执行操作之前检查子范围文本是否与foobar匹配?
谢谢
最佳答案
var loop = document.querySelectorAll('[foo="bar"]');
loop.forEach((element, index)=>{
if(element.innerText.match(/foobar/)){
//Do something with element
}
})
<div foo='bar'>
<div>
<span>
<span> foobar </span>
</span>
</div>
</div>
<div foo='bar'>
<div>
<span>
<span> barfoo </span>
</span>
</div>
</div>
<div foo='bar'>
<div>
<span>
<span> foobar </span>
</span>
</div>
</div>