【javaweb】利用DOM操作往DIV塊中新增文字
阿新 • • 發佈:2018-12-10
需求:利用DOM操作往DIV塊中自動新增文字
使用的DOM操作如下:
(1)createTextNode() 建立文字節點
(2)createElement() 建立元素節點
(3)appendchild(node) 插入新節點
分析:
程式碼實現:
<html> <head> <meta charset="utf-8" /> <title></title> <script > function init(){ var div=document.getElementById("div1"); //建立元素節點<p></p> var p=document.createElement("p"); //建立文字節點 var textNode=document.createTextNode("我是內容!") //將文字內容和P標籤進行連線 p.appendChild(textNode); //將P標籤和div塊進行連線 div.appendChild(p); } </script> </head> <body> <input type="button" value="點我新增內容" onclick="init()" /> <div id="div1"></div> </body> </html>
內容示例: