jquery - 计算字符串中的字符数但想跳过注释

Question

我想计算从 div 标签中提取的字符串中的字符数，如下所示：

$(".welcome-msg").html().length;

但是，它将 HTML 注释计为标记内的字符。因此，当我希望结果为 0 时，由于这些评论，我得到 99，而且我无法判断评论是否是动态的。有没有一种简单的方法可以确保评论不被计算在内？还是我必须为此编写正则表达式？

谢谢，

Answer 1

您可以过滤掉评论，但这并不容易。我将向您展示如何在第一级过滤它们，这很容易，但如果它们嵌套在其他标签中，那么您需要执行额外的逻辑。

关键是要.contents()得到所有的节点。这包括评论节点。然后，您可以通过对nodeType进行比较来过滤掉注释节点。

所以它会是这样的：

$(".welcome-msg").contents().filter(function() { 
  return this.nodeType != 8;
}).appendTo("<div>").parent().html();

这将适用于

<div class=".welcome-msg">
   <!--Comment --><span>hello</span>
</div>

但不是为了

<div class=".welcome-msg">
    <span><!--Comment -->hello </span> world 
</div>

您需要递归地遍历所有标签，然后它将适用于所有内容。

使用正则表达式，您需要注意<script>标签和<style>标签。

这是jsfiddle

更新（递归过滤器）

递归地执行它实际上很容易：

http://jsfiddle.net/xYR5p/3/

为它制作了一个完整的插件：

$.fn.removeComments = function() {
    this.contents().filter(function() {
        return this.nodeType == 8;  
    }).remove();
    
    this.children().each(function() {
       $(this).removeComments(); 
    });
    
    return this;
};


console.log($(".welcome-msg").clone().removeComments().html());​

Answer 2

var myhtml = $(".welcome-msg").html();
myhtml = myhtml.replace(/<!--.*?-->/sg, ""); 
myhtml.length();

regex from here StackOverflow: Remove HTML comments with Regex, in Javascript