JavaScript插入節點

標籤：

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插入節點