forEach循环在li标签内的div中插入名称 [英] forEach loop to insert name in div inside li tag

问题描述

< pre class = snippet-code-js lang-js prettyprint-override> var elements = ['rock'，'paper'，'scissor']; demoP = document.getElementById（ demo） ; elements.forEach（function（item，index）{demoP.innerHTML = demoP.innerHTML + index [ + index +]： + item +< br>;}））;

 < ul> < li> < div style = border：5px纯黑色； id = div_demo> < p id = demo>< / p> < / div> < / li>< / ul>  

您好，

我是JavaScript新手。我想在li内的单独 div标签中显示数组名称。到目前为止，我已经设法使数组列表在单个div&中显示一个在另一个下面。 。我想在li内的单独 div中显示每个名称。

解决方案

只需在div，并在每次迭代中将其附加到文档中。

  var elements = [ 'rock'，'paper'，'scissor']； demoP = document.getElementById（ demo）; elements.forEach（function（item，index）{newlistitem = document.createElement（ li）; newdiv = document.createElement（ div）; newdiv.setAttribute（ style， border：5px solid black;） ; newdiv.setAttribute（ id， div_demo）; newdiv.innerHTML = index [ + index +]： + item +< br>; demoP.appendChild（newlistitem）; newlistitem.appendChild（ newdiv）;}）;  

 < ul> < p id = demo>< / p>< / ul>  

希望有帮助！

var elements = ['rock', 'paper', 'scissor'];
demoP = document.getElementById("demo");

elements.forEach(function(item, index) {
  demoP.innerHTML = demoP.innerHTML + "index[" + index + "]: " + item + "<br>";
});

<ul>
  <li>
    <div style="border: 5px solid black;" id="div_demo">
      <p id="demo"></p>
    </div>
  </li>
</ul>

Hi,

I'm new to JavaScript. I want to display array names in separate div tag inside li. So far I have managed to get array list to display one below another in single div & li. I want to display each name in separate div inside li.

解决方案

Just add every li in a div and append it to the document in every iteration.

  

var elements = ['rock', 'paper','scissor'];
  
  demoP = document.getElementById("demo");
  elements.forEach(function(item, index) {
  
  newlistitem = document.createElement("li"); 
  newdiv = document.createElement("div");
  newdiv.setAttribute("style", "border: 5px solid black;");
  newdiv.setAttribute("id", "div_demo");
	
  newdiv.innerHTML = "index[" + index + "]: " + item + "<br>";
  
  demoP.appendChild(newlistitem);
  newlistitem.appendChild(newdiv);

});

<ul>	
  <p id="demo"></p>
</ul>

Hope this helps!!

这篇关于forEach循环在li标签内的div中插入名称的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！