（1）使用document.write()
（2）使用innerhtml
innerhtml可以用來讀寫某給定元素裡的
html
內容。舉例：
this is mycontent
window.onload = function()
輸出：this is mycontent
innerhtml的屬性：只有乙個取值為
this is mycontent
的字串。
可見：innerhtml
屬性無細節可言，而
dom提供的方法和屬性則可以讓我們對
div節點中的任何乙個進行細節的訪問。但是，當你需要把一大段的
html
內容插入乙個網頁時，
innerhtml
會更加實用。不僅可以讀取元素的
html
內容，還可以用它把
html
內容寫入元素。請注意，標準的
dom是可以替代
innerhtml
的，只是要多編寫一些**。
舉例：window.onload = function()
（3）理解以動態的方式建立html
內容改變dom
節點樹就能以動態的方式建立
html
內容根據dom
，乙個文件就是一棵節點樹，如果想把一些
html
的內容【
p/ul/li
】新增到文件中，就必須在相應的
dom節點樹上插入元素節點。如果想要在節點樹上新增內容【文字，屬性，元素】，就必須插入新的節點。
（4）使用dom
① 插入新的元素節點
createelement()：建立元素節點
舉例：現在我們以dom
的標準而不是
innerhtml
的標準來改變
dom節點樹。
步驟1）建立乙個新的元素
var para = document.createelemnet("p");
在這一步之後，p
元素以in
個有了乙個
nodetype
和nodename
屬性2）把這個新元素插入節點樹
首先，我們要獲取要插入的節點的父節點，因為p
節點是div
的子節點，因此，我們要獲得
div節點。因此，現在的操作如下：
//1 獲取父節點
var testdiv = doucment.getelementbyid("testdiv");
//2 創造新的子節點
var para = document.createelemnet("p");
//3 將新的子節點插入到父節點中
② 建立新的文字節點
createtextnode():建立文字節點
//1 建立文字節點
var txt = document.createtextnode("hello world");
//2 找到要插入的節點
var p = document.getelementbytagname("p");
//3 在都沒中插入文字節點
③ insertbefore():把乙個新元素插入到乙個現有元素之前
（5）總結
① 使用document.write()
方法/innerhtml
屬性/dom
方法都能夠想瀏覽器裡的文件動態新增
html
內容。② 使用createelement
或是createtextnode
方法建立的節點是
js世界的孤兒，你還需要使用
方法或者
insertbefore()
方法把這些"碎片
"物件插入到某個文件的節點樹上才能讓他們呈現在瀏覽器的視窗裡。
③ 在需要檢索文件的現有資訊時，以下的dom
方法最有用
getelementbyid()
getelementbytagname()
getattribute()
④ 在需要把資訊新增到文件裡去時，以下dom
方法最有用
createelement()
createtextnode()
insertbefore()
setattribute()
動態建立HTML內容
1 document.write 用來向html中插入東西，例入 是很經典的方法，但是盡量避免在body中插入它 違反了js和html分離的原則，靈活性不高 2 innerhtml 微軟自家的專利，始見於ie4。元素節點的innerhtml是乙個字串而不是dom樹，它沒有什麼細節可言，但是卻大大地方...
js動態建立div
js動態建立div1.建立某個標籤 如下在body中建立乙個div的事例 function fun 2.新增屬性 給建立的標籤新增相應的屬性 framediv setattribute id divid 給建立的div設定id值 framediv classname divclass 給建立的div...
js動態建立svg
下面的這段寫法，可以做到在原生js中，動態插入能相容ios7 8的svg影象，ios7 8命名空間的ns物件的直接innerhtml寫入應該是有問題。var icon document.createelementns svg 建立帶有標準svg命名空間的節點 svghack document.cre...