时间戳

首页 > 解决方案 > 使用 javascript (ES6) 将标签添加到现有标签的问题

javascript - 使用 javascript (ES6) 将标签添加到现有标签的问题

问题描述

好吧，我试图使用嵌套循环将 100 个 div 标签（具有不同的内容）添加到已经存在的标签中。循环看起来很完美（我已经测试过了）。但是添加创建的潜水存在问题，实际上它们都没有出现在输出中。

javascript

 let result ;
   for(let i = 1 ; i <= 10 ; i++){
       for(let j =1 ; j <= 10 ; j++){
           result = i * j;
           document.getElementById("wrap").write("<div class='box'>"+result+"</div>");
       }
   }

html

<div id="wrap"></div>

我认为问题来自.getByID或.write 我很乐意看到您的意见并感谢您的帮助

标签： javascript

解决方案

元素没有.write方法。

document.querySelector('div').write('bar');
<div>foo</div>

添加innerHTML到wrap

for (let i = 1; i <= 10; i++) {
  for (let j = 1; j <= 10; j++) {
    const result = i * j;
    document.getElementById("wrap").innerHTML += "<div class='box'>" + result + "</div>";
  }
}
<div id="wrap"></div>

或创建一个元素document.createElement并更改其内容。

for (let i = 1; i <= 10; i++) {
  for (let j = 1; j <= 10; j++) {
    const result = i * j;
    const div = document.getElementById("wrap").appendChild(document.createElement('div'));
    div.className = 'box';
    div.textContent = result;
  }
}
<div id="wrap"></div>

推荐阅读