站長資訊網(wǎng)
javascript添加一個(gè)段落的方法：1、通過“document.write”方法插入html段落；2、通過DOM方法插入html段落。
本文操作環(huán)境：windows7系統(tǒng)、javascript1.8.5版，DELL G3電腦
javascript如何添加一個(gè)段落？
javaScript插入html段落方法
傳統(tǒng)方法：
document.write方法
可以直接在需要插入的地方通過script標(biāo)簽插入
<body> <script> document.write("<p>This is inserted.</p>"); </script> </body>
或者挪到外部函數(shù)中
<body> <script> insertParagraph("This is inserted"); </script> ... <script> function insertParagraph(text){ var str = "<p>"+text+"</p>" document.write(str) } </script> </body>
但是怎樣都會(huì)使JavaScript代碼和HTML代碼混雜在一起，不是一種好的做法。
innerHTML屬性
innerHTML即可以寫入html代碼，也可以讀出所選節(jié)點(diǎn)下的html代碼。通過innerHTML插入是直接替換掉了所選節(jié)點(diǎn)下面的全部內(nèi)容。
<div id="insert"> <p>This will be overwritten.</p> </div> <script> window.onload = function(){ var insertDiv = document.getElementById("insert") alert（insertDiv.innerHTML） insertDiv.innerHTML = "<p>This is inserted.</p>" } </script>
DOM方法
createElement方法：document.createElement(nodeName)
創(chuàng)建一個(gè)新元素，下面的代碼就是創(chuàng)建了一個(gè)p元素。
var insertElement = document.createElement("p") appendChild方法：parent.appendChild(child)
讓此節(jié)點(diǎn)成為目標(biāo)節(jié)點(diǎn)的子節(jié)點(diǎn)
var insertElement = document.createElement("p"); document.getElementById("insert").appendChild(insertElement); creatTextNode方法：document.createTextNode(text);
和createElement方法類似，但是創(chuàng)建的是一個(gè)文本節(jié)點(diǎn)
var txt = document.createTextNode("New insert text."); insertElement.appendChild(txt); insertBefore方法： parentElement.insertBefore(newElement,targetElement);
將一個(gè)新元素插到一個(gè)現(xiàn)有元素的前面。其中parentElement是目標(biāo)元素的父元素，newElement是你想插入的元素，targetElement你想插入到它前面的元素。
var newInsertElement = document.createElement("p"); insertDiv.insertBefore(newInsertElement,insertDiv);
推薦學(xué)習(xí)：《javascript高級教程》
