您如何使用 Javascript 添加或刪除 HTML/CSS 代碼？

Question

如果我有一堆 HTML 代碼，類似於以下內容：

<div id='test0div'>
   <p id='test0'></p>
</div>

我如何使用 JavaScript 添加或刪除更多的那些 - 即

<div id='test1div'>
   <p id='test1'></p>
</div>
<div id='test2div'>
   <p id='test2'></p>
</div>

...等等。？

Answer 1

要刪除您可以使用

$('#id').remove();

添加你可以使用

$("<div id='new'></div>").appendTo('#id');

Answer 2

var container = document.createElement("div");
for(var i=0; i<5; i++) { // change i <5 as per your data source
   var div = document.createElement("div");
   var p = document.createElement("p");
   p.id = "test"+i;
   div.id = "test"+i+"div";
   div.appendChild(p);
   container.appendChild(div); // you can event append to particular id or body    
}

   // document.getElementById("divId").appendChild(container);

container ，將擁有您希望的所有 divs & p 這將為您提供所需的輸出。 只需根據您的意願更改循環執行的次數。