Question

我希望能够获得最多每个[class^="something-"]

的字符数

这是文本块的示例。

<div class="intro">
    Lorem dolor sit<br>
    <span class="icon-pin"></span> consectetur<br>
    adiposcing elit, sed do <span class="icon-hand"></span> lorem<br>
    ipsum dolor sit amet.
</div>

这是我到目前为止将内容转换为格式以便我可以计算字符数（减去特定标记，换行符和大于1个空格的空格）

$('[class^="icon-"]', '.intro-title').each(function(index, element){

    var textToIcon = $.trim(
                    $('.intro')
                        .html() // Get HTML code
                        .replace(/[<]p[^>]*[>]/gi, '') // Remove <p> tags
                        .replace(/[<]br[^>]*[>]/gi, '') // Remove <br> tags
                        .replace('&nbsp;', '') // Remove `&nbsp`
                        .replace(/\n+/g, '') // Remove line breaks
                        .replace(/  +/g, ' ') // Remove whitespace larger than one space
                        .replace('&nbsp;', '') // Remove `&nbsp`
                );
});

以上JS将输出：

Lorem dolor sit <span class="icon-pin"></span> consectetur adiposcing elit, sed do <span class="icon-hand"></span lorem ipsum dolor sit amet.

我想知道获取字符数的最佳方法，直到每个span标记包含一个从字符串开头有icon-的类。

例如，第一个[class^="icon-"]之前的字符数 16 Lorem dolor sit

由于

Answer 1

如果可以在一个范围内包装文本的每个部分，那么这将更容易实现：

＆＃13;

var element = $('.intro span:first-child').text();
console.log(element.length);

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<div class="intro">
  <span>Lorem dolor sit</span><br>
  <span class="icon-pin"></span> consectetur<br> adiposcing elit, sed do <span class="icon-hand"></span> lorem<br> ipsum dolor sit amet.
</div>

＆＃13;

Answer 2

您可以使用现有的HTML和JavaScript代码执行此操作，如下所示：

    var spansOnly = "Lorem dolor sit <span class=\"icon-pin\"></span> consectetur adiposcing elit, sed do <span class=\"icon-hand\"></span lorem ipsum dolor sit amet.";
    var reg = /<span[^<]* class=\"[^"]+[^>]*><\/span>/g;
    var textRuns = spansOnly.split(reg);
    var $body = $("body");
    for(var i = 0; i < textRuns.length; i++) {
       $body.append($("<div>" + textRuns[i].length + ": " + textRuns[i] + "</div>"));
    }

这里是JS fiddle。

使用js计算字符串中<span>的字符数

2 个答案: