jQuery syntax

Genom jQuery kan du välja (söka, query) HTML-element och utföra "operationer" (actions) på dem.

jQuery-syntaks exempel

$(this).hide()
Demonstration av jQuery hide()-funktionen, döljer den aktuella HTML-elementen
$("#test").hide()
Demonstration av jQuery hide()-funktionen, döljer element med id="test"
$("p").hide()
Demonstration av jQuery hide()-funktionen, döljer alla <p>-element
$(".test").hide()
Demonstration av jQuery hide()-funktionen, döljer alla element med class="test"

jQuery syntax

jQuery-syntaks är avsedd för att välja HTML-element och utföra vissa operationer på dem.

Grund语法 är:$(selector).action()

  • Dollarsymbolen definierar jQuery
  • Väljare (selector) "söker" och "finner" HTML-element
  • jQuery action() utför operationer på element

Exempel

$(this).hide() - Döljer den aktuella elementen

$("p").hide() - Döljer alla paragrafer

$(".test").hide() - Döljer alla element med class="test"

$("#test").hide() - Döljer alla element med id="test"

Tips:jQuery använder en kombination av XPath- och CSS-väljare syntax. I de kommande kapitlen i denna tutorial kommer du att lära dig mer om väljare syntax.

Dokumentklara funktioner

Du kanske har lagt märke till att alla jQuery-funktioner i våra exempel ligger inom en document ready-funktion:

$(document).ready(function(){
  // jQuery-funktioner här
});

Detta är för att förhindra att jQuery-kod körs innan dokumentet är helt laddat (klart).

Om funktionen körs innan dokumentet är helt laddat, kan operationen misslyckas. Här är två specifika exempel:

  • Försöker dölja ett icke-existerande element
  • Få storleken på en inte helt laddad bild