close

Syntax ya Msingi ya jQuery- Kuchagua, Kudhibiti, na Athari

Sintaksia ya msingi ya jQuery inahusisha kutumia kiteuzi(kiteuzi cha mtindo wa CSS) na mbinu za kudhibiti vipengele vilivyochaguliwa. Hapa kuna mifano ya kimsingi ya syntax ya jQuery:

 

Kuchagua vipengele

  • Chagua vipengele kwa jina la lebo ya HTML: $("tagname") Mfano: $("p") huchagua <p> vipengele vyote kwenye ukurasa.

  • Chagua vipengee kulingana na darasa la CSS: $(".classname") Mfano: $(".myClass") huchagua vitu vyote na darasa "myClass".

  • Chagua vipengele kwa kitambulisho: $("#idname") Mfano: $("#myElement") huchagua kipengele na kitambulisho "myElement".

  • Chagua vipengele kwa sifa: $("[attribute='value']") Mfano: $("[data-type='button']") huchagua vipengele vilivyo na sifa data-type iliyowekwa kwenye "kifungo".

  • Kuchanganya chaguzi: $("tagname.classname"), $("#idname .classname"), ...

 

Kudhibiti vipengele vilivyochaguliwa

  • Kubadilisha maudhui ya kipengele: .html(), .text() Mfano: $("#myElement").html("New content") huweka maudhui ya HTML ya kipengele na ID "myElement".

  • Kurekebisha sifa za kipengele: .attr(), .prop() Mfano: $("img").attr("src", "newimage.jpg") hubadilisha src sifa ya vipengele vyote <img>.

  • Kudhibiti madarasa ya CSS ya kipengele: .addClass(), .removeClass(), .toggleClass() Mfano: $("#myElement").addClass("highlight") huongeza darasa "angazia" kwenye kipengele chenye kitambulisho "myElement".

  • Kuficha/kuonyesha vipengele: .hide(), .show(), .toggle() Mfano: $(".myClass").hide() huficha vipengele vyote na darasa la "myClass".

  • Kushughulikia matukio kwenye vipengele: .click(), .hover(), .submit(), ... Mfano: $("button").click(function() { ... }) husajili kidhibiti tukio la kubofya

 

Kufanya kazi na makusanyo ya kipengele

  • Kurudia kupitia mkusanyiko: .each() Mfano: $("li").each(function() { ... }) hurudia juu ya kila <li> kipengele kwenye ukurasa.

  • Kuchuja mkusanyiko: .filter(), .not() Mfano: $("div").filter(".myClass") huchuja <div> vipengele na kuchagua vile vilivyo na darasa la "myClass".

  • Kuingiza vipengee kwenye mkusanyiko: .append(), .prepend(), .after(), .before() Mfano: $("#myElement").append("<p>New paragraph</p>") huongeza <p> kipengele kipya kwa kipengele na kitambulisho "myElement".

 

Athari na uhuishaji

  • Kufanya madoido ya fadeIn/fadeOut: .fadeIn(), .fadeOut() Mfano: $("#myElement").fadeIn(1000) hufifia kwenye kipengele chenye kitambulisho cha "myElement" kwa muda wa sekunde 1.

  • Kufanya madoido ya slideUp/slideDown: .slideUp(), .slideDown() Mfano: $(".myClass").slideUp(500) huteleza juu vipengele vyote na darasa la "myClass" kwa muda wa sekunde 0.5.

  • Kufanya uhuishaji maalum: .animate() Mfano: $("#myElement").animate({ left: '250px', opacity: '0.5' }) huhuisha kipengele kwa kitambulisho cha "myElement" kwa kubadilisha mkao wake wa kushoto na uwazi.

 

Mifano hii inaonyesha jinsi ya kutumia vipengele tofauti vya sintaksia ya msingi ya jQuery ili kuchagua vipengele, kudhibiti sifa zao, na kutumia madoido au uhuishaji. jQuery inatoa seti tajiri ya mbinu na utendaji kazi ili kurahisisha na kuboresha kazi za ukuzaji wa wavuti.