Q

在身体

2012-06-09 20 views 10 likes

10

每个元素类型例如在身体

For each div in body 
      div.innerHtml = "poo" 
next div

这显然是伪代码，但证明什么，我试图做的。

2012-06-09 jason m

+2

我回答你的问题，但是你首先应该做的功课... – gdoron

A

回答

23

var elements = document.getElementsByTagName('div'); 

for (var i = 0; i < elements.length; i++) { 
    elements[i].innerHTML = "foo"; 
}

如果你想看看只在<body>：

var elements = document.body.getElementsByTagName('div'); 

for (var i = 0; i < elements.length; i++) { 
    elements[i].innerHTML = "foo"; 
}

2012-06-09 20:00:59 gdoron

+1

'document.getElementsByTagName（ '身体'）[0] === document.body';） – 2012-06-09 20:15:54

+2

@amnotiam。是的，那真是愚蠢...... :)谢谢。 – gdoron

15

Chrome icon Firefox icon Edge icon Opera icon Safari icon

let elements= document.querySelectorAll('div'); 

Array.from(elements).forEach((el) => { 
    el.innerHTML = "foo"; 
});

Array.from()^MDN
Document.querySelectorAll()

Chrome icon Firefox icon Edge icon IExplor icon Opera icon Safari icon

var elements= document.querySelectorAll('div'); 

[].forEach.call(elements, function(el) { 
    el.innerHTML = "foo"; 
});

Array.prototype.forEach()^MDN

Chrome icon Firefox icon Edge icon IExplor icon Opera icon Safari icon

var elements= document.getElementsByTagName('div'); 

for (var i=0; i<elements.length; i++) { 
    elements[i].innerHTML = "foo"; 
}

Element.getElementsByTagName()^MDN

2015-09-19 04:52:57

1

另一种的版本与新Array.from()方法和arrow functions在ES2015：

Array.from(document.body.getElementsByTagName("div")).forEach(a=>a.innerHTML='foo');

<div></div> 
 
<div></div> 
 
<div>Test</div> 
 
<div></div> 
 
<div>Hello</div> 
 
<div>World</div>

如果大小是你绝对是至关重要的，那么这个解决方案是只有84字节，比@ Roko的回答为113，@ gdoron为120。

在这种情况下，jQuery的可以缩短这个更：

$("body div").html('foo');

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 

 
<div></div> 
 
<div></div> 
 
<div>Test</div> 
 
<div></div> 
 
<div>Hello</div> 
 
<div>World</div>

现在只有26字节！

2016-09-23 19:56:11 StardustGogeta

+0

有趣的例子，但你不能谈论* size *和jQuery导致它是一个在JS之上的库，* *它拥有它自己的大小*。为JS版本BTW竖起大拇指（即使我使用querySelectorAll;） –

2

容易的工作：

NodeList.prototype.forEach = HTMLCollection.prototype.forEach = Array.prototype.forEach;

现在：

// VanillaJS/JavaScript puro 
var lista_de_divs = document.querySelectorAll('div') 
lista_de_divs.forEach(function (div, i) { 
    // código... 
    console.log(i, div) 
}) 


// jQuery 
$('div').forEach(function (div, i) { 
    // código... 
    console.log(i, div) 
})

2017-02-22 12:20:57

相关问题