Jquery виділяє всі елементи, які мають $ jquery.data ()

Виберіть елементи, які я раніше встановлював jquery.data();

тобто виділіть усі елементи з .data('myAttr')уже встановленими.

РІШЕННЯ

Jsfiddle для демонстрації - це Fiddle

Ви могли б це зробити

$('[data-myAttr!=""]'); 

це вибирає всі елементи, які мають атрибут, data-myAttrякий не дорівнює '' (тому він повинен бути встановлений);

Ви також можете використовувати filter ()

$('*').filter(function() {
    return $(this).data('myAttr') !== undefined;
});

Найкращий і простий спосіб їх вибрати:

$('[data-myAttr]')

Більше інформації:

Я тестував багато речей.

Використання $('[data-myAttr!=""]')працює не у всіх випадках. Оскільки елементи, які не мають data-myAttrнабору, матимуть їх data-myAttrрівними undefinedі також $('[data-myAttr!=""]')будуть вибирати ті, що є неправильним.

Ви можете використовувати filter () :

var elements = $("*").filter(function() {
    return $(this).data("myAttr") !== undefined;
});

Ви можете використовувати це розширення jQuery Selector: Запит даних елемента

$(':data');       // All elements with data  
$(':not(:data)'); // All elements without data

Ви можете використовувати інтерфейс користувача JQuery з селектором: data ()

Вибирає елементи, які містять дані, що зберігаються під вказаним ключем.

Перевірте цей jsfiddle для прикладу

Для отримання відповідності всіх елементів .data('myAttr')ви можете використовувати

var matches = $(':data(myAttr)');

Це повинно працювати для обох елементів з data-атрибутами та елементами з даними , збереженими з використанням , $.data()тому що

З jQuery 1.4.3 атрибути даних HTML 5 автоматично втягуються в об'єкт даних jQuery.

Але це працює не дуже добре. Перевірте цей jsfiddle, і ви побачите, що вдруге, коли селектор викликається, він повинен відповідати 2 елементам і відповідає лише одному. Це пов'язано з "помилкою" в бібліотеці jquery-ui.

Це взято з основного файлу jquery-ui.

 $.extend( $.expr[ ":" ], {
    data: $.expr.createPseudo ?
        $.expr.createPseudo(function( dataName ) {
            return function( elem ) {
                return !!$.data( elem, dataName );
            };
        }) :
        // support: jQuery <1.8
        function( elem, i, match ) {
            return !!$.data( elem, match[ 3 ] );
        }
});

Як бачите, вони використовують $.data(elem, match)замість цього, $(elem).data(match)що призводить до того, що кеш не оновлюється, якщо ви запитуєте елементи з data-атрибутами. Якщо елемент протестовано для data()зберігання, це працює добре, але якщо ні, то він не буде включений в отримані збіги.

Можливо, це зовсім не помилка, якщо те, що ви хочете, це відповідати лише елементам із заданою вами інформацією про дані, але якщо ні, то вам залишаються два варіанти.

1. Не використовуйте jquery-ui та не розширюйте власний псевдоселектор $(:mydata(myAttr))

   $.extend($.expr[":"], {
      mydata: $.expr.createPseudo ?
      $.expr.createPseudo(function(dataName) {
         return function(elem) {
            return !!$(elem).data(dataName);
         };
      }) : function(elem, i, match) {
          return !!$(elem).data(match[3]);
      }
   });

   Показати фрагмент коду

    // pseudoselector code
    $.extend($.expr[":"], {
      mydata: $.expr.createPseudo ?
        $.expr.createPseudo(function(dataName) {
          return function(elem) {
            return !!$(elem).data(dataName);
          };
        }) : function(elem, i, match) {
          return !!$(elem).data(match[3]);
        }
    });
    // end pseudoselector
   
    testSelector = function() {
      var matched = $(':mydata(test)'),
        results = $('#results');
      results.append('<div>You matched ' + matched.length + ' elements</div>');
      matched.css('border', 'black 3px solid');
      console.log(matched);
      console.log('You matched ' + matched.length + ' elements');
    };
   
    testSelector();
    $('#addData').click(function() {
      $(".bar").data('test', 'value2');
      testSelector();
    });
   
    

    .foo {
      background-color: red;
      color: white;
    }
    .bar {
      background-color: blue;
      color: white;
    }
    #addData {
      margin-top: 20px;
    }
   
    

    <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
    <div>
      <span class="bar">without data attribute</span>
      <span class="foo" data-test="value1">with data attribute</span>
    </div>
    <button id="addData" type="button">Add data</button>
    <div id="results"></div>
   
    

   Виконати фрагмент кодуСховати результати

   Розгорніть фрагмент

2. Використовуйте jquery-ui з :dataпсевдоселектором і приєднуйтесь до результатів вибору, [data-myAttr]щоб включити ті, які можна пропустити

   var matches = $(':data(myAttr)', '[data-myAttr]')

   Показати фрагмент коду

    testSelector = function() {
      var matched = $(':data(test), [data-test]'),
          results = $('#results');
      results.append('<div>You matched ' + matched.length + ' elements</div>');
      matched.css('border', 'black 3px solid');
      console.log(matched);
      console.log('You matched ' + matched.length + ' elements');
    };
   
    testSelector();
    $('#addData').click(function() {
      $(".bar").data('test', 'value2');
      testSelector();
    });
   
    

    .foo {
      background-color: red;
      color: white;
    }
    .bar {
      background-color: blue;
      color: white;
    }
    #addData {
      margin-top: 20px;
    }
   
    

    <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
    <script src="http://code.jquery.com/ui/1.11.4/jquery-ui.js"></script>
    <div>
      <span class="bar">without data attribute</span>
      <span class="foo" data-test="value1">with data attribute</span>
    </div>
    <button id="addData" type="button">Add data</button>
    <div id="results"></div>
   
    

   Виконати фрагмент кодуСховати результати

   Розгорніть фрагмент

$('[data-myAttr]').each(function() {
       var element = $(this);
       // Do something with the element
});

Виберіть елементи, які я раніше встановлював jquery.data();

Питання в тому, щоб знайти всі елементи з певним ключем, а не будь-якими даними.

Спробуйте використати jQuery.data()

$(".myClass").each(function(i){
    if( i % 2 == 0 ){
        $(this).data("myAttr",i + 1);                
    }
});
    
var res = $(".myClass").map(function(i) {
    console.log($(this).data("myAttr"));
    return $.data(this, "myAttr") !== undefined ? this : null
});    

console.log(res);

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js">
</script>
<div class="myClass">1</div>
<div class="myClass">2</div>
<div class="myClass">3</div>
<div class="myClass">4</div>
<div class="myClass">5</div>

jsfiddle http://jsfiddle.net/xynZA/142/