kaifazheTT

js 动态添加标签 div

 

html:

<div id="container" class="layui-input-block" style="margin-top:10px;margin-left: 20px">
  <span id="add" class="layui-badge layui-bg-green" style="cursor: pointer;">+</span>
</div>

 

js:

var num= 1; var add = document.getElementById(\'add\');
var container =document.getElementById(\'container\'); 
var node=container.nextSibling;
add.onclick = function(){
  oDiv = document.createElement(\'div\');
  oDiv.innerHTML = "<div class=\'layui-input-block\' style=\'margin-top:2px;margin-left: 10px\' id=\'container"+num+"\'>"+
    "<input type=\'text\' id=\'test\'>"+
    "<span onclick=\'test(this)\' class=\'layui-badge layui-bg-green\' style=\'cursor: pointer;\'>-</span>"+
    "</div>";
  container.parentNode.insertBefore(oDiv, node)
  node=oDiv.nextSibling;

  num++;
  }
function test(test){
  test.parentNode.parentNode.removeChild(test.parentNode);
}

分类:

技术点:

相关文章: