-1

我在 html 中有一个 div,其中包含一个按钮和 2 个标签,我想通过在单独的另一个 div 中循环创建相同的 div 其 id (DivBtn)。这意味着我想在另一个 div 中通过其 ID 多次创建 div

function wardDetlData(data) {

  var toAdd = document.createDocumentFragment();
  for (var i = 0; i < data.length; i++) {
    var newDiv = document.createElement('divBtn');
    newDiv.id = 'divBtn';
    newDiv.className = 'Boxed';
    $("#DivBedOccupancy").append(newDiv);
  }
};

我已经尝试了以下方法:

<div class="boxed" id="divBtn" style="margin-top:8px;">
  <div style="margin-left:20px; margin-top:5px;">
    <button class="btn btn-primary btn-sm" style="background-color:#FF8C00" id="btnAdd" onclick="OnAdd()"><b>GENRAL WARD</b></button>
  </div>
  <br />
  <label><b>REQ CATGEGORY - XXX</b></label><br />
  <label><b>ALLOT CATEGORY - XXX</b></label><br />
  <label><b>TOTAL BED - XXX</b></label><br />
</div>

这是我想通过循环多次创建的 DIV。

4

2 回答 2

0

使用反引号 (``)获取 newDiv 中的动态数据,希望对您有所帮助。

function wardDetlData(data) {
var newDiv ='';
  var toAdd = document.createDocumentFragment();
  for (var i = 0; i < data.length; i++) {
    newDiv+ = `<div id='divBtn' class='boxed'></div>`;
  }
$("#DivBedOccupancy").append(newDiv);

};
于 2019-07-03T06:17:38.440 回答
0

具有多个相同元素的 HTML 文档ID不是有效的 HTML 。但是,如果您想在多个元素中使用相同的规则集,您应该使用class

有关更多详细信息,请参阅此文档

而且在您的代码中还有一个小错字

var newDiv = document.createElement('divBtn')

但这会创建<divBtn></divBtn>而不是<div></div>(如假设的那样)所以它应该是

var newDiv = document.createElement('div')
于 2019-07-03T06:17:00.317 回答