Heim >Web-Frontend >js-Tutorial >5 Nützliche Basis -JQuery -Syntax

5 Nützliche Basis -JQuery -Syntax

Christopher Nolan
Christopher NolanOriginal
2025-03-08 00:02:23707Durchsuche

5 Useful Basic jQuery Syntax

5 Nützliche Basis -JQuery -Syntax

1) ausblenden/anzeigen

Dies wird verwendet, um HTML -Elemente ohne Auswirkungen zu verbergen oder zu zeigen. Verwenden Sie dies, wenn Sie einige HTML -Elemente schnell ausblenden oder anzeigen möchten.
  • syntax: hide (), show ()
BEISPIEL :
<span>$(document).ready(function(){
</span>	<span>$(".btn1").click(function(){
</span>		<span>$("p").hide();
</span>	<span>});
</span>	<span>$(".btn2").click(function(){
</span>		<span>$("p").show();
</span>	<span>});
</span><span>});</span>
Live -Demo: http://www.w3schools.com/jquery/tryit.asp?filename=tryjquery_eff_show_hide

2) verblassen in/verblassen

Dies beinhaltet das Verstecken und Zeigen von HTML -Elementen mit netten Verblassungseffekten. Es wird gut verwendet, wenn Sie eine DIV und seinen Inhalt auf schöne Weise zeigen oder verstecken möchten.
  • syntax: fadein (), fadeout ()
BEISPIEL:
<span>$(document).ready(function(){
</span>	<span>$(".btn1").click(function(){
</span>		<span>$("p").fadeOut()
</span>	<span>});
</span>	<span>$(".btn2").click(function(){
</span>		<span>$("p").fadeIn();
</span>	<span>});
</span><span>});</span>
Live -Demo: http://www.w3schools.com/jquery/tryit.asp?filename=tryjquery_eff_fadeout_fadein

3) Stop

Wenn Sie aufhören möchten, derzeit Animationen auszuführen, verwenden Sie dies einfach.
  • syntax: stop ()
BEISPIEL:
<span>$(document).ready(function(){
</span>	<span>$("#start").click(function(){
</span>		<span>$("div").animate({height:300},3000);
</span>	<span>});
</span>	<span>$("#stop").click(function(){
</span>		<span>$("div").stop();
</span>	<span>});
</span><span>});</span>
Live -Demo: http://www.w3schools.com/jquery/tryit.asp?filename=tryjquery_Eff_Stop

4) animieren

Eine schöne Syntax, die Änderungen an einem Element von einem Zustand zum anderen mit CSS -Stilen vornimmt. Es ändert sich einfach allmählich den CSS -Eigenschaftswert, was zu Animationseffekten führt.
  • syntax: animate ()
BEISPIEL:
<span>$(document).ready(function()
</span><span>{
</span>	<span>$("#btn1").click(function(){
</span>		<span>$("#box").animate({height:"300px"});
</span>	<span>});
</span>	<span>$("#btn2").click(function(){
</span>		<span>$("#box").animate({height:"100px"});
</span>	<span>});
</span><span>});</span>
Live -Demo: http://www.w3schools.com/jquery/tryit.asp?filename=tryjquery_eff_animate

5) Schieber

Diese Syntax wird in verschiedenen Websites, auf denen JQuery verwendet wird, stark verwendet. Idealerweise ist es nur so, dass es ein HTML -Element verbergt und angezeigt wird, aber in einem sehr schönen Gleiteffekt genau wie das linke Menü im Administratorbereich einer typischen WordPress -Website.
  • syntax: Slidetoggle ()
BEISPIEL:
<span>$(document).ready(function(){
</span>	<span>$("button").click(function(){
</span>		<span>$("p").slideToggle();
</span>	<span>});
</span><span>});</span>
Live -Demo: http://www.w3schools.com/jquery/tryit.asp?filename=tryjquery_Eff_slidetoggle

häufig gestellte Fragen (FAQs) zu JQuery Syntax

Was ist die grundlegende Syntax von JQuery? Es ist als $ (Selector) .Action () geschrieben. Hier definiert das Dollar -Zeichen ($) JQuery, der (Selektor) findet HTML -Elemente, und dann wird die .Action () auf den Elementen (en) durchgeführt. Zum Beispiel $ ("P"). Hide () - verbirgt alle Absatzelemente. Es stellt sicher, dass der JavaScript -Code erst ausgeführt wird, wenn das Dokument vollständig geladen ist. Dies ist wichtig, da Ihr JQuery -Code vor dem vollständigen Dokument ausgeführt wird, funktioniert er möglicherweise nicht ordnungsgemäß. Die Syntax dafür ist $ (dokument) .ready (function () {// jQuery -Methoden finden

Was ist der Zweck des $ -Sign in jQuery? Es wird verwendet, um JQuery zu definieren oder zuzugreifen. Wenn Sie eine andere JavaScript -Bibliothek verwenden, die das $ Sign verwendet, können Sie jQuery.noconflict () verwenden, um Konflikte zu vermeiden. Sie können Elemente mit dem Tagennamen, Klassennamen, ID, Attributen oder ihrer relativen Position in der HTML auswählen. Um beispielsweise alle Absatzelemente auszuwählen, würden Sie $ („P“) verwenden. Beispielsweise können Sie die Methode .hide () verwenden, um ausgewählte Elemente oder die .show () -Methode auszublenden, um sie anzuzeigen. Diese Methoden werden unter den ausgewählten Elementen wie SO aufgerufen: $ („P“). Hide (). Dies bedeutet, dass Sie mehrere Aktionen auf denselben Elementen ausführen können, die alle innerhalb einer einzigen Anweisung sind. Zum Beispiel $ („P“). CSS („Farbe“, „Rot“). SlideUp (2000).

Was sind jQuery -Ereignisse und wie werden sie verwendet? Dazu gehören Benutzeraktionen wie Klicks oder Tastenpressen oder Dinge wie das Laden des Dokuments. Sie können auf diese Ereignisse mit Funktionen antworten, sodass Sie dynamische, interaktive Webanwendungen erstellen können.

Wie schreiben Sie Kommentare in jQuery? Sie können // für einen einzelnen Zeilenkommentar oder / * * / für einen Mehrzeilungskommentar verwenden. Kommentare werden vom Browser ignoriert und können verwendet werden, um Notizen zu machen oder Ihren Code zu erklären. Dies kann eine lokale Kopie sein oder Sie können zu einer auf einem CDN gehosteten Version verlinken. Das Skript -Tag sollte in den Kopf Ihres HTML oder direkt vor dem Schlusskörper -Tag platziert werden. Es bietet eine einfachere, benutzerfreundlichere API für die Arbeit mit HTML-Dokumenten, Handhabung von Ereignissen, Erstellen von Animationen und vielem mehr. Während Sie all diese Dinge mit einfachem JavaScript machen können, macht JQuery es einfacher und funktioniert über eine Vielzahl von Browsern.

Das obige ist der detaillierte Inhalt von5 Nützliche Basis -JQuery -Syntax. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Stellungnahme:
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Vorheriger Artikel:Was ist JQuery?Nächster Artikel:Was ist JQuery?