Change font size based on number of occurences in text
This is my lame first attempt. I would like to get a count of every unique word in a table. Based on that count, I would like to change the size of the text. I've tried to do this by adding a different class to every column on a table (so the first cell in the column of a table has a 'first' class, and the second cell in a table has a 'second' class in every column. I'm trying to do this programatically so I don't have to brute force a regex for every word that might populate the table. Any steerage in the right direction will be great :)
JS
$(function()
{
var searchTerms = $('.thetable').text(); //get all search terms in table
var words[] = text.split(''); //make them into an array
for(var count =0, count < words.length; count++)
{
$('#results').append(words[i]);
}
if($('.first').length > 1).css({'font-size': 13 + 'px'}))
else if($'.second').length > 1 && < 3).css({'font-size': 16 + 'px'}))
else($('.third').length > 3).css({'font-size':18 + 'px'))
}
});
HTML
<body>
<div id="results"></div>
<table style="width: 35%" cellspacing="1" class="thetable">
<tr >
<td class="fir开发者_StackOverflow社区st">one</td>
<td class="second">three</td>
<td class="third">five </td>
<td class="fourth">six</td>
<td class="fifth">ten</td>
</tr>
<tr>
<td class="first">one</td>
<td class="second">three</td>
<td class="third">five</td>
<td class="fourth">seven</td>
<td class="fifth">ten</td>
</tr>
<tr>
<td class="first">one</td>
<td class="second">four</td>
<td class="third">five</td>
<td class="fourth">eight</td>
<td class="fifth">ten</td>
</tr>
<tr>
<td class="first">two</td>
<td class="second">four</td>
<td class="third">five</td>
<td class="fourth">nine</td>
<td class="fifth">ten</td>
</tr>
</table>
</body>
Why not just use something like $('table.thetable tr').find('td:first') to get the first cells, for example? You don't have to go through the grunt work of tagging the classes explicitly. Or to be more explicit, find('td:eq(2)') and so on.
var tds = $('table td');
var words = [];
tds.each(function() {
var word = $(this).html();
var num = $('td:contains(' + word.toLowerCase().trim() + ')', 'table').length;
if (num <=1) {
$(this).css('font-size', '13px');
} else if(num > 1 && num < 3) {
$(this).css('font-size', '23px');
} else if (num > 3) {
$(this).css('font-size', '60px');
}
});
demo: http://jsfiddle.net/XRpzp/1/
You'll need to reduce the array to a list of words and you'll probably want a count of each:
var words[] = text.split(''); //make them into an array
var o={}
for(var count =0, count < words.length; count++)
{
if(words[i] in o)o[words[i]]++; else o[words[i]]=1;
}
do you want to sort the list of words by count (most to least)?
var i, wordsByCount = [];
for(i in o)wordsByCount.push([o[i],i]);
worsByCount = wordsByCount.sort(sortFunc);
function sortFunc(a,b){return b[0]-a[0];}
for(var count =0, count < wordsByCount.length; count++)
{
$('#results').append(wordsByCount[i][1]);
}
or if you want to show the words and the number of occurances
for(var count =0, count < words.length; count++)
{
$('#results').append(wordsByCount[i][1] + " (" + wordsByCount[i][0] + ")");
}
加载中,请稍侯......
精彩评论