Question

我正在寻找一种方法，用jQuery将一个元素包装成注释，如：

<!--
<div class="my_element"></div>
-->

也是一种删除评论的方法。

这可能吗？

Answer 1

使用注释包装元素，或者更具体地说，用具有该元素的HTML的注释节点替换元素：

my_element_jq = $('.my_element');
comment = document.createComment(my_element_jq.get(0).outerHTML);
my_element_jq.replaceWith(comment);

要将其切换回来：

$(comment).replaceWith(comment.nodeValue);

如果您没有对comment节点的引用，那么您需要遍历DOM树并检查每个节点的nodeType。如果它的值是8那么它就是一个评论。

例如：

<div id="foo">
    <div>bar</div>
    <!-- <div>hello world!</div> -->
    <div>bar</div>
</div>

JavaScript的：

// .contents() returns the children of each element in the set of matched elements,
// including text and comment nodes.
$("#foo").contents().each(function(index, node) {
    if (node.nodeType == 8) {
        // node is a comment
        $(node).replaceWith(node.nodeValue);
    }
});

Answer 2

您可以通过执行以下操作来注释该元素：

function comment(element){
    element.wrap(function() {
        return '<!--' + this.outerHTML + '"-->';
    });
}

样本： http://jsfiddle.net/dirtyd77/THBpD/27/

Answer 3

很抱歉，没有人提供以下解决方案。以下解决方案需要一个容器。该容器内部将包含注释/未注释的代码。

function comment(element) {
    element.html('<!--' + element.html() + '-->')
}

function uncomment(element) {
    element.html(element.html().substring(4, element.html().length - 3))
}

function isCommented(element) {
    return element.html().substring(0, 4) == '<!--';
}

示例：https://jsfiddle.net/ConsoleTVs/r6bm5nhz/

Answer 4

包装？

function wrap(jQueryElement){
    jQueryElement.before("<!--").after("-->");
}

不确定一旦被包裹，你会发现评论有多成功。使用正则表达式对body元素进行文本搜索是一种选择。

或者这 - is it possible to remove an html comment from dom using jquery

jQuery注释/取消注释<！ - element - >

4 个答案: