任意のDOM要素のJavascriptの単語数

Question

たとえば、div内の単語を数える方法があるのだろうかと思います。私たちはそうのようなdiv要素を持っていると言う：

<div id="content"> 
hello how are you? 
</div> 

そして、JS関数は4

の整数を返してきた、これは可能ですか？私はフォームの要素でこれを行っていますが、非フォームのものではできないようです。

アイデア？

グラム

Answer 1

あなたはDIVはだけそれにテキストを持っているとしていることがわかっている場合は、次のことができKISS：

var count = document.getElementById('content').innerHTML.split(' ').length; 

div要素は、あなたがしている、それにHTMLタグを持つことができる場合

function get_text(el) { 
    ret = ""; 
    var length = el.childNodes.length; 
    for(var i = 0; i < length; i++) { 
     var node = el.childNodes[i]; 
     if(node.nodeType != 8) { 
      ret += node.nodeType != 1 ? node.nodeValue : get_text(node); 
     } 
    } 
    return ret; 
} 
var words = get_text(document.getElementById('content')); 
var count = words.split(' ').length; 

これは、jQueryライブラリがテキストノードを探しているのと同じロジックですその効果は、text()関数の効果です。 jQueryは非常に素晴らしいライブラリで、この場合は必要ありません。しかし、あなたがDOM操作やAJAXをたくさんやっているのを見たら、それをチェックしたいかもしれません。

EDIT：

コメントでガンボで述べたように、我々は上記の文字列を分割する方法は、単語などの2つの連続した空白をカウントします。そのようなことを期待しているのであれば、単純なスペース文字ではなく、正規表現で分割することを避けるのが最善でしょう。

var count = words.split(/\s+/).length; 

我々はsplit関数に渡しているものに唯一の違い：代わりに、上記の分割を行うための、心の中ですることを維持、あなたはこのような何かを行う必要があります。

Answer 2

document.deepText= function(hoo){ 
    var A= []; 
    if(hoo){ 
     hoo= hoo.firstChild; 
     while(hoo!= null){ 
      if(hoo.nodeType== 3){ 
       A[A.length]= hoo.data; 
      } 
      else A= A.concat(arguments.callee(hoo)); 
      hoo= hoo.nextSibling; 
     } 
    } 
    return A; 
} 

私はパオロBergantinoの第二の溶液を開始または空白で終わる空の文字列または文字列のために間違っている

function countwords(hoo){ 
    var text= document.deepText(hoo).join(' '); 
    return text.match(/[A-Za-z\'\-]+/g).length; 
} 
alert(countwords(document.body)) 

Answer 3

は - どのような単語についてかなり厳しいだろう。

var count = !s ? 0 : (s.split(/^\s+$/).length === 2 ? 0 : 2 + 
    s.split(/\s+/).length - s.split(/^\s+/).length - s.split(/\s+$/).length); 

説明：ここでは修正だ文字列が空の場合は、ゼロの言葉があります。文字列に空白だけがある場合、単語はゼロです。そうでなければ、文字列の先頭と末尾のものを除いた空白グループの数を数えます。

Answer 4

それとも、これを行うことができます：それは、少なくとも、それは2つの単語として "単語" がカウントされません

string_var.split(/\s+/).length 

よりも良い方法だよう

function CountWords (this_field, show_word_count, show_char_count) { 
    if (show_word_count == null) { 
     show_word_count = true; 
    } 
    if (show_char_count == null) { 
     show_char_count = false; 
    } 
    var char_count = this_field.value.length; 
    var fullStr = this_field.value + " "; 
    var initial_whitespace_rExp = /^[^A-Za-z0-9]+/gi; 
    var left_trimmedStr = fullStr.replace(initial_whitespace_rExp, ""); 
    var non_alphanumerics_rExp = rExp = /[^A-Za-z0-9]+/gi; 
    var cleanedStr = left_trimmedStr.replace(non_alphanumerics_rExp, " "); 
    var splitString = cleanedStr.split(" "); 
    var word_count = splitString.length -1; 
    if (fullStr.length <2) { 
     word_count = 0; 
    } 
    if (word_count == 1) { 
     wordOrWords = " word"; 
    } else { 
     wordOrWords = " words"; 
    } 
    if (char_count == 1) { 
     charOrChars = " character"; 
    } else { 
     charOrChars = " characters"; 
    } 
    if (show_word_count & show_char_count) { 
     alert ("Word Count:\n" + " " + word_count + wordOrWords + "\n" + " " + char_count + charOrChars); 
    } else { 
     if (show_word_count) { 
      alert ("Word Count: " + word_count + wordOrWords); 
     } else { 
      if (show_char_count) { 
       alert ("Character Count: " + char_count + charOrChars); 
      } 
     } 
    } 
    return word_count; 
} 

Answer 5

string_var.match(/[^\s]+/g).length 

は思わ - [ 'word']ではなく['word']である。そして、実際には面白いアドオンロジックは必要ありません。

Answer 6

Paolo Bergantinoのget_text関数は、2つの子ノードにスペースがない場合、正しく動作しませんでした。例：<h1>見出し</h1 > <p >段落</p >は、見出しとして返されます（単語間にスペースがないことに注意してください）。したがって、nodeValueにスペースを追加すると、これが修正されます。しかし、それはテキストの前にスペースを導入していますが、それを削除する単語カウント関数が見つかりました（プラス、単語数を保証するためにいくつかの正規表現を使用しています）。単語数、編集GET_TEXT機能以下：

function get_text(el) { 
    ret = ""; 
    var length = el.childNodes.length; 
    for(var i = 0; i < length; i++) { 
     var node = el.childNodes[i]; 
     if(node.nodeType != 8) { 
      ret += node.nodeType != 1 ? ' '+node.nodeValue : get_text(node); 
     } 
    } 
    return ret; 
} 

function wordCount(fullStr) { 
    if (fullStr.length == 0) { 
     return 0; 
    } else { 
     fullStr = fullStr.replace(/\r+/g, " "); 
     fullStr = fullStr.replace(/\n+/g, " "); 
     fullStr = fullStr.replace(/[^A-Za-z0-9 ]+/gi, ""); 
     fullStr = fullStr.replace(/^\s+/, ""); 
     fullStr = fullStr.replace(/\s+$/, ""); 
     fullStr = fullStr.replace(/\s+/gi, " "); 
     var splitString = fullStr.split(" "); 
     return splitString.length; 
    } 
} 

EDIT

ケネベックのワードカウンタは本当に良いです。しかし、私が見つけたものには、私が必要としている言葉としての数字が含まれています。それでも、それはケネベックに簡単に加えることができます。しかし、kennebecのテキスト検索機能にも同じ問題があります。

Answer 7

それともハード仕事をするCountable.jsを使用します。）

Answer 8

string_var.match(/[^\s]+/g).length - 1;