Składnia JQuery | Wyjaśnione
Ten zapis szczegółowo wyjaśni składnię jQuery za pomocą odpowiednich przykładów. A więc zacznijmy!
Składnia JQuery | Wyjaśnione
W jQuery pierwszą rzeczą, którą musisz zrobić, to wybrać elementy HTML, na których chcesz wykonać dowolną akcję. Podstawowa składnia jQuery jest następująca:
$ (selektor).działanie();
W powyższej składni jQuery musisz dodać „$”Podpis dostępu do jQuery lub definiowania; następnie "selektor”Jest dodawany w nawiasach, reprezentując zapytanie do znalezienia elementów HTML. Wreszcie „działanie()”To operacja, która zostanie wykonana na wybranych elementach HTML.
Teraz sprawdźmy typy selektorów, które możesz dodać do składni jQuery.
Rodzaje selektorów w składni jQuery
Selektory JQuery są uważane za istotną część biblioteki jQuery. Aby wykorzystać dowolne metody jQuery, musisz utworzyć obiekt jQuery, wybierając określony element HTML.
W jQuery istnieją różne typy selektorów, takie jak Selektor nazwy elementu, Element #ID Selector, I Element .Selektor klas. Na przykład, aby wybrać cały akapit „P„Elementy, w następujący sposób użyjemy selektora nazwy elementu:
$ („p”).ukrywać()
Możesz także przypisać identyfikator do elementu HTML, a następnie wykonać tę samą operację na nim, wykorzystując selektor #ID:
$ („#btnclick”).ukrywać()
Z pomocą elementu .Selektor klas, możesz wybrać różne elementy HTML jednocześnie, które należy do tej samej klasy:
$ (".Nazwa klasy").ukrywać()
Notatka: W celu wyboru elementów HTML za pomocą ID, dodaj znak skrótu „#,”, A następnie identyfikator elementu i znalezienie elementów za pomocą nazwy ich klasy, dodaj„.„Postać z okresu, a następnie nazwa klasy.
Dokument Gotowy wydarzenie w składni JQuery
Przed pracą z „dokument„W jQuery upewnij się, że jest w pełni załadowany i jest gotowy do użycia. „„gotowy()„Wydarzenie„ „dokument„Element można wykorzystać w tym celu:
$ (dokument).gotowy (funkcja ()
// Napisz metody jQuery w ciele
);
Powyższa metoda zapobiegnie wykonaniu JQuery, gdy „dokument„Element nie jest gotowy. Jeśli jednak próbujesz ukryć element HTML, który nie został jeszcze utworzony, w tym przypadku określone działanie zawiedzie. Więc upewnij się, że „dokument”Jest gotowy przed uruchomieniem kodu jQuery.
Oto krótsza metoda pisania wydarzenia gotowego do dokumentu:
$ (funkcja ()
// Napisz metody jQuery w ciele
);
Przykład: Korzystanie z składni jQuery do ukrywania elementu HTML
Ten przykład pokaże użycie składni jQuery do ukrywania elementu HTML za pomocą selektora nazwy elementu. Po pierwsze, w naszym „indeks.html„Plik dodamy nagłówek„ za pomocą ”H2„Tag, akapit za pomocą„”Tag i„Kliknij!" przycisk:
Znajdź elementy HTML w jQuery
To jest główny akapit z przykładowym tekstem
Możesz użyć dowolnej piaskownicy kodowania online lub ulubionego edytora kodu do wykonywania programu; Jednak użyjemy kodu Visual Studio:
Następnie przejdź do pliku JavaScript, który jest „mój projekt.JS”W naszym przypadku i napisz w nim następujący kod:
$ (dokument).gotowy (funkcja ()
$ („przycisk”).kliknij (funkcja ()
$ („h2”).ukrywać();
);
);
Dostarczany kod określił, że JQuery „$ (dokument).gotowy()„Metoda ukryje element HTML za pomocą„H2„Nazwa elementu, gdy użytkownik kliknie przycisk:
Po zapisaniu obu plików otworzymy „indeks.html”Za pomocą kodu VS„Serwer wątroby" rozszerzenie:
Teraz klikniemy przycisk podświetlony na poniższym obrazie:
Jak widać, z powodzeniem ukryliśmy „H2„Element HTML poprzez przestrzeganie składni jQuery:
Chodziło o podstawową składnię jQuery. Możesz go dalej odkrywać zgodnie z preferencjami.
Wniosek
$ (Selektor).Action () to podstawowa składnia jQuery, którą można użyć do wyboru elementów HTML i stosowania do nich określonych działań. Po napisaniu wymaganego kodu, śledząc składnię jQuery, możesz użyć $ (dokument).Metoda gotowa (funkcja () ) do wykonywania programu. W tym zapisie omówiono składnię jQuery, typy selektorów JQuery i funkcjonalność $ (dokument).Metoda gotowa (funkcja () ).