JQuery ist eine JavaScript -Bibliothek, dh eine Erweiterung des JavaScript, der verwendet wird, um verschiedene Anforderungen an die zunehmenden Spezialeffekte zu erfüllen. Es ist JavaScript
Schreiben wir ein grundlegendes JQ -Programm, um JQ zu veranschaulichen.
1. Grundziele
Auf der Webseite befinden sich drei Schaltflächen, man kann nur Text ausblenden, einer kann nur Text anzeigen und der andere kann gleichzeitig Text ausblenden und anzeigen. Klicken Sie hier, um anzuzeigen, dann klicken Sie, um sich auszublenden und unendlich zu schleifen.
2. Produktionsprozess
1. Erstens müssen Sie eine JQ -Support -Datei von der offiziellen JQ -Website herunterladen und in Ihren Site -Ordner einfügen. Diese Support -Datei ist jQuery1.11. Sie können JQuery1.11 herunterladen, was mit dem alten Browser IE6 kompatibel ist, von der offiziellen Website von Jquery anstelle von JQuery2, die mit dem alten Browser IE6 nicht kompatibel ist.
2. Der gesamte Webseitencode lautet wie folgt und erklärt dann in Fragmenten:
<! DocType html public "-// w3c // dtd xhtml 1.0 transitional // en" "http://www.w3.org/tr/xhtml1/dtd/xhtml1-transsitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <script type="text/javascript" src="js/jquery-1.11.1.js"></script> <script> $ (Dokument) .Ready (function () {$ ("#hide"). click (function () {$ ("#text"). hide ();}); </script> <!-- <style type="text/css"> #text{ display:none } </style> --> <title>JQ fade out and display</title> </head> <body> <p id="text"> tossed text</p> <button id="hide"> Hide</button> <button id="show"> Show</button> <button id="toggle"> Hide/Show</button> </body> </html>(1) <Body> Teil
Der <kopf> -Teil implementiert hauptsächlich den Kerncode -Teil. Reden wir später darüber. Sprechen wir über den <body> part <body> <!-Dies ist ein Text mit einer ID als Text für einfache Skriptsteuerung-> <p id = "text"> geworfener Text </p> <!-Die Schaltflächen mit IDs zum Ausblenden setzen, anzeigen, wechseln-> <button id = "hide"> hide </button id = ".
(2) <kopf> Teil
<Head> <!-Codierung von Webseiten und erklärt, dass Sie JQ-> <meta http-äquiv = "Content-type" -Content = "text/html; charset = utf-8"/> <script type = "text/javaScript" src = "JS/Jquery-1.11.1.1.1.1.1.1.1.1.1.1.1.1.Js, verwenden. mit $ (document) .ready (function () {});. Wenn Sie das von dieser Funktion bereitgestellte Framework nicht ausführen müssen, können Sie-> $ (Dokument) .Ready (function () {<!-Dann schreiben Sie die erforderliche Funktion in dieser Funktion-> <!-Rufen Sie den Funktionsaufruf für die Klickaktion mit der Schaltfläche mit der ID-Versteck auf, und die nachfolgenden Aktionen sind immer noch in dieser Funktion platziert-> $ ("#teurer".). $ ("#text"). Hide (); </head>