如何使用javascript使包含html标记的字数统计？

Question

嗨，我想用javascript在我的RTE（Rich Text Editor）中进行字数统计，也可以与jquery一起使用。 但是它不应该统计html标签和重复的空格。

示范文本：

<p>11 22&nbsp; 33</p><p>44</p>5<br></div>

javascript应该只显示5。

是否有任何javascript代码可以快速计算字数？

谢谢！

Answer 1

尝试如下操作：在div中获取html，然后删除所有标签并将其替换为空格。 删除（修剪）所有左右空格，最后将字符串拆分为一个数组。 长度就是您的答案。

 var cont = $("#content").html(); cont = cont.replace(/<[^>]*>/g," "); cont = cont.replace(/\\s+/g, ' '); cont = cont.trim(); var n = cont.split(" ").length alert(n); 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> <div id="content"> <p>11 22&nbsp; 33</p><p>44</p>5<br></div> 

Answer 2

  var words = []; function getWords(elements) { elements.contents().each(function() { if ($(this).contents().length > 0) return getWords($(this)); if ($(this).text()) words = words.concat($(this).text().split(" ")); }) } getWords($('<div>').html('<p>11 22&nbsp; 33</p><p>44</p>5<br></div>')); console.log(words,words.length); 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 

Answer 3

您可以通过使用jQuery创建带有内容的元素来完成一些棘手的事情。

 var str = '<p>11 22&nbsp; 33</p><p>44</p>5<br></div>'; var len = 0; // create a temporary jQuery object with the content $('<div/>', { html: str }) // get al child nodes including text node .contents() // iterate over the elements .each(function() { // now get number or words using match and add len += (this.textContent.match(/[\\w\\d]+/g) || '').length; }); console.log(len); 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 

Answer 4

您可以使用Countable.js进行实时单词计数，尽管它不会忽略HTML标签。