jQuery
Atrybuty
Szukaj…
Uwagi
Funkcja jQuery .attr() pobiera wartość atrybutu dla pierwszego elementu w zestawie dopasowanych elementów lub ustawia jeden lub więcej atrybutów dla każdego dopasowanego elementu.
Warto zauważyć, że przy pobieraniu wartości atrybutu pobiera ją tylko z pierwszego elementu pasującego do selektora (tj. $("input").attr("type"); otrzyma tylko typ pierwszego wejścia , jeśli jest więcej niż jeden)
Jednak ustawiając atrybut, zastosuje go do wszystkich pasujących elementów.
Uzyskaj wartość atrybutu elementu HTML
Gdy pojedynczy parametr jest przekazywany do funkcji .attr() , zwraca wartość przekazanego atrybutu dla wybranego elementu.
Składnia:
$([selector]).attr([attribute name]);
Przykład:
HTML:
<a href="/home">Home</a>
jQuery:
$('a').attr('href');
Pobieranie atrybutów data :
jQuery oferuje .data() w celu obsługi atrybutów danych. Funkcja .data zwraca wartość atrybutu danych dla wybranego elementu.
Składnia:
$([selector]).data([attribute name]);
Przykład:
HTML:
<article data-column="3"></article>
jQuery:
$("article").data("column")
Uwaga:
Metoda data () jQuery zapewni ci dostęp do atrybutów data- *, ALE, to blokuje wielkość liter nazwy atrybutu. Odniesienie
Ustawienie wartości atrybutu HTML
Jeśli chcesz dodać atrybut do jakiegoś elementu, możesz użyć funkcji attr(attributeName, attributeValue) . Na przykład:
$('a').attr('title', 'Click me');
Ten przykład doda tekst najechania myszką "Click me" do wszystkich linków na stronie.
Ta sama funkcja służy do zmiany wartości atrybutów.
Usuwanie atrybutu
Aby usunąć atrybut z elementu, możesz użyć funkcji .removeAttr(attributeName) . Na przykład:
$('#home').removeAttr('title');
Spowoduje to usunięcie title atrybut z elementu z ID home .
Różnica między attr () a prop ()
attr() pobiera / ustawia atrybut HTML za pomocą funkcji DOM getAttribute() i setAttribute() . prop() działa poprzez ustawienie właściwości DOM bez zmiany atrybutu. W wielu przypadkach oba są wymienne, ale czasami jedna jest potrzebna.
Aby ustawić pole wyboru jako zaznaczone:
$('#tosAccept').prop('checked', true); // using attr() won't work properly here
Aby usunąć właściwość, możesz użyć metody removeProp() . Podobnie removeAttr() usuwa atrybuty.