javascript - jQuery counting elements with attributes - Stack Overflow

admin管理员组

文章数量:1317906

I have a jQuery code wich is counting some divs where certain Breakfast board are found as below

var board_bb1 = $('div[data-board="Bed And Breakfast"]').length;
        var board_bb2 = $('div[data-board="Breakfast"]').length;
        var board_bb3 = $('div[data-board="Breakfast Buffet"]').length;
        var board_bb4 = $('div[data-board="Breakfast (Full Breakfast)"]').length;   
        var board_bb5 = $('div[data-board="Continental Breakfast"]').length;
        var board_bb8 = $('div[data-board="Bed and Breakfast"]').length;
        var board_bb6 = $('div[data-board="Full Breakfast"]').length;
        var board_bb7 = $('div[data-board="Breakfast (Continental Breakfast)"]').length;
        var board_bb = board_bb1 + board_bb2  + board_bb3 + board_bb4 + board_bb5 + board_bb6 + board_bb7 + board_bb8;

The attributes from data-board are ing from an API service, and sometimes is breakfast sometimes is Breakfast, bed And Breakfast etc. Is there a way to simply the above code to count all the divs who has the word Breakfast in data-board

I have a jQuery code wich is counting some divs where certain Breakfast board are found as below

var board_bb1 = $('div[data-board="Bed And Breakfast"]').length;
        var board_bb2 = $('div[data-board="Breakfast"]').length;
        var board_bb3 = $('div[data-board="Breakfast Buffet"]').length;
        var board_bb4 = $('div[data-board="Breakfast (Full Breakfast)"]').length;   
        var board_bb5 = $('div[data-board="Continental Breakfast"]').length;
        var board_bb8 = $('div[data-board="Bed and Breakfast"]').length;
        var board_bb6 = $('div[data-board="Full Breakfast"]').length;
        var board_bb7 = $('div[data-board="Breakfast (Continental Breakfast)"]').length;
        var board_bb = board_bb1 + board_bb2  + board_bb3 + board_bb4 + board_bb5 + board_bb6 + board_bb7 + board_bb8;

The attributes from data-board are ing from an API service, and sometimes is breakfast sometimes is Breakfast, bed And Breakfast etc. Is there a way to simply the above code to count all the divs who has the word Breakfast in data-board

• javascript
• jquery

Share Improve this question Follow asked Feb 22, 2015 at 9:18 CARASSCARASS 24533 silver badges1616 bronze badges

Add a ment  | 

2 Answers 2

Sorted by: Reset to default 5

$("div[data-board*='Breakfast']").length

The *= part will look for any attribute containing the word breakfast.

IF you are not using jQuery in your project, in modern browsers this will work to:

document.querySelectorAll("div[data-board*='Breakfast']").length;

To plete it: a cross-browser solution that will work all the way back to IE5.5

var allDivs = document.getElementsByTagName("div");
var count = 0;
for (var i = 0, i < allDivs.length; i++)
{
   if (allDivs[i].getAttribute("data-board") && allDivs[i].getAttribute("data-board").match(/Breakfast/) )
   {
      count++;
   }
}

After this count will return the amount of divs containing the word Breakfast in the data-board attribute

You can use ~ operator

$("div[data-board~='Breakfast']").length

本文标签： javascriptjQuery counting elements with attributesStack Overflow