close

Sintassi Bażika ta' jQuery- Għażla, Manipulazzjoni, u Effetti

Is-sintassi bażika ta 'jQuery tinvolvi l-użu ta' selettur(selettur ta 'stil CSS) u metodi biex jimmanipulaw l-elementi magħżula. Hawn huma xi eżempji bażiċi ta' sintassi ta' jQuery:

 

Għażla ta' elementi

  • Agħżel elementi bl-isem tat-tikketta HTML: $("tagname") Eżempju: $("p") tagħżel <p> l-elementi kollha fuq il-paġna.

  • Agħżel l-elementi skond il-klassi CSS: $(".classname") Eżempju: $(".myClass") jagħżel l-elementi kollha bil-klassi "myClass".

  • Agħżel elementi bl-ID: $("#idname") Eżempju: $("#myElement") tagħżel l-element bl-ID "myElement".

  • Agħżel elementi skont l-attribut: $("[attribute='value']") Eżempju: $("[data-type='button']") tagħżel elementi bl-attribut data-type issettjat bħala "buttuna".

  • Tgħaqqad selezzjonijiet: $("tagname.classname"), $("#idname .classname"), ...

 

Manipulazzjoni ta 'elementi magħżula

  • Nibdlu l-kontenut ta' element: .html(), .text() Eżempju: $("#myElement").html("New content") jistabbilixxi l-kontenut HTML tal-element bl-ID "myElement".

  • Li timmodifika l-attributi tal-element: .attr(), .prop() Eżempju: $("img").attr("src", "newimage.jpg") jibdel l- src attribut tal-elementi kollha <img>.

  • Manipulazzjoni ta' klassijiet CSS ta' element: .addClass(), .removeClass(), .toggleClass() Eżempju: $("#myElement").addClass("highlight") iżid il-klassi "highlight" mal-element bl-ID "myElement".

  • Ħabi/juri elementi: .hide(), .show(), .toggle() Eżempju: $(".myClass").hide() jaħbi l-elementi kollha bil-klassi "myClass".

  • Immaniġġjar ta' avvenimenti fuq elementi: .click(), .hover(), .submit(), ... Eżempju: $("button").click(function() { ... }) jirreġistra handler tal-avvenimenti tal-ikklikkja

 

Ħidma ma 'kollezzjonijiet ta' element

  • Tgħaddi minn kollezzjoni: .each() Eżempju: $("li").each(function() { ... }) itenni fuq kull <li> element fil-paġna.

  • Iffiltrar ta' kollezzjoni: .filter(), .not() Eżempju: $("div").filter(".myClass") jiffiltra l- <div> elementi u jagħżel dawk bil-klassi "myClass".

  • Daħħal elementi f'kollezzjoni: .append(), .prepend(), .after(), .before() Eżempju: $("#myElement").append("<p>New paragraph</p>") tehmeż element ġdid <p> mal-element bl-ID "myElement".

 

Effetti u animazzjonijiet

  • Twettiq ta' effetti fadeIn/fadeOut: .fadeIn(), .fadeOut() Eżempju: $("#myElement").fadeIn(1000) tgħib fl-element bl-ID "myElement" fuq tul ta' sekonda.

  • Twettiq ta' effetti slideUp/slideDown: .slideUp(), .slideDown() Eżempju: $(".myClass").slideUp(500) tiżżerżaq 'il fuq l-elementi kollha bil-klassi "myClass" fuq tul ta' 0.5 sekondi.

  • Twettiq ta' animazzjonijiet personalizzati: .animate() Eżempju: $("#myElement").animate({ left: '250px', opacity: '0.5' }) janima l-element bl-ID "myElement" billi jibdel il-pożizzjoni tax-xellug u l-opaċità tiegħu.

 

Dawn l-eżempji juru kif tuża aspetti differenti tas-sintassi bażika ta’ jQuery biex tagħżel elementi, timmanipula l-proprjetajiet tagħhom, u tapplika effetti jew animazzjonijiet. jQuery joffri sett għani ta 'metodi u funzjonalitajiet biex jissimplifikaw u jtejbu l-kompiti ta' żvilupp tal-web.