So verwenden Sie JQuery

So verwenden Sie JQuery: Laden Sie zuerst die JQuery-Datei durch CDN-Laden oder lokales Laden. Führen Sie dann den JQuery-Code über die JQuery-Datei aus.

Die Betriebsumgebung dieses Artikels: Windows 7-System, Dell G3-Computer, JQuery-Version 3.2.1.

Wie verwende ich JQuery? In diesem Artikel erfahren Sie, was JQuery ist. Warum JQuery verwenden? Wie verwende ich JQuery? Lassen Sie alle wissen, wie man JQuery verwendet. Ich hoffe, es wird Ihnen hilfreich sein.

Was ist jQuery?

jQuery ist keine Sprache, aber es ist ein gut geschriebener JavaScript-Code, es ist eine schnelle und prägnante JavaScript-Bibliothek, die das Durchlaufen von HTML-Dokumenten, die Ereignisbehandlung, Animation und Ajax Interactive vereinfacht schnelle Webentwicklung.

Warum jQuery wählen?

jQuery ist ein sehr kompakter und gut geschriebener JavaScript-Code, der die Entwicklerproduktivität steigert, indem er sehr kleine Codemengen schreibt und ihnen so die Implementierung wichtiger UI-Funktionen ermöglicht.

Die Vorteile von jQuery sind:

1. Es ist nicht erforderlich, eine neue Syntax zu lernen, um jQuery zu verwenden. Es reicht aus, die einfache JavaScript-Syntax zu verstehen.

2. Der Code ist einfach und klar und komplexe Funktionen können implementiert werden, ohne mehrere Codezeilen zu schreiben.

3. Trägt zur Verbesserung der Anwendungsleistung bei.

4. Es hilft bei der Entwicklung von Webseiten, die mit den meisten Browsern kompatibel sind.

5. Es hilft, wichtige UI-bezogene Funktionen zu implementieren, ohne Hunderte von Codezeilen schreiben zu müssen.

Wie verwende ich jQuery?

1. Laden Sie die jQuery-Datei

jQuery wird normalerweise als einzelne JavaScript-Datei geliefert, die alles enthält, was jQuery standardmäßig tut. Es kann auf folgende Weise in Webseiten eingebunden werden:

1), lokale jQuery-Datei laden

Zuerst müssen Sie die jQuery-Datei herunterladen zu lokal, jQuery-JavaScript-Dateien können von der offiziellen jQuery-Website heruntergeladen werden, Adresse: http://www.jquery.com.

Dann laden Sie die jQuery-Datei

<script type="text/javascript" src="jQuery-1.4.1-min.js"></script>

2), laden Sie jQuery vom CDN

Was ist CDN?

CDN steht für Content Distribution Network, auch bekannt als Content Delivery Network. Es handelt sich um eine Gruppe von Computern, die an verschiedenen Punkten platziert sind und mit einem Replikatnetzwerk verbunden sind, das Datendateien enthält, um auf Daten zuzugreifen und die Bandbreite zu maximieren. In einem CDN greifen Clients auf eine Kopie der Daten zu, die näher am Standort des Clients liegt, anstatt dass alle Clients von einem bestimmten Server aus darauf zugreifen. Dies trägt dazu bei, eine bessere Datenabrufleistung auf der Clientseite zu erreichen.

Es stehen zwei Haupt-CDNs zum Hosten von jQuery-Dateien zur Verfügung:

a. Laden Sie jQuery vom Microsoft AJAX CDN

Kann geladen werden von Microsoft AJAX CDN lädt jQuery-Dateien. Weitere Details finden Sie hier. Sie müssen das folgende Markup auf Ihrer Seite beibehalten.

<script type="text/javascript" language="Javascript"  src="http://ajax.aspnetcdn.com/ajax/jquery/jquery-1.4.1.min.js"></script>

b. Laden von jQuery aus der Google Libraries API

Sie können jQuery-Dateien aus dem Google CDN laden. Sie müssen das folgende Markup auf Ihrer Seite beibehalten.

<script type="text/javascript" language="Javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js"> </script>

Vorteile des Ladens von jQuery vom CDN:

1 Da die jQuery-Datei nicht heruntergeladen werden muss, wird die Seite schneller geladen

2 . Da die jQuery-Datei nicht heruntergeladen werden muss, laden Sie jQuery-Dateien vom Server und sparen so Bandbreite

3. Skalierbar, legen CDNs diese Dateien normalerweise auf Servern an verschiedenen geografischen Standorten auf der ganzen Welt ab, damit sie geladen werden schneller, sodass Ihre Anwendung unabhängig davon, wo der Benutzer die Seite durchsucht, normal ausgeführt wird.

Hinweis:

Im Allgemeinen müssen das Laden von jQuery aus dem CDN und das Laden von jQuery-Dateien aus dem lokalen Bereich geschrieben werden, um das Laden von jQuery-Dateien zu verhindern. Daher können Sie die folgenden Codezeilen schreiben:

<!-- START - jQuery Reference -->
<script type="text/javascript" language="Javascript" 

    src="http://ajax.aspnetcdn.com/ajax/jquery/jquery-1.4.1.min.js"></script>
    <script type=&#39;text/javascript&#39;>//<![CDATA[
        if (typeof jQuery == &#39;undefined&#39;) {
            document.write(unescape("%3Cscript 
    src=&#39;/Script/jquery-1.4.1.min.js&#39; type=&#39;text/javascript&#39; %3E%3C/script%3E"));
}//]]>
</script>
<!-- END - jQuery Reference -->

2. jQuery-Code ausführen

Wir haben möglicherweise zwei Möglichkeiten, jQuery-Code auszuführen .

1. Wenn die Seite geladen wird, führen Sie den jQuery-Code aus:

<script language="javascript" type="text/javascript">
$(function () {
$("#div1").css("border", "2px solid green");
});
</script>

oder:

<script language="javascript" type="text/javascript">
$("#div1").css("border", "2px solid green");
</script>

Der Vorteil der Ausführung von jQuery-Code auf diese Weise besteht darin, dass dies der Fall ist nicht warten Die gesamte Seite wird vollständig geladen. Sie können dies also verwenden, wenn Sie möchten, dass der Benutzer den Effekt sieht, sobald das entsprechende Element geladen wird.

Der Nachteil besteht jedoch darin, dass, wenn das Element, das jQuery ausführen muss, nicht geladen wird, ein Fehler auftritt oder Sie nicht das gewünschte Ergebnis erhalten. Daher müssen Sie bei dieser Art der Ausführung von jQuery-Code Folgendes tun: Stellen Sie sicher, dass Sie zuerst das Element laden, in dem Sie jQuery verwenden möchten (Sie können den jQuery-Code nach dem HTML-Element einfügen).

2. Führen Sie jQuery erst aus, wenn das vollständige DOM-Objekt (komplette Seite) geladen wurde. Zu diesem Zeitpunkt muss der Code in eine .ready-Funktion eingeschlossen werden.

<script language="javascript" type="text/javascript">
$(document).ready(function () {
$("#div1").css("border", "2px solid green");
});
</script>

这是执行jQuery的更好，更安全的方法。这样可以确保只有在浏览器中加载完整页面时才会执行jQuery代码，因此可以放心，用户不会在页面上看到任何不需要的行为。

总结：以上就是本篇文章的全部内容，希望能对大家的学习有所帮助。

Das obige ist der detaillierte Inhalt vonSo verwenden Sie JQuery. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!