JS替换节点

    <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 r() {             var pNode = document.createElement('p');             var tNode = document.createTextNode('故人西辞黄鹤楼');             pNode.appendChild(tNode);

            //获取要替换的节点             var reNode = document.getElementsByTagName('p')[0];             //这种方法只适用于IE浏览器             //reNode.replaceNode(pNode, reNode);

            //适用于各种浏览器             reNode.parentNode.replaceChild(pNode, reNode);         }

        function reNode() {             var oldNode = document.getElementsByTagName('p')[0];             //oldNode.parentNode返回的是p节点的父节点,这里就是body             //然后使用body节点的removeChild方法删除下的oldNode节点             oldNode.parentNode.removeChild(oldNode);

        }     </script> </head> <body>     <input id="Button1" type="button" value="创建节点" onclick="createNode()"/>     <input id="Button2" type="button" value="替换节点" onclick="r()" />     <input id="Button3" type="button" value="删除节点" onclick="reNode()" /> </body> </html>

posted @ 2013-04-16 19:25  奇奇博客  阅读(379)  评论(0编辑  收藏  举报