DOM replaceWith()节点API方法实例页面

回到相关文章 »

效果：

图片前面有段HTML注释，点击下面按钮看看能不能显示出来。

代码：

HTML代码：

<!-- <h4>美女</h4> -->
<img src="mm0.jpg">
<p>图片前面有段HTML注释，点击下面按钮看看能不能显示出来。</p>
<p><button id="btn">点击我</button></p>

JS代码：

var eleBtn = document.getElementById('btn');
eleBtn.addEventListener('click', function () {
    var treeWalker = document.createTreeWalker(document.body, NodeFilter.SHOW_COMMENT);    

    while (treeWalker.nextNode()) {
        var commentNode = treeWalker.currentNode;
        // 替换注释节点为文本节点
        commentNode.replaceWith(commentNode.data);
    }
});

>