js有没有像jquery的append一样方法拼接html？

appendchild只能节点，有没有直接拼html代码的方法呢？

<html>
<body>
  <ul id="ul1">
     <li>jjj</li>
     <li>ddd</li>
  </ul>
<script>
var html="<li>qqq</li><li>www</li>";
 document.getElementsTagName("ul")[0].appendChild(html);
</script>
</body>
</html>

前端 javascript jquery

阅读 72.1k

3 个回答

whosesmile

<script type="text/javascript">
  
  
  function append(parent, text) {
    if (typeof text === 'string') {
      var temp = document.createElement('div');
      temp.innerHTML = text;
      // 防止元素太多 进行提速
      var frag = document.createDocumentFragment();
      while (temp.firstChild) {
        frag.appendChild(temp.firstChild);
      }
      parent.appendChild(frag);
    }
    else {
      parent.appendChild(text);
    }
  }

  window.onload = function() {

    var text = '<h4>Welcome!</h4><ul><li>A</li><li>B</li><li>C</li></ul><p>Hello, World</p>';
    append(document.body, text);

  };

</script>

补充一句，可以不使用fragment，使用原因解释在这：http://mdn.beonex.com/en/DOM/document.createDocumentFragment.html