JavaScript 获取字符串的实际长度（没有实体）答案

【问题标题】：JavaScript Get real length of a string (without entities)JavaScript 获取字符串的实际长度（没有实体）
【发布时间】：2011-01-24 23:06:09
【问题描述】：

我需要确定可能包含 html-entities 的字符串的长度。

例如“↓” (↓) 将返回长度 6，这是正确的，但我希望这些实体仅计为 1 个字符。

【问题讨论】：

标签： javascript html-entities

【解决方案1】：

<div id="foo">&darr;</div>

alert(document.getElementById("foo").innerHTML.length); // alerts 1

因此，基于该原理，创建一个 div，将您的混合实体缠绕字符串附加到它，提取 HTML 并检查长度。

var div = document.createElement("div");
div.innerHTML = "&darr;&darr;&darr;&darr;";
alert(div.innerHTML.length); // alerts 4

Try it here.

为方便起见，您可能希望将其放入函数中，例如：

function realLength(str) { // maybe there's a better name?
    var el = document.createElement("div");
    el.innerHTML = str;
    return el.innerHTML.length;   
}

【讨论】：

我 modified the fiddle 并针对我发布的基于库的解决方案的输入和输出测试了该解决方案，但存在一些不一致之处。即，我输入一个编码输入并得到 110 个字符，然后输入一个相同数据的解码输入并得到 96 个字符。不知道为什么，但可能值得一试。
@Nathan Taylor - 不一致可能是由 jQuery 的 .val 或换行符引起的。
@Nathan - 使用 DOM .value 属性的第二次更新似乎工作得很好，前提是您没有在文本区域的任何地方按 Enter 键（每个 \n == 1 字符）：jsfiddle.net/e89hJ/2

【解决方案2】：

由于目前还没有使用 jQuery 的解决方案：

var str = 'lol&amp;';
alert($('<span />').html(str).text().length); // alerts 4

使用与 karim79 相同的方法，但它从不将创建的元素添加到文档中。

【讨论】：

也许我遗漏了一些东西，但卡里姆的回答也没有将元素添加到文档中。
嗯好的，看来我只看了他一半的答案（或者他编辑了它）

【解决方案3】：

在大多数情况下，您可以假设一个字符后跟一个字符，或者一个可能的“#”和数字，后跟一个分号。

var strlen=string.replace(/&#?[a-zA-Z0-9]+;/g,' ').length;

【讨论】：

【解决方案4】：

如果您在浏览器中运行 javascript，我建议您使用它来帮助您。您可以创建一个元素并将其 innerHTML 设置为包含 HTML 实体的字符串。然后将您刚刚创建的那个元素的内容提取为文本。

这是一个示例（使用 Mootools）：http://jsfiddle.net/mqchen/H73EV/

【讨论】：

【解决方案5】：

不幸的是，JavaScript 本身并不支持 HTML 实体的编码或解码，这是您需要做的才能获得“真正的”字符串长度。我能够找到这个能够解码和编码 HTML 实体的第三方库，并且它似乎运行良好，但无法保证它会是多么完整。

http://www.strictly-software.com/htmlencode

【讨论】：

【解决方案6】：

使用 ES6（引入codePointAt()：

function strlen (str) {
    let sl = str.length
    let chars = sl
    for (i = 0; i < sl; i++) if (str.codePointAt(i) > 65535) {
       chars--;
       i++;
    }
    return chars
}

注意charCodeAt() 的工作方式不同。

【讨论】：