jQuery - modyfikowanie elementów strony
Stronę tą wyświetlono już: 2114 razy
Zmiana styli elementów strony
Oto w jaki sposób można zmieniać style wielu elementów strony za pomocą jQuery:
Praktyczny przykład działania powyższego kodu można zobaczyć klikając na poniższy przycisk.
Metoda css może zwracać wartość ustawienia stylu CSS danej grupy elementów, gdy podany zostanie jej na wejście tylko jeden argument będący nazwą stylu CSS. Gdy podane zostaną dwa argumenty to metoda ta ustawi podany styl CSS.
Zmiana atrybutów elementów strony
Możliwe jest również zmienianie atrybutów elementów strony, oto prosty przykład:
Powyższy kod zmieni wysokość wszystkich elementów znajdującym się pod elementem znacznika o id = strona i atrybucie class ustawionym na "myTable".
Ustawianie zdarzeń związanych z elementem strony
Oto lista niektórych metod klasy jQuery związanych z możliwością podłączenia funkcji pod zdarzenie danego elementu strony:
- change - metoda podpinająca funkcję pod zdarzenie wywoływane, gdy dany element HTML uległ zmianie;
- click - metoda podpinająca funkcję pod zdarzenie wywoływane, gdy dany element strony zostanie kliknięty;
- mouseover - metoda podpinająca funkcję pod zdarzenie wywoływane, gdy kursor myszy najedzie na element z nim związany;
- mouseout - metoda podpinająca funkcję pod zdarzenie wywoływane, gdy kursor myszy opuści dany element z nim związany;
- keydown - metoda podpinająca funkcję pod zdarzenie wywoływane, gdy użytkownik wciśnie jakiś przycisk klawiatury;
- keypress - metoda podpinająca funkcję pod zdarzenie wywoływane, gdy użytkownik wciśnie dowolny przycisk klawiatury oprócz: ALT, CTRL, SHIFT, ESC;
- keyup - metoda podpinająca funkcję pod zdarzenie wywoływane, gdy użytkownik zwolni przycisk na klawiaturze;
- mousemove - metoda podpinająca funkcję pod zdarzenie wywoływane, gdy użytkownik przemieszcza kursor myszy nad danym elementem;
- load - metoda podpinająca funkcję pod zdarzenie wywoływane, gdy przeglądarka załaduje dany element.
Przykład użycia jednej z powyższych metod:
Oto wynik działania skryptu:
Tytuł:
JavaScript i jQuery. Interaktywne strony WWW dla każdego. Podręcznik Front-End Developera
Autor:
Jon Duckett
Tytuł:
JavaScript od pierwszej linii kodu. Błyskawiczna nauka pisania gier, stron WWW i aplikacji internetowych
Autor:
Laurence Lars Svekis, Maaike van Putten, Rob Percival
Tytuł:
JavaScript funkcyjnie. Zrównoważone, pragmatyczne programowanie funkcyjne w JavaScript
Autor:
Kyle Simpson
Tytuł:
JavaScript dla dzieci dla bystrzaków
Autor:
Chris Minnick, Eva Holland
Tytuł:
Modularny JavaScript dla zaawansowanych
Autor:
Nicolas Bevacqua
Tytuł:
JavaScript w praktyce. Stwórz twitterowego bota, system sygnalizacyjny LED i inne projekty z użyciem Node.js i Raspberry Pi
Autor:
Lynn Beighley
Tytuł:
Matematyka dla programistów JavaScript
Autor:
Jacek Piechota
Tytuł:
JavaScript i jQuery. Interaktywne strony WWW dla każdego. Podręcznik Front-End Developera
Autor:
Jon Duckett
Tytuł:
ECMAScript 6. Przewodnik po nowym standardzie języka JavaScript
Autor:
Nicholas C. Zakas
Tytuł:
JavaScript i wzorce projektowe. Programowanie dla zaawansowanych. Wydanie II
Autor:
Simon Timms