W przypadku jQuery, należy bacznie obserwować log zmian zamieszczany przy okazji wypuszczenia kolejnych wersji frameworka, ponieważ niektóre z funkcjonalności zawartych w bibliotece głównej, zmieniają swoje znaczenie, bądź też przestają działać w kolejnych w wersjach.

Zmiana istniejących metod i funkcji, zwykle poprzedzana jest pewnym okresem przejściowym, w którym programiści mogą aktualizować bibliotekę frameworka we własnych projektach i jednocześnie korzystać ze starych i nowych funkcjonalności.

Takie posunięcie zastosowano właśnie w przypadku metody prop(), która została wprowadzona w jQuery w wersji 1.6.

Istota zastosowania metody prop

Do czasu jQuery w wersji 1.6, właściwości określonych elementów DOM naszej strony, były traktowane jako atrybuty. Stąd też, normalnością były np. takie konstrukcje:

// Ustawianie atrybutów
$('input').attr('disabled', true);
$('input').attr('selected', true);
$('input:checkbox').attr('checked', true);
// Usuwanie atrybutów
$('input').removeAttr('disabled');
$('input').removeAttr('selected');
$('input:checkbox').removeAttr('checked');

Począwszy od wersji jQuery 1.6 dostępna jest nowa konstrukcja wykorzystująca metodę prop.

Metoda prop, powstała właśnie po to, by rozdzielić właściwości od atrybutów i należy ją stosować do ustawiania następujących elementów:

• async
• autofocus
• checked
• defaultValue
• location
• multiple
• nodeName
• nodeType
• readOnly
• selected
• selectedIndex
• tagName

Jak widać, lista atrybutów, które od wersji 1.6 stały się właściwościami, jest całkiem spora. Łatwo można popełnić w ten sposób błąd, lub zapomnieć o starym kodzie, który wykorzystuje te właściwości - musicie na to zwrócić uwagę.

Zastosowanie metody prop oraz removeProp

Zastosowanie metody prop oraz towarzyszącej jej metody, która usuwa właściwości - removeProp, jest można powiedzieć standardowe dla jQuery. Jak widać, również sposób nazewnictwa obu metod, wpisuje się w konwencje nazewnicze zastosowane w całym frameworku.

Metoda prop, pozwala ustawiać wartości dla wybranej właściwości. Właściwości, często przyjmują wartości typu boolean (true/false). W ten sposób, w łatwy sposób włączamy określoną właściwość (true), bądź też wyłączamy ją (false).

Metoda removeProp, usuwa przypisaną wcześniej właściwość, czyli formalnie działa też jak jej wyłącznik, co sprowadza się do uzyskania zasadniczego takiego samego efektu, jak ustawienie tej wartości na false.

Spójrzmy zatem jak powyższe metody wyglądają w praktyce:

// Ustawianie właściwości
$('input').prop('disabled', true);
$('input').prop('selected', true);
$('input:checkbox').prop('checked', true);
// Pobieranie aktualnej wartości właściwości
$('input').prop('disabled');
$('input').prop('selected');
$('input:checkbox').prop('checked');
$('body').prop('nodeName');
// Usuwanie właściwości
$('input').removeProp('disabled');
$('input').removeProp('selected');
$('input:checkbox').removeProp('checked');

Na przedstawionym powyżej listingu, wszystkie właściwości poza nodeName przyjmują wartości typu boolean. Właściwość nodeName, podaje nam nazwę aktualnego węzła w drzewie DOM w postaci stringa. Logicznym jest również w tym przypadku fakt, że właściwość ta ma charakter tylko do odczytu i ani nie zmienimy, ani też nie usuniemy jej wartości.

W pozostałych przypadkach, mechanizm działa identycznie jak w przypadku atrybutów. Zmieniają się tylko nazwy wywoływanych metod.

Data ostatniej modyfikacji: 28.11.2011, 18:36.