如何使用javascript制作包含html标签的单词计数

How to make a word count that contains html tags using javascript?

本文关键字：标签 单词计 html 包含 何使用 javascript      更新时间：2023-09-26

嗨，我想做一个单词计数在我的RTE(富文本编辑器)与javascript也可以使用jquery。但是它不应该计算html标签和重复的空白。

示例文本:

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

javascript应该只显示5。

是否有任何javascript代码，这也是快速计算字数?

谢谢!

试试这样做:你在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>

  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>

您可以通过使用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>

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

相关文章：