DOM 节点的创建、删除、替换
只要在屏幕上托三個(gè)button按鈕就可以了，下面就是程序運(yùn)行時(shí)的界面：
?
<head>
??? <title></title>
??? <script type="text/javascript">
??????? function CreateNode() {
??????????? var pnode = document.createElement('p');
??????????? var tnode = document.createTextNode('煙花三月下?lián)P州');
??????????? pnode.appendChild(tnode);
??????????? document.body.appendChild(pnode);
??????? }
??????? function ReplaceNode() {
??????????? var pnode = document.createElement('p');
??????????? var tnode = document.createTextNode('故人西辭黃鶴樓');
??????????? pnode.appendChild(tnode);
??????????? //獲取要替換的p節(jié)點(diǎn)
??????????????? 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節(jié)點(diǎn)的父節(jié)點(diǎn)，這里就是body，然后使用body節(jié)點(diǎn)的removeChild方法刪除其下面的pnode節(jié)點(diǎn)
??????????? oldnode.parentNode.removeChild(oldnode);
??????? }
??? </script>
</head>
<body>
??? <input id="Button1" type="button" value="創(chuàng)建節(jié)點(diǎn)" οnclick="CreateNode();"/><br/>
??? <input id="Button2" type="button" value="替換節(jié)點(diǎn)" οnclick="ReplaceNode();"/><br/>
??? <input id="Button3" type="button" value="刪除節(jié)點(diǎn)" οnclick="RemoveNode();"/>
</body>
當(dāng)我點(diǎn)擊創(chuàng)建節(jié)點(diǎn)時(shí)就會(huì)出現(xiàn)下面的第一張圖片；當(dāng)我點(diǎn)擊替換節(jié)點(diǎn)時(shí)就是下面的第二張圖片的效果；
當(dāng)我點(diǎn)擊刪除節(jié)點(diǎn)時(shí)就是下面的第三張圖片，把前面的節(jié)點(diǎn)給刪除了。
轉(zhuǎn)載于:https://www.cnblogs.com/qzc900809/archive/2013/04/16/3024226.html
總結(jié)
以上是生活随笔為你收集整理的DOM 节点的创建、删除、替换的全部?jī)?nèi)容，希望文章能夠幫你解決所遇到的問(wèn)題。
- 上一篇： localToGlobal 本地转换
- 下一篇： 撑开最外侧的div