码迷,mamicode.com
首页 > 编程语言 > 详细

JavaScript插入节点

时间:2015-06-07 18:45:48      阅读:110      评论:0      收藏:0      [点我收藏+]

标签:

1.

 document.write("<p>This is inserted.</p>");

该方法必须加在HTML文档内,违背了结构行为分离原则,不推荐.

2.

window.onload = function() {
  var testdiv = document.getElementById("testdiv");
  testdiv.innerHTML="<p>I inserted <em>this</em> content.</p>";
}

一旦使用innerHTM,某个节点内的内容全部被替换为" "内的内容. innerHTML实现了结构行为分离,但它是一项专利技术,也就是说会有浏览器兼容性.不推荐使用

3.通用性方法

window.onload = function() {
  var para = document.createElement("p");
  var txt1 = document.createTextNode("I inserted ");
  var emphasis = document.createElement("em");
  var txt2 = document.createTextNode("this");
  var txt3 = document.createTextNode(" content.");
  para.appendChild(txt1);
  emphasis.appendChild(txt2);
  para.appendChild(emphasis);
  para.appendChild(txt3);
  var testdiv = document.getElementById("testdiv");
  testdiv.appendChild(para);
}

关键字: createElement  createTextNode appendChild

JavaScript插入节点

标签:

原文地址:http://www.cnblogs.com/xzqhextt/p/4558731.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!