原生js添加元素

原生js忘得有点快,话不多说,从今天开始立个flag,一点点总结起来!

关键词:appendChild、innerHTML、insertBefore

<script>
 var oDiv=document.getElementById('div1');
 var oH2=document.createElement('h2');
 oH2.innerHTML='h2h2h2h2h2h2h2';
 //appendChild
 oDiv.appendChild(oH2); 
 //innerHTML
 oDiv.innerHTML+='<h2>hh2h2h2h2h2h2h2h</h2>';
//insertBefore
oDiv.insertBefore(oH2,oDiv.children[0]);    
//appendChild
oDiv.appendChild(oH2);  
</script>
<div id="div1">
    <h3 id="h3">h3h3h3h3h33h3hh3</h3>
 </div>



©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 我们首先要明白,我们给页面添加效果用到的js到底是什么?js其实包含三部分:dom 文档对象模型 bom 浏览...
    一直以来都很好阅读 824评论 0 0
  • 简述JavaScript起源起源于美国的Netscape公司,原名为LiveScript,后改为JavaScrip...
    3ab670b99521阅读 3,110评论 0 0
  • DOM总结 1:DOM - document object model 文档对象模型 作用:给我们提供了一些方法...
    盒小饭stone阅读 656评论 0 0
  • 一、html基础1、你做的页面在哪些流览器测试过?这些浏览器的内核分别是什么?IE: trident内核Firef...
    Smallbore阅读 1,010评论 0 15
  • 夏天了 想请你到乡下来 到我小时候读书的学校里来 到我家大大的院子里来 这里的天很蓝 空气很新鲜 星星和露珠都像清...
    雪小凝阅读 121评论 2 4