Używanie JQuery do liczenia wszystkich słów w poście na blogu

Question

Próbuję zaimplementować funkcję przy użyciu jQuery, która przeskanuje cały mój blog i obliczy szacowany czas odczytu dla użytkownika.

Obecnie zrobiłem następujące czynności, aby uzyskać ilość słów w każdym akapicie:

$('p').each(function(){ 
    var v = wordCount($(this).html()); 
    totalWords = totalWords + v.words; 
); 

function wordCount(val){ 
      var wom = val.match(/\S+/g); 
      return{ 
      charactersNoSpaces: val.replace(/\s+/g, '').length, 
      characters: val.length, 
      words: wom ? wom.length: 0, 
      lines: val.split(/\r*\n/).length 
    } 
} 

Dziękuję plakatu na to pytanie za wordCount funkcję: Word and Character Count using jQuery

Powyższy działa poprawnie i otrzymuję wynik, którego oczekuję od moich akapitów. Jednak mój blog post będzie składać się z kombinacji h1, h2, h3, h4, h5, h6, ul, ol, span, p, li.

Więc zmodyfikowane mój kod tak:

$('p, h1, h2, h3, h4, h5, h6, ul li, ol li, span').each(function(){ 
    var v = wordCount($(this).html()); 
    totalWords = totalWords + v.words; 
}); 

Ale teraz wyniki są przekrzywione. Na przykład Jeśli mam znacznik span w obrębie akapitu lub elementu listy lub cokolwiek innego, to jest on liczony dwukrotnie.

Tak na przykład ten Markup powinna wrócić 8, zamiast dostać 9.

<ul> 
     <li>This is a test</li> 
     <li>This is <span>another</span> text</li> 
</ul> 

Czy ktoś może mi doradzić w sprawie ewentualnej poprawki, nie jest oczywiście błąd w moim logiki i będę wdzięczny za każdą pomoc.

Dzięki

Answer 1

Zastosowanie text() uzyskać textContent elementu.

var v = wordCount($(this).text()); 

html() Jeśli stosuje się elementy, na przykład <h1> i </h1> będzie liczony jako słowa.

Answer 2

Spróbuj modyfikację

var v = wordCount($(this).html());

do

var v = $(this).clone().children().remove().end().html(); 
v = wordCount(v); 

Źródło: Using .text() to retrieve only text not nested in child tags