當前位置:
首頁 >
前端技术
> javascript
>内容正文
javascript
JavaScript DOM 向文档添加新的元素
生活随笔
收集整理的這篇文章主要介紹了
JavaScript DOM 向文档添加新的元素
小編覺得挺不錯的,現在分享給大家,幫大家做個參考.
使用document.createElement創建新元素;
使用appendChild()添加到已有元素;
<!DOCTYPE html> <html><head><meta charset="UTF-8"><title></title><style type="text/css">#div1{width: 400px;height: 400px;border:1px solid #000}</style></head><body> <div id="div1"></div> <script type="text/javascript">var para = document.createElement("p");var node = document.createTextNode("這是一個段落XXX。");para.appendChild(node);var para2 = document.createElement("p");var node2 = document.createTextNode("這是另外一個段落XXX。");para2.appendChild(node2);var e = document.createElement("input");e.type = "button";e.value = "這是DOM的小例子";var e2 = document.createElement("select");e2.options[0] = new Option("加載項1", "");e2.options[1] = new Option("加載項2", "");e2.size = "2";var element = document.getElementById("div1");element.appendChild(para);element.appendChild(e);element.appendChild(para2);element.appendChild(e2);</script></body> </html>document.createTextNode 創建一個文本節點;
運行如下;
?
總結
以上是生活随笔為你收集整理的JavaScript DOM 向文档添加新的元素的全部內容,希望文章能夠幫你解決所遇到的問題。
- 上一篇: Linux gcc 基本选项
- 下一篇: 操作系统任务执行和任务切换的基本实现原理