您好,登錄后才能下訂單哦!
本文小編為大家詳細介紹“javascript如何添加一個段落”,內容詳細,步驟清晰,細節處理妥當,希望這篇“javascript如何添加一個段落”文章能幫助大家解決疑惑,下面跟著小編的思路慢慢深入,一起來學習新知識吧。
javascript添加一個段落的方法:1、通過“document.write”方法插入html段落;2、通過DOM方法插入html段落。
本文操作環境:windows7系統、javascript1.8.5版,DELL G3電腦
javascript如何添加一個段落?
javaScript插入html段落方法
傳統方法:
document.write方法
可以直接在需要插入的地方通過script標簽插入
<body> <script> document.write("<p>This is inserted.</p>"); </script> </body>
或者挪到外部函數中
<body> <script> insertParagraph("This is inserted"); </script> ... <script> function insertParagraph(text){ var str = "<p>"+text+"</p>" document.write(str) } </script> </body>
但是怎樣都會使JavaScript代碼和HTML代碼混雜在一起,不是一種好的做法。
innerHTML屬性
innerHTML即可以寫入html代碼,也可以讀出所選節點下的html代碼。通過innerHTML插入是直接替換掉了所選節點下面的全部內容。
<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)
創建一個新元素,下面的代碼就是創建了一個p元素。
var insertElement = document.createElement("p") appendChild方法:parent.appendChild(child)
讓此節點成為目標節點的子節點
var insertElement = document.createElement("p"); document.getElementById("insert").appendChild(insertElement); creatTextNode方法:document.createTextNode(text);
和createElement方法類似,但是創建的是一個文本節點
var txt = document.createTextNode("New insert text."); insertElement.appendChild(txt); insertBefore方法: parentElement.insertBefore(newElement,targetElement);
將一個新元素插到一個現有元素的前面。其中parentElement是目標元素的父元素,newElement是你想插入的元素,targetElement你想插入到它前面的元素。
var newInsertElement = document.createElement("p"); insertDiv.insertBefore(newInsertElement,insertDiv);
讀到這里,這篇“javascript如何添加一個段落”文章已經介紹完畢,想要掌握這篇文章的知識點還需要大家自己動手實踐使用過才能領會,如果想了解更多相關內容的文章,歡迎關注億速云行業資訊頻道。
免責聲明:本站發布的內容(圖片、視頻和文字)以原創、轉載和分享為主,文章觀點不代表本網站立場,如果涉及侵權請聯系站長郵箱:is@yisu.com進行舉報,并提供相關證據,一經查實,將立刻刪除涉嫌侵權內容。