我想使用 Javascript 遍历页面上的所有元素,并查看它们是否设置了某个属性。有没有简单的方法可以实现这一点,还是说我必须使用递归解决方案?
我想使用 Javascript 遍历页面上的所有元素,并查看它们是否设置了某个属性。有没有简单的方法可以实现这一点,还是说我必须使用递归解决方案?
你可以使用:
var divs = document.getElementsByTagName("div");
for(var i = 0; i < divs.length; i++){
//do something to each div like
divs[i].innerHTML = "something new...";
}
在页面上的一个或多个 div 中查找属性:
var divs = document.getElementsByTagName("div"), i=divs.length;
while (i--) {
if (divs[i].getAttribute([yourProperty]) === 'yourValue'){
//do something
}
}
[2022年10月编辑] 这是一个非常古老的回答。今天我建议使用 CSS 选择器。例如:
const withStyle = document.querySelectorAll('[style]');
console.log(`Found ${withStyle.length} elements with style:\n${
[...withStyle]
.map(el =>`<${el.tagName}>: ${el.getAttribute('style')}`)
.join(`; `) }` );
<div style="color:#777">
<div style="color:red;background:#EEE">red</div>
<div>no color</div>
<div data-something>data-attribute</div>
<div style="color:green">green</div>
<span>Hello</span>
<h3 style="font-family:monospace">That's all folks</h3>
</div>
ES6
For ... of
语句for (elem of document.getElementsByTagName('div')){
elem.style.marginTop='20px'
}
你也可以使用选择器引擎,例如Sizzle。
Steve