Baineann comhréir bhunúsach jQuery úsáid as roghnóir(roghnóir ar stíl CSS) agus modhanna chun na heilimintí roghnaithe a ionramháil. Seo roinnt samplaí bunúsacha comhréire de jQuery:
Roghnú eilimintí
-
Roghnaigh eilimintí de réir ainm chlib HTML:
$("tagname")
Sampla:$("p")
roghnaíonn gach<p>
eilimint ar an leathanach. -
Roghnaigh eilimintí de réir rang CSS:
$(".classname")
Sampla:$(".myClass")
roghnaíonn sé gach eilimint leis an rang "myClass". -
Roghnaigh eilimintí de réir aitheantais:
$("#idname")
Sampla:$("#myElement")
roghnaíonn sé an eilimint leis an ID "myElement". -
Roghnaigh eilimintí de réir aitreabúide:
$("[attribute='value']")
Sampla:$("[data-type='button']")
roghnaíonn sé eilimintí leis an aitreabúiddata-type
a leagtar ar "cnaipe". -
Roghanna a chomhcheangal:
$("tagname.classname")
,$("#idname .classname")
, ...
Gnéithe roghnaithe a ionramháil
-
Ag athrú ábhar eiliminte:
.html()
,.text()
Sampla:$("#myElement").html("New content")
socraítear ábhar HTML na heiliminte le ID "myElement". -
Tréithe na n-eilimintí a mhodhnú:
.attr()
,.prop()
Sampla:$("img").attr("src", "newimage.jpg")
athraíonnsrc
tréith gach<img>
eilimint. -
Trí aicmí CSS d'eilimint a ionramháil:
.addClass()
,.removeClass()
,.toggleClass()
Sampla:$("#myElement").addClass("highlight")
cuireann sé an rang "aird a tharraingt" leis an eilimint le ID "myElement". -
Eilimintí folaithe/taispeáint:
.hide()
,.show()
,.toggle()
Sampla:$(".myClass").hide()
folaíonn sé gach eilimint leis an rang "myClass". -
Láimhseáil imeachtaí ar eilimintí:
.click()
,.hover()
,.submit()
, ... Sampla:$("button").click(function() { ... })
cláraíonn sé láimhseálaí imeacht cliceáil
Ag obair le bailiúcháin eilimintí
-
Ag atriall trí bhailiúchán:
.each()
Sampla:$("li").each(function() { ... })
athrá thar gach<li>
eilimint ar an leathanach. -
Bailiúchán a scagadh:
.filter()
,.not()
Sampla:$("div").filter(".myClass")
scagtar na<div>
heilimintí agus roghnaíonn sé iad siúd leis an rang "myClass". -
Eilimintí a chur isteach i mbailiúchán:
.append()
,.prepend()
,.after()
,.before()
Sampla:$("#myElement").append("<p>New paragraph</p>")
cuireann eilimint nua<p>
leis an eilimint a bhfuil ID "myElement" air.
Éifeachtaí agus beochan
-
Éifeachtaí fadeIn/fadeOut á bhfeidhmiú:
.fadeIn()
,.fadeOut()
Sampla:$("#myElement").fadeIn(1000)
fadaítear san eilimint le ID “myElement” thar thréimhse 1 soicind. -
Éifeachtaí slideUp/sleamhnán Síos a dhéanamh:
.slideUp()
,.slideDown()
Sampla:$(".myClass").slideUp(500)
sleamhnáin suas na heilimintí go léir leis an rang "myClass" thar thréimhse 0.5 soicind. -
Beochan saincheaptha a dhéanamh:
.animate()
Sampla:$("#myElement").animate({ left: '250px', opacity: '0.5' })
beocht an eilimint le ID "myElement" trína suíomh clé agus a teimhneacht a athrú.
Léiríonn na samplaí seo conas gnéithe éagsúla de chomhréir bhunúsach jQuery a úsáid chun gnéithe a roghnú, a n-airíonna a ionramháil, agus éifeachtaí nó beochan a chur i bhfeidhm. Tairgeann jQuery sraith shaibhir modhanna agus feidhmiúlachtaí chun tascanna forbartha gréasáin a shimpliú agus a fheabhsú.