DOM 节点的创建、删除、替换
只要在屏幕上托三個button按鈕就可以了，下面就是程序運行時的界面：
?
<head>
??? <title></title>
??? <script type="text/javascript">
??????? function CreateNode() {
??????????? var pnode = document.createElement('p');
??????????? var tnode = document.createTextNode('煙花三月下揚州');
??????????? pnode.appendChild(tnode);
??????????? document.body.appendChild(pnode);
??????? }
??????? function ReplaceNode() {
??????????? var pnode = document.createElement('p');
??????????? var tnode = document.createTextNode('故人西辭黃鶴樓');
??????????? pnode.appendChild(tnode);
??????????? //獲取要替換的p節點
??????????????? var oldnode = document.getElementsByTagName('p')[0];
??????????? oldnode.replaceNode(pnode, oldnode); //此種方法只支持IE
??????????? //oldnode.parentNode.replaceChild(pnode,oldnode);//通用的
??????? }
??????? function RemoveNode() {
??????????? var oldnode = document.getElementsByTagName('p')[0];
??????????? //oldnode.parentNode返回的是p節點的父節點，這里就是body，然后使用body節點的removeChild方法刪除其下面的pnode節點
??????????? oldnode.parentNode.removeChild(oldnode);
??????? }
??? </script>
</head>
<body>
??? <input id="Button1" type="button" value="創建節點" οnclick="CreateNode();"/><br/>
??? <input id="Button2" type="button" value="替換節點" οnclick="ReplaceNode();"/><br/>
??? <input id="Button3" type="button" value="刪除節點" οnclick="RemoveNode();"/>
</body>
當我點擊創建節點時就會出現下面的第一張圖片；當我點擊替換節點時就是下面的第二張圖片的效果；
當我點擊刪除節點時就是下面的第三張圖片，把前面的節點給刪除了。
轉載于:https://www.cnblogs.com/qzc900809/archive/2013/04/16/3024226.html
總結
以上是生活随笔為你收集整理的DOM 节点的创建、删除、替换的全部內容，希望文章能夠幫你解決所遇到的問題。
- 上一篇： localToGlobal 本地转换
- 下一篇： 撑开最外侧的div