Wybierz elementy według atrybutu

Mam kolekcję pól wyboru z wygenerowanymi identyfikatorami, a niektóre z nich mają dodatkowy atrybut. Czy można użyć JQuery do sprawdzenia, czy element ma określony atrybut? Czy mogę na przykład sprawdzić, czy następujący element ma atrybut „myattr”? Wartość atrybutu może się różnić.

<input type="checkbox" id="A" myattr="val_attr">A</input>

Na przykład, w jaki sposób mogę uzyskać kolekcję wszystkich pól wyboru, które mają ten atrybut, bez sprawdzania jeden po drugim? czy to możliwe?

Czy masz na myśli, że możesz je wybrać? Jeśli tak, to tak:

$(":checkbox[myattr]")

if ($('#A').attr('myattr')) {
    // attribute exists
} else {
    // attribute does not exist
}

EDYTOWAĆ:

Powyższe spadnie do else-gałęzi, jeśli myattristnieje, ale jest pustym ciągiem lub „0”. Jeśli jest to problem, powinieneś wyraźnie przetestować undefined:

if ($('#A').attr('myattr') !== undefined) {
    // attribute exists
} else {
    // attribute does not exist
}

Wiem, że minęło dużo czasu, odkąd pytanie zostało zadane, ale okazało się, że czek jest bardziej przejrzysty:

if ($("#A").is('[myattr]')) {
    // attribute exists
} else {
    // attribute does not exist
}

(Jak znaleziono na tej stronie tutaj )

Dokumentacja o to można znaleźć tutaj

To zadziała:

$('#A')[0].hasAttribute('myattr');

W JavaScript ...

null == undefined

... zwraca true*. To różnica między ==i ===. Ponadto undefinedmożna zdefiniować nazwę (to nie jest słowo kluczowe podobne do „ nullis”), więc lepiej sprawdzić w inny sposób. Najpewniejszym sposobem jest prawdopodobnie porównanie wartości zwracanej przez typeofoperatora.

typeof o == "undefined"

Niemniej jednak porównanie z wartością null powinno działać w tym przypadku.

* Zakładając, że undefinedw rzeczywistości jest niezdefiniowany.

$("input[attr]").length może być lepszym rozwiązaniem.

Kilka pomysłów zostało podrzuconych przy użyciu „typeof”, jQuery „.is” i „.filter”, więc pomyślałem, że opublikuję szybkie ich porównanie. Typeof wydaje się najlepszym wyborem do tego. Podczas gdy inne będą działać, wydaje się, że istnieje wyraźna różnica w wydajności podczas wywoływania biblioteki jq dla tego wysiłku.

if (!$("#element").attr('my_attr')){
  //return false
  //attribute doesn't exists
}

jak w tym poście , używając .isi selektora atrybutów [], możesz łatwo dodać funkcję (lub prototyp):

function hasAttr($sel,attr) {
    return $sel.is('['+attr+']');
}

$("input#A").attr("myattr") == null

po prostu:

$('input[name*="value"]')

więcej informacji: oficjalne dokumenty

Oprócz wybierania wszystkich elementów z atrybutem $('[someAttribute]')lub $('input[someAttribute]')możesz także użyć funkcji do wykonywania operacji logicznych na obiekcie, na przykład w module obsługi kliknięć:

if(! this.hasAttribute('myattr') ) { ...

Utworzyłem pakiet npm z zamierzonym zachowaniem, jak opisano powyżej w pytaniu.

Link do [npm] i [github]

Użycie jest bardzo proste. Na przykład:

<p id="test" class="test">something</p>
$("#test").hasAttr("class")

zwraca true.

Działa również z camelcase.

Aby wybrać elementy posiadające określony atrybut, zobacz powyższe odpowiedzi.

Aby ustalić, czy dany element jQuery ma określony atrybut, używam małej wtyczki, która zwraca, truejeśli pierwszy element w kolekcji ajQuery ma ten atrybut:

/** hasAttr
 ** helper plugin returning boolean if the first element of the collection has a certain attribute
 **/
$.fn.hasAttr = function(attr) {
   return 0 < this.length
       && 'undefined' !== typeof attr
       && undefined !== attr
       && this[0].hasAttribute(attr)
}

JQuery zwróci atrybut jako ciąg. Dlatego możesz sprawdzić długość tego ciągu, aby ustalić, czy jest ustawiony:

if ($("input#A").attr("myattr").length == 0)
 return null;
else
 return $("input#A").attr("myattr");