Ściągawka JQuery - Najlepsza interaktywna ściągawka na JQuery

Wprowadzenie do Cheatsheet JQuery

Jquery to wieloplatformowa biblioteka javascript, której głównym celem jest ułatwienie programowania stron internetowych. Jest to udowodnione stwierdzenie, że wprowadzenie Jquery dość skróciło długość kodów javascript. Tak więc nawet wieloliniowy kod javascript można łatwo uzyskać za pomocą małego bloku lub nawet jednego wiersza instrukcji JQuery.

W tym artykule JQuery z Cheatsheet omówimy, czym jest Jquery i PTP tego frameworka:

W Internecie działa wiele witryn internetowych, a na rynku dostępny jest szeroki wybór języków, w których można zbudować te witryny i produkty online. Niektóre z nich są następujące:

HTML, CSS
JavaScript i JQuery dla skryptów po stronie klienta
PHP dla skryptów na końcu serwera
MYSQL do zapytań do bazy danych
itp.

Zalety korzystania z frameworka JQuery w porównaniu z innymi,

W grę wchodzi ogromna społeczność i wprowadzono wiele wtyczek.
Lekki
potężne możliwości łączenia
Krótka dokumentacja i samouczki
Możliwość łatwego programowania komponentów Ajax
Możliwość uproszczenia kodu i ponownego użycia
Przyjazny dla przeglądarki

Podstawowa zawartość i składnia ściągawki JQuery:

Uwzględnij: Dołączanie Jquery do bieżącego skryptu wykonania

Składnia: Składniowa struktura JQuery

Selektor wybiera komponenty HTML

$(Selector).action() Akcja wykonana na wybranym komponencie

Definiuje użycie JQuery

Ściągawka dla Selektorów Jquery:

elementy znacznikówelementy znaczników

Selektor	OPIS
$ („*”)	Zaznacza wszystkie elementy HTML
$ („P.demo”)	Wybiera elementy znaczników
$ („: Przycisk”)	Wybiera przycisk i elementy wejściowe
$ („Tr: parzysty”)	Wybiera parzystą
$ („Tr: nieparzysty”)	Wybiera liczbę nieparzystą
$ („Span: parent”)	Wybiera elementy, które są powiązane z elementem potomnym
$ („(Href)”)	Wybiera wszystkie elementy z atrybutami href
$ („: Input”)	Zaznacza wszystkie elementy formularza

Ściągawka dla zdarzeń Jquery: Wydarzenie jest pewnego rodzaju działaniem na stronie internetowej. Najważniejsze zdarzenia są następujące.

Wydarzenia z myszką	Metoda zdarzenia myszy	Zdarzenia na klawiaturze	Metoda zdarzenia klawiatury	Form Wydarzenia	Form Event Form
myszka wchodzi	.mouseenter ()	naciśnięcie klawisza	.keypress ()	zmiana	.zmiana()
Podwójne kliknięcie	.dblclick ()	Keydown	.keydown ()	skupiać	.skupiać()
Kliknij	.Kliknij()	Keyup	.keyup ()	plama	.plama()
zostaw mysz	.mouseleave ()	Zdarzenia przeglądarki	Metoda zdarzenia przeglądarki	Zdarzenia dokumentu	Metody zdarzeń dokumentu
mysz w dół	.mousedown ()	Populacja błędów	.błąd()	rozładować	.rozładować()
mysz w górę	.mouseup ()	zwój	.zwój()	Załaduj	.Załaduj()

Np .:

$("p").dblclick(function()( $(this).hide(); ));

Ściągawka Efekty Jquery:

Podstawy: .hide (), .show (), .toggle () - Pozwala ukryć, pokazać i przełączać wybrane elementy.

Dawny:

$("p").hide();

Niestandardowe: .animate (), .delay (), .dequeue (), .stop ()

Metoda animate () przygotowuje niestandardowe animacje
metoda delay () pozwala na opóźnione wykonanie elementów.
dequeue () wykonuje następną sekwencję funkcji obecnych w kolejce.

Np .:

$("element1").animate( ( opacity : 0.50 left: "+=27" )

Fade: fadeTo (), fadeOut (), fadeIn (), fadeToggle ()

fadeIn () Znika ukryty element
fadeout () pozwala na zanikanie widocznego elementu
fadeTo () zanika do danego krycia
fadeToggle () pozwala elementowi przełączać się za pomocą metod wprowadzania i wyciszania.

Np .:

$("button").click(function() ( $("#div2").fadeOut("slow"); ));

Slajd: slideDown (), slideUp (), slideToggle ()

slideDown () Wyświetlanie elementów niepasujących do ruchu przesuwnego
slideToggle () Wyświetla lub ukrywa elementy niepasujące do ruchu przesuwnego
slideUp () Ukrywa elementy niepasujące do ruchu przesuwnego

Darmowe porady i triki dotyczące korzystania z Ściągawki jQuery

1) Zachowaj parametr kontekstu, który pozwala na rozpoczęcie wykonywania z głębszej gałęzi DOM zamiast wywoływania z katalogu głównego.

2) Sprawdź, czy element istnieje, a następnie przesuń do przodu w celu wykonania kodu.

Składnia:

if($("#element").length) ( // DOM element exists ) else ( //DOM element dont exists )

3) Metoda danych jQuerys wiąże elementy DOM i dane bez modyfikowania DOM.

4) Sprawdź, czy którykolwiek z elementów jest ukryty.

Np .:

if($(element).is(":visible") == "true") ( //The element is Visible )

5) Zachowaj liczbę bezpośrednio poprzedzających elementów potomnych.

6) Wcześniejsze ładowanie obrazów optymalizuje wydajność wykonywania zapytań.

7) Lepiej sprawdzić, czy zapytanie zostało pomyślnie załadowane przed wykonaniem.

Dawny:

if (typeof jQuery == 'undefined') ( console.log('jQuery not loaded'); ) else ( console.log('jQuery loaded'); )

8) Zepsute linki do obrazów można łatwo zastąpić, wykonując poniższy fragment kodu,

Dawny:

$('img').on('error', function () ( if(!$(this).hasClass('broken-image')) ( $(this).prop('src', 'img/broken.png.webp').addClass('broken-image'); ) ));

9) Rama musi zawsze być dopasowana do zawartości strony.

10) Własne filtry wyboru można dodać w Jquery. podobnie jak wszystko w bibliotekach wyboru filtrów, można również dostosować. dodanie obiektu $ .expr (':') spowoduje to.

Np .:

(function($) ( var random = 0 $.expr(':').random = function(a, i, m, r) ( if (i == 0) ( random = Math.floor(Math.random() * r.length); ) return i == random; ); ))(jQuery); // how to utilize this piece of code. $('li:random').addClass('glow');

11) Dodanie atrybutu disabled do danych wejściowych pozwala na wyłączenie pola wejściowego do momentu wypełnienia niektórych pól względnych.

Dawny:

$('input(type="submit")').prop('disabled', true);

12) Upewnij się, że zdefiniowałeś sekcję obsługi błędów w celu obsługi zwrotów błędów ajax. po trafieniu w błąd 400 lub 500 sekcja ta zostanie automatycznie uruchomiona.

Dawny:

$(document).on('ajaxError', function (e, xhr, settings, error) ( console.log(error); ));

Ściągawka JQuery - wniosek

Jquery zmniejsza dodatkową złożoność, którą wiąże się z javascript. z wieloma podmiotami powiązanymi z jquery stoi wśród najlepszych narzędzi programistycznych na rynku. jego lekkie i wydajne możliwości tworzenia łańcuchów znacznie ułatwiły programistom kodowanie sieciowe.

Polecany artykuł

To był przewodnik po Ściągawce JQuery. Omówiliśmy tutaj treść i polecenia, a także bezpłatne porady i sztuczki Ściągawki JQuery. Możesz także przeczytać poniższy artykuł, aby dowiedzieć się więcej -