Here is my markup:
<body>
<div id="headbox">
<p>Whatever...</p>
</div>
<div id="feed">
<div>
<p>I hate cats</p>
</div>
<div>
<p>I like cats</p>
</div>
<div>
<p>I like cats</p>
</div>
<div>
<p>I like cats</p>
</div>
</div>
</body>
The deal is I need a script that counts all words which appear in the <div id="feed">
.
The output should be wrapped in <p>
tags or <span>
tags.
<h3>The top 3 used words in this feed:</h3>
1. <p>cats</p> 4x
2. <p>like</p> 3x
3. <p>hate</p> 1x
This would be the output.
As you can see the word (or better the letter) I
was not considered. Every word under 3 letters will be not considered by the counting.
Here is my markup:
<body>
<div id="headbox">
<p>Whatever...</p>
</div>
<div id="feed">
<div>
<p>I hate cats</p>
</div>
<div>
<p>I like cats</p>
</div>
<div>
<p>I like cats</p>
</div>
<div>
<p>I like cats</p>
</div>
</div>
</body>
The deal is I need a script that counts all words which appear in the <div id="feed">
.
The output should be wrapped in <p>
tags or <span>
tags.
<h3>The top 3 used words in this feed:</h3>
1. <p>cats</p> 4x
2. <p>like</p> 3x
3. <p>hate</p> 1x
This would be the output.
As you can see the word (or better the letter) I
was not considered. Every word under 3 letters will be not considered by the counting.
-
1
Have you tried
I like turtles
? – vol7ron Commented Sep 29, 2011 at 14:22 - 1 Yes. Turtles make great pets. You should try turtles. :) – Jonathan M Commented Sep 29, 2011 at 14:26
- Not to be a jerk but this question deserves to be downvoted because it "does not show any research effort". Come on, Tomkay, you've gotta at least try something... – maerics Commented Sep 29, 2011 at 14:56
3 Answers
Reset to default 8Just loop through the innerHTMLs, split the text on spaces, and use each value of the resulting array to add to or update a master array indexed by the words found with values being the counts of the words.
Split the inner text of the target element by whitespace, count the word frequency, sort by most frequent, and format the top 3 per your requirements.
Something like this (untested):
var getMostFrequentWords = function(words) {
var freq={}, freqArr=[], i;
// Map each word to its frequency in "freq".
for (i=0; i<words.length; i++) {
freq[words[i]] = (freq[words[i]]||0) + 1;
}
// Sort from most to least frequent.
for (i in freq) freqArr.push([i, freq[i]]);
return freqArr.sort(function(a,b) { return b[1] - a[1]; });
};
var words = $('#feed').get(0).innerText.split(/\s+/);
var mostUsed = getMostFrequentWords(words);
// Now you can prepare "mostUsed.slice(0,3)" as the top 3 words/count.
You'll need to modify it to reject words shorter than 3 characters but you get the idea.
var text = document.getElementById('myDiv').textContent.split(' ');
var words = {};
text.forEach(function(n, i, ary){
if(n.length > 3) {
words[n] = (words[n] || 0) + 1;
}
});
That's what I would do to sort the words. And in the HTML somewhere I will have an ol element for auto-numbering
var ol = document.getElementById('myOl');
var sorted_words = [];
for(var i in words) if(words.hasOwnProperty(i) {
sorted_words.push([i, words[i]]);
}
sorted_words.sort(function(a, b){
return b[0] - a[0];
})
.reverse()
.slice(0, 3)
.forEach(function(n, i, ary){
var li = document.createElement('li')
.appendChild(document.createElement('p'))
.textContent = n[1] + " " + n[0] + "x";
ol.appendChild(ul);
});
Something like this should work...