最新消息:雨落星辰是一个专注网站SEO优化、网站SEO诊断、搜索引擎研究、网络营销推广、网站策划运营及站长类的自媒体原创博客

javascript - jQuery How to count the no of rows in table by distinct column value - Stack Overflow

programmeradmin7浏览0评论

How can I count the distinct table rows by table column?

Example:

<table>
   <thead> 
      <tr>
        <th>NAME</th>
        <th>TECHNOLOGY</th>
     </tr>
   </thead>
   <tbody>  
     <tr>
        <td>john</td>
        <td>jQuery</td>
    </tr>
    <tr>
       <td>mark</td>
       <td>css</td>
    </tr>
    <tr>
       <td>blah</td>
       <td>css</td>
    </tr>
    <tr>
       <td>abc</td>
       <td>css</td>
    </tr>
    <tr>
       <td>xyz</td>
       <td>jQuery</td>
    </tr>
  </tbody>
</table>

I want Out put:

css : 3
jQuery : 2

here I don't know what technology is e in that cell but, I need to get the no of rows by the technology

Thanks in advance

How can I count the distinct table rows by table column?

Example:

<table>
   <thead> 
      <tr>
        <th>NAME</th>
        <th>TECHNOLOGY</th>
     </tr>
   </thead>
   <tbody>  
     <tr>
        <td>john</td>
        <td>jQuery</td>
    </tr>
    <tr>
       <td>mark</td>
       <td>css</td>
    </tr>
    <tr>
       <td>blah</td>
       <td>css</td>
    </tr>
    <tr>
       <td>abc</td>
       <td>css</td>
    </tr>
    <tr>
       <td>xyz</td>
       <td>jQuery</td>
    </tr>
  </tbody>
</table>

I want Out put:

css : 3
jQuery : 2

here I don't know what technology is e in that cell but, I need to get the no of rows by the technology

Thanks in advance

Share Improve this question edited Jan 20, 2014 at 16:49 Abdullah Ahmed 731 silver badge13 bronze badges asked Jan 20, 2014 at 16:45 sunnysunny 4891 gold badge9 silver badges19 bronze badges 1
  • Check out this question: stackoverflow./questions/15411966/… I think that it could help you :) – Victor Commented Jan 20, 2014 at 16:50
Add a ment  | 

3 Answers 3

Reset to default 7
var byTechnology = {};

$("table tbody td:nth-child(2)").each(function () {
    var tech = $.trim( $(this).text() );

    if ( !(byTechnology.hasOwnProperty(tech)) ) {
        byTechnology[tech] = 0;
    }

    byTechnology[tech]++;
});

console.log(byTechnology);
// {
//     css: 3,
//     jQuery: 2
// }

Call function below on load. Check this jsFiddle out - http://jsfiddle/pqzKa/2/

function count()
{

var map = {};

$("tbody tr td:nth-child(2)").each(function(i, val){
              var key = $(val).text();
               if (key in map)                   
                   map[key]=map[key] + 1;                                    
               else
                   map[key] = 1;                           
              });

var result='';
for(var key in map)
{
 result += key + ':' + map[key] + '\n';   
}
alert(result);
}

The function builds a hashmap called map. It then iterates over the second cell of each tr in tbody and checks to see if it is present in the map. If not, it adds it to the hashmap with a count of 1. If yes, it increments the count by 1. I hope this helps.

Another route might be to write a more generic function for counting people who use certain technologies.

Assuming your using jQuery and your table has an id 'tech' you could do something like this

counter = function(textMatch){
    count=0;
    //loop through all <tr> s
    $('#tech').find('tbody tr').each(function( index ) {
        //if second <td> contains matching text update counter
        if($($(this).find('td')[1]).text() == textMatch){
            count++
        }
    });
    return count;
}

console.log('Number of people using CSS is ' + counter('css'));
console.log('Number of people using CSS is ' + counter('jQuery'));

//and so on
发布评论

评论列表(0)

  1. 暂无评论