如何使用 javascript 计算包含 html 标签的字数?
How to make a word count that contains html tags using javascript?
您好,我想在我的 RTE(富文本编辑器)中使用 javascript 进行字数统计,也可以使用 jquery。但它不应该计算 html 标签和重复的空格。
示例文本:
<p>11 22 33</p><p>44</p>5<br></div>
javascript 应该只显示 5。
是否有任何 javascript 代码可以快速计算字数?
谢谢!
您可以使用 Countable.js 进行实时字数统计,尽管它不会忽略 HTML 标签。
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 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 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>
尝试这样的事情:
您在 div 中得到 html 然后删除所有标签并用空格替换它们。您删除 (trim) 所有左右空格,最后将字符串拆分为一个数组。长度就是你的答案。
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 33</p><p>44</p>5<br></div>
您好,我想在我的 RTE(富文本编辑器)中使用 javascript 进行字数统计,也可以使用 jquery。但它不应该计算 html 标签和重复的空格。
示例文本:
<p>11 22 33</p><p>44</p>5<br></div>
javascript 应该只显示 5。
是否有任何 javascript 代码可以快速计算字数?
谢谢!
您可以使用 Countable.js 进行实时字数统计,尽管它不会忽略 HTML 标签。
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 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 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>
尝试这样的事情: 您在 div 中得到 html 然后删除所有标签并用空格替换它们。您删除 (trim) 所有左右空格,最后将字符串拆分为一个数组。长度就是你的答案。
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 33</p><p>44</p>5<br></div>