jQuery jest lekką biblioteką JavaScript, która ułatwia korzystanie z JavaScript na stronie internetowej.
możesz wykonać swoją akcję w mniejszej ilości kodu w porównaniu do JavaScript.
ułatwia to manipulowanie dokumentami HTML, przechodzenie, obsługę zdarzeń i wykonywanie żądań AJAX.
kompatybilny z większością przeglądarek i obsługuje selektory CSS3 do wyszukiwania i manipulacji właściwościami stylu.,
zawartość
- Pobierz i dołącz
- Zainicjuj
- plik zewnętrzny
- podsumowanie
1. Pobierz i dołącz
- przejdź do oficjalnej strony jQuery.
- Biblioteka jest dostępna w dwóch wersjach-skompresowanej i nieskompresowanej. Skompresowany ma mniejszy rozmiar w porównaniu do nieskompresowanego, ponieważ nie ma dodatkowych białych spacji i komentarzy. Nieskompresowana wersja jest czytelna i łatwiejsza do debugowania.
- Pobierz skompresowaną wersję.,
- użyj
<script >
, aby włączyć bibliotekę w HTML w<head>
lub<body>
.
<script src='https://makitweb.com/embed-jquery-html-page/jquery-3.2.1.min.js'></script>
- możesz również użyć dostępnego CDN, aby dołączyć bibliotekę.
Google CDN
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
Microsoft CDN
<script src='http://ajax.aspnetcdn.com/ajax/jQuery/jquery-3.2.1.js'></script>
2. Inicjalizuj
na stronie napisz swój kod jQuery w stanie document ready w znaczniku<script >
.
przykład
w przykładzie użyłem biblioteki CDN i zdefiniowałem Zdarzenie kliknięcia na przycisku., Po kliknięciu zmień wartość elementu textbox.
Wyjście
kliknij przycisk.
3. Zewnętrzny plik
- Utwórz nowy plik
script.js
i umieść na nim powyższy skrypt. - Dołącz
script.js
po bibliotece jQuery.
skrypt.js
$(document).ready(function(){ $('#button').click(function(){ $('#txt1').val("Button clicked"); });});
index.html
wyjście
kliknij przycisk.
4. Podsumowanie
możesz użyć zewnętrznej biblioteki jQuery lub wersji CDN, aby dołączyć skrypt.,
jeśli stworzyłeś zewnętrzny skrypt i używasz na nim jQuery, to musi on być dołączony po skrypcie biblioteki jQuery, w przeciwnym razie nie zadziała i wygeneruje błąd.
Jeśli ten tutorial okazał się pomocny, nie zapomnij podzielić się nim.