Ịmepụta ngwa dabere na Ajax na-aghọ ngwa ngwa na jQuery.
JQuery bu John Resig mebere na mbido 2006. A na-edobe ma na-arụkwa ọrụ jQuery ugbu a site n'aka otu ndị mmepe ekesara dị ka ọrụ mepere emepe.
Ị nwere ike ịchekwa ọtụtụ oge na mbọ na jQuery. Yabụ tinye saịtị a na ọkacha mmasị gị wee gaa n'ihu na-agụ
Enwere ọtụtụ ihe ndị ọzọ ị ga-eji jQuery mee.
Ndepụta ahụ akwụsịghị ebe ahụ, enwere ọtụtụ ihe ọma ndị ọzọ ị nwere ike iji jQuery mee.
Enwere ọtụtụ uru mere mmadụ ga-eji họrọ iji jQuery:
Iji bido, ka anyị buru ụzọ budata otu jQuery wee tinye ya n'ọrụ anyị. Ụdị jQuery abụọ dị maka nbudata: na ngwa ngwa e adịghị abịakọrọ .
The uncompressed faịlụ ka mma maka mmepe ma ọ bụ debugging; ebe, a na-atụ aro faịlụ dị ntakịrị na nke abịakọrọ maka mmepụta n'ihi na ọ na-echekwa bandwit ma na-eme ka arụmọrụ dịkwuo mma n'ihi obere faịlụ.
Anyị nwere ike budata jQuery site na ebe a: https://jquery.com/download/
Ozugbo ibudatara faịlụ jQuery, ị ga-ahụ na o nwere ndọtị js, ya bụ, ọ bụ faịlụ JavaScript. N'ezie JQuery abụghị ihe ọ bụla ma ọ bụghị ọbá akwụkwọ Javascript, yabụ ị nwere ike itinye faịlụ jQuery na akwụkwọ HTML yana mmewere. dị ka ị na-etinye faịlụ Javascript oge niile.
<head>
<title>Simple HTML Document</title>
<link rel="stylesheet" href="css/style.css">
<script src="js/jquery-3.6.3.min.js"></script>
</head>
<body>
<h1>Hello, World!</h1>
</body>
</html>Cheta na ị na-etinye faịlụ jQuery mgbe niile tupu edemede omenala; ma ọ bụghị ya, jQuery API agaghị adị mgbe koodu jQuery gị nwara ịnweta ha.
Dị ka ị chọpụtala, anyị wụpụrụ àgwà ahụ na ihe atụ gara aga type="text/javascript" n'ime mkpado . Infatti questo non è richiesto in HTML5. JavaScript è il linguaggio di scripting predefiEmechara na HTML5 yana na ihe nchọgharị ọgbara ọhụrụ niile.
Dị ka ihe ọzọ, ị nwere ike itinye jQuery n'ime akwụkwọ gị site na njikọ CDN (Content Delivery Network) dị n'efu, ma ọ bụrụ na ị ga-achọ izere nbudata faịlụ ahụ.
CDN nwere ike inye uru arụmọrụ site na ibelata oge ibu, n'ihi na ha na-akwado jQuery na ọtụtụ sava gburugburu ụwa, na mgbe onye ọrụ rịọrọ faịlụ ahụ, a ga-enye ya site na ihe nkesa kacha nso.
Nke a nwekwara uru na ọ bụrụ na onye ọbịa ibe weebụ gị ebudatalarị jQuery n'otu CDN ahụ mgbe ọ na-aga na saịtị ndị ọzọ, ha agaghị ebudata ya ọzọ ebe ọ bụ na ọ dịlarị na cache ihe nchọgharị ha.
N'okwu a, ị ga-ede:
<script src =" https://code.jquery.com/jquery-3.6.3.min.js "> </script>Na mgbakwunye na CDN nke ọrụ jquery nyere, ị nwere ike ịgụnye jQuery site na Google e Microsoft cdn.
N'ịhụla ebumnuche nke ọba akwụkwọ jQuery yana otu esi etinye ya na akwụkwọ gị, ugbu a bụ oge itinye jQuery n'ọrụ.
Ugbu a, ka anyị rụọ ọrụ jQuery dị mfe site n'ịgbanwe agba ederede nkụnye eji isi mee site na agba mbụdefinished nwa ka akwụkwọ ndụ akwụkwọ ndụ na agba.
<head>
<title>My First jQuery Web Page</title>
<link rel="stylesheet" href="css/style.css">
<script src="js/jquery-3.6.3.min.js"></script>
<script>
$(document).ready(function(){
$("h1").css("color", "#00ff00");
});
</script>
</head>
<body>
<h1>Hello, World!</h1>
</body>
</html>Na koodu anyị rụrụ ọrụ jQuery dị mfe site n'ịgbanwe agba nke nkụnye eji isi mee ya bụ mmewere iji jQuery element's selector na css() usoro mgbe akwụkwọ dị njikere, mara dị ka akwụkwọ njikere omume.
Nkwupụta jQuery na-amalitekarị na akara dollar ( $) ma mechie ya na ọkara ( ;).
Na jQuery, akara dollar ( $) bụ naanị utu aha maka jQuery. Tụlee koodu nlele na-egosi nkwupụta jQuery kachasị mfe.
<script>
$(document).ready(function(){
alert("Hello I'm a JQuery sign");
});
</script>Ihe atụ na-egosipụta nnọọ ozi ịdọ aka ná ntị “Hello I'm a JQuery sign” nye onye ọrụ. Ka anyị hụ ụfọdụ atụmatụ:
<script>: jQuery bụ ọbá akwụkwọ Javascript, enwere ike itinye koodu jQuery n'ime mmewere <script>, ma ọ bụ ị nwere ike tinye ya na faịlụ Javascript dị na mpụga;$(document).ready(handler); mara dị ka ihe omume njikere. Ebee ka ọ dị handler ọ bụ ọrụ a na-agafe na usoro a ga-eme, ozugbo akwụkwọ ahụ dị njikere, ya bụ mgbe e wuchara ndị isi DOM kpamkpam.Usoro jQuery ready() a na-ejikarị ya arụ ọrụ na-amaghị aha. Yabụ, enwere ike dee ihe atụ dị n'elu n'ụdị mkpirisi dị ka nke a:
<script>
$(function(){
alert("Hello I'm a JQuery sign");
});
</script>N'ime ọrụ ị nwere ike dee nkwupụta jQuery iji mee ihe ọ bụla na-eso syntax bụ isi, dị ka:
$(selector).action();Ebee ka ọ dị, $(selector) ọ na-ahọrọ ihe HTML sitere na osisi DOM ka ọ nwee ike ịmegharị ya na action() tinye ụfọdụ omume na ihe ndị ahọpụtara, dị ka ịgbanwe uru nke ihe onwunwe CSS, ma ọ bụ ịtọ ọdịnaya nke mmewere, wdg.
Ugbu a, ka anyị lee ihe atụ ọzọ na-edobe ederede paragraf:
<head>
<title>jQuery Demo</title>
<link rel="stylesheet" href="css/style.css">
<script src="js/jquery-3.6.3.min.js"></script>
<script>
$(document).ready(function(){
$("p").text("Hello World!");
});
</script>
</head>
<body>
<p>Not loaded yet.</p>
</body>
</html>Ihe atụ jQuery na-ezo aka na onye nhọpụta p, na nke a na-ahọrọ paragraf niile, mgbe ahụ usoro text() tinye ọdịnaya ederede nke paragraf na "Hello World!".
A na-edochi ederede paragraf dị na ihe atụ gara aga na-akpaghị aka mgbe akwụkwọ dị njikere. Mana ka anyị hụ otu esi eme ya ma ọ bụrụ na ịchọrọ ịme ihe tupu ịmee koodu jQuery, iji dochie ederede paragraf.
Ka anyị tụlee otu ihe atụ ikpeazụ:
<head>
<title>jQuery Demo</title>
<link rel="stylesheet" href="css/style.css">
<script src="js/jquery-3.6.3.min.js"></script>
<script>
$(document).ready(function(){
$("button").click(function(){
$("p").text("Hello World!");
});
});
</script>
</head>
<body>
<p>Not loaded yet.</p>
<button type="button">Replace Text</button>
</body>
</html>N'ihe atụ a, a na-edochi ederede paragraf naanị mgbe mmemme pịa na bọtịnụ "Replace Text", nke pụtara naanị mgbe onye ọrụ pịa bọtịnụ a.
Ị nwere ike iji onye nhọpụta ID họrọ otu ihe nwere NJ pụrụ iche na ibe.
Dịka ọmụmaatụ, koodu jQuery na-esote ga-ahọrọ ma gosipụta mmewere nwere njirimara ID id="markid", mgbe akwụkwọ ahụ dị njikere.
<script>
$(document).ready(function(){
// Highlight element with id markid
$("#markid").css("background", "grey");
});
</script>Enwere ike iji onye na-ahọrọ klaasị họrọ ihe nwere otu klaasị.
Dịka ọmụmaatụ, koodu jQuery na-esote ga-ahọrọ ma gosipụta ihe ndị nwere njirimara klaasị class="markclass", mgbe akwụkwọ ahụ dị njikere.
<script>
$(document).ready(function(){
// Highlight elements with class markclass
$(".markclass").css("background", "grey");
});
</script>Enwere ike iji onye na-ahọpụta ihe were aha ihe họrọ ihe.
Dịka ọmụmaatụ, koodu jQuery na-esote ga-ahọrọ ma mee ka paragraf niile pụta ìhè, ya bụ ihe ndị ahụ "<p>" nke akwụkwọ mgbe ọ dị njikere.
<script>
$(document).ready(function(){
// Highlight paragraph elements
$("p").css("background", "grey");
});
</script>Ị nwere ike iji onye na-ahọrọ àgwà iji họrọ mmewere dabere na otu n'ime àgwà HTML ya, dị ka njirimara njikọ. targetma ọ bụ àgwà nke ntinye type, wdg.
Dịka ọmụmaatụ, koodu jQuery na-esote ga-ahọrọ wee pụta ìhè ntinye ederede niile, dị ka ihe "<input>" con type="text", mgbe akwụkwọ ahụ dị njikere.
<script>
$(document).ready(function(){
// Highlight paragraph elements
$('input[type="text"]').css("background", "grey");
});
</script>Ịnwekwara ike ijikọ ndị na-ahọpụta CSS iji mee ka nhọrọ gị bụrụ nke ziri ezi.
Dịka ọmụmaatụ, ị nwere ike ijikọta onye na-ahọpụta klas na onye na-ahọrọ element ka ịchọta ihe dị na akwụkwọ nwere otu ụdị na klaasị.
<script>
$(document).ready(function(){
// Highlight only paragraph elements with class mark
$("p.mark").css("background", "yellow");
// Highlight only span elements inside the element with ID mark
$("#mark span").css("background", "yellow");
// Highlight li elements inside the ul elements
$("ul li").css("background", "red");
// Highlight li elements only inside the ul element with id mark
$("ul#mark li").css("background", "yellow");
// Highlight li elements inside all the ul element with class mark
$("ul.mark li").css("background", "green");
// Highlight all anchor elements with target blank
$('a[target="_blank"]').css("background", "yellow");
});
</script>Na mgbakwunye na ndị na-ahọpụta definiti, jQuery na-enye onye na-ahọrọ omenala nke ya iji kwalite ike nke ịhọrọ ihe na ibe.
<script>
$(document).ready(function(){
// Highlight table rows appearing at odd places
$("tr:odd").css("background", "yellow");
// Highlight table rows appearing at even places
$("tr:even").css("background", "orange");
// Highlight first paragraph element
$("p:first").css("background", "red");
// Highlight last paragraph element
$("p:last").css("background", "green");
// Highlight all input elements with type text inside a form
$("form :text").css("background", "purple");
// Highlight all input elements with type password inside a form
$("form :password").css("background", "blue");
// Highlight all input elements with type submit inside a form
$("form :submit").css("background", "violet");
});
</script>A na-ebutekarị ihe omume site na mmekọrịta onye ọrụ na ibe weebụ, dị ka mgbe ịpịrị njikọ ma ọ bụ bọtịnụ, itinye ederede n'ime igbe ntinye ma ọ bụ mpaghara ederede, mee nhọrọ n'ime igbe nhọrọ, pịa igodo dị na ahụigodo, bugharịa pointer òké. , wdg. N'ọnọdụ ụfọdụ, ihe nchọgharị n'onwe ya nwere ike ịkpalite mmemme, dị ka ibu ibe na nbudata mmemme.
jQuery na-emeziwanye usoro njikwa mmemme bụ isi site na ịnye usoro mmemme maka ọtụtụ mmemme ihe nchọgharị obodo, ụfọdụ n'ime ụzọ ndị a bụ. ready(), click(), keypress(), focus(), blur(), change(), wdg.
<script>
$(document).ready(function(){
// Code to be executed
alert("Hello World!");
});
</script>N'ozuzu, enwere ike kewaa mmemme n'ime otu anọ:
A na-akpalite mmemme òké mgbe onye ọrụ pịrị ihe, kpalie pointer òké, wdg.
Nke a bụ ụzọ jQuery a na-ejikarị eme ihe omume òké.
click()Usoro click() tinye ọrụ njikwa mmemme na ihe ndị ahọpụtara maka mmemme ahụ "click". Ọrụ ejikọrọ na-arụ ọrụ mgbe onye ọrụ pịa ihe ahụ. Ihe atụ na-esonụ ga-ezobe ihe ndị ahụ <p> na ibe mgbe pịrị.
<script>
$(document).ready(function(){
$("p").click(function(){
$(this).slideUp();
});
});
</script>dblclick()Usoro dblclick() tinye ọrụ njikwa mmemme na ihe ndị ahọpụtara maka mmemme ahụ "dblclick". Ọrụ ejikọrọ na-arụ ọrụ mgbe onye ọrụ pịa ihe ahụ ugboro abụọ. Ihe atụ na-esonụ ga-ezobe ihe ndị ahụ <p> mgbe ịpị ha ugboro abụọ.
<script>
$(document).ready(function(){
$("p").dblclick(function(){
$(this).slideUp();
});
});
</script>hover()Usoro hover() tinye otu onye na-ahụ maka mmemme ma ọ bụ abụọ na ihe ndị ahọpụtara nke na-eme mgbe ihe nrịbama òké na-abanye na pụta. Ọrụ nke mbụ na-arụ ọrụ mgbe onye ọrụ na-etinye ihe nrịbama òké n'elu ihe, ebe ọrụ nke abụọ na-arụ ọrụ mgbe onye ọrụ wepụrụ pointer òké na ihe ahụ.
Ihe atụ na-esonụ ga-eme ka ihe pụta ìhè <p> mgbe ị na-etinye cursor na ya, a ga-ewepụ isi ihe mgbe ị na-ewepụ cursor.
<script>
$(document).ready(function(){
$("p").hover(function(){
$(this).addClass("highlight");
}, function(){
$(this).removeClass("highlight");
});
});
</script>mouseenter()Usoro mouseenter() tinye ọrụ njikwa mmemme na ihe ndị ahọpụtara nke a na-eme mgbe òké na-abanye na mmewere. Ọmụmaatụ na-esote ga-agbakwunye ọkwa ọkwa na mmewere <p> mgbe ị na-etinye cursor n'elu ya.
<script>
$(document).ready(function(){
$("p").mouseenter(function(){
$(this).addClass("highlight");
});
});
</script>mouseleave()Usoro mouseleave() tinye ọrụ njikwa mmemme na ihe ahọpụtara nke na-eme mgbe òké hapụrụ ihe. Ihe atụ na-esonụ ga-ewepụ isi ihe klaasị na mmewere <p> mgbe ị na-ewepụ cursor na ya.
<script>
$(document).ready(function(){
$("p").mouseleave(function(){
$(this).removeClass("highlight");
});
});
</script>A na-ebuli mmemme ahụigodo mgbe onye ọrụ pịa ma ọ bụ wepụta igodo na ahụigodo. Ka anyị lelee ụzọ jQuery a na-ejikarị eme mmemme ahụigodo.
keypress()Usoro keypress() na-ejikọta ọrụ njikwa mmemme na ihe ndị ahọpụtara (na-abụkarị njikwa ụdị) nke na-agba mgbe ihe nchọgharị na-enweta ntinye ahụigodo n'aka onye ọrụ. Ọmụmaatụ na-esote ga-egosipụta ozi mgbe ewelitere mmemme ahụ keypress na ugboro ole ka ọ na-akpali mgbe ị pịa igodo dị na ahụigodo gị.
<script>
$(document).ready(function(){
var i = 0;
$('input[type="text"]').keypress(function(){
$("span").text(i += 1);
$("p").show().fadeOut();
});
});
</script>Ihe omume ịpị igodo yiri mmemme igodo agbada, belụsọ na mgbanwe na igodo enweghị mbipụta dịka Shift, Esc, Backspace ma ọ bụ Hichapụ, igodo akụ, wdg. ha na-agba mmemme igodo mgbada mana ọ bụghị mmemme igodo igodo.
keydown()Usoro keydown() na-ejikọta ọrụ njikwa mmemme na ihe ahọpụtara (na-abụkarị njikwa ụdị) nke a na-eme mgbe mbụ onye ọrụ pịa igodo na ahụigodo. Ọmụmaatụ na-esote ga-egosipụta ozi mgbe ewelitere mmemme ahụ keydown na ugboro ole ka ọ na-akpali mgbe ị pịa igodo dị na ahụigodo gị.
<script>
$(document).ready(function(){
var i = 0;
$('input[type="text"]').keydown(function(){
$("span").text(i += 1);
$("p").show().fadeOut();
});
});
</script>keyup()Usoro keyup() tinye ọrụ njikwa mmemme na ihe ahọpụtara (na-abụkarị njikwa ụdị) nke a na-eme mgbe onye ọrụ wepụtara igodo na ahụigodo. Ọmụmaatụ na-esote ga-egosipụta ozi mgbe ewelitere mmemme ahụ keyup na ugboro ole ka ọ na-akpali mgbe ịpịrị ma hapụ igodo na ahụigodo gị.
<script>
$(document).ready(function(){
var i = 0;
$('input[type="text"]').keyup(function(){
$("span").text(i += 1);
$("p").show().fadeOut();
});
});
</script>A na-akpalite mmemme ụdị mgbe njikwa ụdị na-enweta ma ọ bụ tụfuo elekwasị anya, ma ọ bụ mgbe onye ọrụ gbanwere uru njikwa ụdị, dị ka ịpị ederede n'ime ntinye ederede, ịhọrọ nhọrọ n'ime igbe họrọ, wdg. Nke a bụ ụzọ jQuery a na-ejikarị eme mmemme ụdị.
change()Usoro change() tinye ọrụ njikwa mmemme na ọcha <input> a na-egbukwa ya mgbe uru ya gbanwere. Ihe atụ na-esonụ ga-egosipụta ozi ịdọ aka ná ntị mgbe ị na-ahọrọ nhọrọ n'ime igbe nhọrọ ọdịda.
<script>
$(document).ready(function(){
$("select").change(function(){
var selectedOption = $(this).find(":selected").val();
alert("You have selected - " + selectedOption);
});
});
</script>Maka igbe pịa, igbe nlele, na bọtịnụ redio, ihe omume ahụ na-agba ọkụ ozugbo mgbe onye ọrụ na-eme nhọrọ òké, mana maka ntinye ederede na mpaghara ederede ihe omume na-agba ọkụ mgbe mmewere ahụ kwụsịrị ilekwasị anya.
focus()Usoro focus() na-ejikọta ọrụ njikwa ihe omume na ihe ndị ahọpụtara (na-ejikarị njikwa na ụdị njikọ) na-eme mgbe ọ gbadoro anya. Ihe atụ na-esonụ ga-egosipụta ozi mgbe ntinye ederede nwetara elekwasị anya.
<script>
$(document).ready(function(){
$("input").focus(function(){
$(this).next("span").show().fadeOut("slow");
});
});
</script>blur()Usoro blur() tinye ọrụ njikwa mmemme ka imepụta ihe dịka <input>, <textarea>, <select> nke a na-egbu mgbe ọ tụfuru uche. Ihe atụ na-esonụ ga-egosipụta ozi mgbe ntinye ederede tụfuru nlebara anya.
<script>
$(document).ready(function(){
$("input").blur(function(){
$(this).next("span").show().fadeOut("slow");
});
});
</script>submit()Usoro submit() tinye ọrụ njikwa mmemme na ọcha <form> nke na-agba ọsọ mgbe onye ọrụ na-agbalị ịnyefe ụdị. Ọmụmaatụ na-esote ga-egosipụta ozi dabere na uru etinyere mgbe ị na-achọ ịnyefe ụdị ahụ.
<script>
$(document).ready(function(){
$("form").submit(function(event){
var regex = /^[a-zA-Z]+$/;
var currentValue = $("#firstName").val();
if(regex.test(currentValue) == false){
$("#result").html('<p class="error">Not valid!</p>').show().fadeOut(1000);
// Preventing form submission
event.preventDefault();
}
});
});
</script>A na-agbakwa ihe omume ahụ n'ọnọdụ ebe DOM (Akwụkwọ Ihe Nlereanya Ihe Nlereanya) dị njikere ma ọ bụ mgbe onye ọrụ gbanwere ma ọ bụ pịgharịa na windo ihe nchọgharị, wdg. Nke a bụ ụzọ jQuery a na-ejikarị eme ụdị mmemme a.
ready()Usoro ready() na-akọwapụta ọrụ ime mgbe DOM bujuru ya.
Ọmụmaatụ na-esote ga-anọchi ederede paragraf ozugbo e wulitere ndị isi DOM nke ọma ma dị njikere ijikwa ya.
<script>
$(document).ready(function(){
$("p").text("The DOM is now loaded and can be manipulated.");
});
</script>resize()Usoro resize() tinye ọrụ onye na-ahụ maka ihe omume na mmewere mpio nke na-agba mgbe nha nke windo ihe nchọgharị gbanwere.
Ihe atụ na-esonụ ga-egosi obosara na ịdị elu nke windo ihe nchọgharị ugbu a mgbe ị na-agbalị imegharị ya site na ịdọrọ akụkụ ya.
<script>
$(document).ready(function(){
$(window).resize(function() {
$(window).bind("resize", function(){
$("p").text("Window width: " + $(window).width() + ", " + "Window height: " + $(window).height());
});
});
});
</script>scroll()Usoro scroll() tinye ọrụ njikwa mmemme na mpio ma ọ bụ na iframe na ihe ndị nwere ike ịpịgharị na-agba ọsọ mgbe ọ bụla ọnọdụ mpịakọta nke ihe gbanwere.
Ihe atụ na-esonụ ga-egosipụta ozi mgbe ị na-atụgharị mpio ihe nchọgharị ahụ.
<script>
$(document).ready(function(){
$(window).scroll(function() {
$("p").show().fadeOut("slow");
});
});
</script>Ercole Palmeri
.
A rụrụ ọrụ ophthalmoplasty site na iji ihe nlele azụmahịa Apple Vision Pro na Catania Polyclinic…
Ịzụlite ọmarịcha nka ụgbọ ala site na ịcha agba na-akwado ụmụaka maka nka dị mgbagwoju anya dị ka ide ihe. Ka agba…
Ngalaba ndị agha mmiri bụ ezigbo ike akụ na ụba ụwa, nke gorola n'ahịa ahịa ijeri 150 ...
Mọnde gara aga, Financial Times kwupụtara nkwekọrịta ya na OpenAI. FT na-enye ikike maka akwụkwọ akụkọ ụwa…