在JavaScript中在数组中放置多个div

因此，我的标记中有许多

div

，看起来类似于：

<div class="container">
   <div class="wrapper">
      <h3>Title</h3>
      <p>Some text</p>
   </div>
</div>

我现在只展示了一个div，因为我仍然在为for循环而挣扎

有什么帮助/建议吗？ 谢谢

您可以使用来迭代每个

.wrapper

：

var divs = [];
$('div.wrapper').each(function() {
   var $this = $(this);
   divs.push({
       divinfo: {
           title: $this.find('h3').html(),
           description: $this.find('p').html()
       }
   });
});

---

当然，只是一个例子

var divArr = document.getElementsByTagName('DIV');

for (var i= 0; i < divArr.length; i++) {
  if (divArr[i].className !== 'container') {
    divArr[i].title = 'new title';
  }
}

var divArr=document.getElementsByTagName（'DIV'）； 对于（变量i=0；i你在找这样的东西吗

$（文档）.ready（函数（）{
var arrayDivs=[
{
标题：“标题1”，
描述：'这是标题1'的描述，
背景颜色：“灰色”，
颜色：“黑色”
},
{
标题：“标题2”，
描述：'这是标题2'的描述，
背景颜色：“蓝色”，
颜色：“红色”
},
];
函数init（）{
对于（变量i=0；i'；
html+=''；
$（'.container'）.append（html）；
}
};     
init（）；
});

标题
一些文本

他我知道JQuery你可以用这个


var div={
divInfo：[
{
标题：“标题1”，
描述：“1 Lorem ipsum dolor sit amet，Concertetur Adipising”
},
{
标题：“标题2”，
描述：“2 Lorem ipsum dolor sit amet，Concertetur Adipising”
},
{
标题：“标题3”，
描述：“3 Lorem ipsum dolor sit amet，Concertetur Adipising”
},
{
标题：“标题4”，
描述：“4 Lorem ipsum dolor sit amet，Concertetur Adipising”
}        
]
};
$。每个（分区，功能（i，x）{
$（'.container'）.append（''+x.title+''+x.description+'
'））
})
.wrapper{
背景：天蓝色；
保证金：5px；
填充物：5px；
}
如果试图根据信息数组创建HTML元素，可以使用如下代码：

// get the container element in which you want to insert divs
var container = document.querySelector(".container");

// loop through all the elements in your array
for(var i = 0, len = div.divInfo.length; i < len; i++){
    // create the actual div element to insert
    var wrapper = document.createElement("div");
    // specify element attributes here as necessary
    // append the element to the container
    container.appendChild(wrapper);
}

//获取要在其中插入div的容器元素
var container=document.querySelector（“.container”）；
//循环遍历数组中的所有元素
for（变量i=0，len=div.divInfo.length；i

下面是一些工作示例代码：


var div={
divInfo：[
{
标题：“标题”，
描述：“Lorem ipsum dolor sit amet，Concertetur Adipising”
},
{
标题：“另一个标题”，
描述：“Nunc viverra enim.Fusce est.Vivamus a tellus。”
}
]
};
var container=document.querySelector（“.container”）；
for（变量i=0，len=div.divInfo.length；i

只需使用此
文档。getElementsByTagName（'div'）
，然后您就可以对其使用
for
。@MehdiDehghani这将要求div已经存在（当OP希望从脚本创建div时），并且这些div是页面上唯一的div。同样，以这种方式使用嵌套的容器/包装器div也很困难。使用诸如
文档的返回值之类的模板。getElementsByTagName
与
数组
相同，但是活动的，这意味着如果添加/删除
div
（使用javascript或通过控制台），结果将自动刷新。您需要提供一个对象，并使用
for
填充该对象。需要明确的是，您的JavaScript是将HTML写入页面，只是读取现有HTML，还是读取和修改现有HTML？为什么要混合使用vanilla JS和JQuery来构建内容？例如，
''+arrayDivs[i]。title+'
是一个非常糟糕的例子（c.f.XSS）。告诉我，我会帮你的。
// get the container element in which you want to insert divs
var container = document.querySelector(".container");

// loop through all the elements in your array
for(var i = 0, len = div.divInfo.length; i < len; i++){
    // create the actual div element to insert
    var wrapper = document.createElement("div");
    // specify element attributes here as necessary
    // append the element to the container
    container.appendChild(wrapper);
}