jQuery-এর মৌলিক সিনট্যাক্সে একটি নির্বাচক(CSS-শৈলী নির্বাচক) এবং নির্বাচিত উপাদানগুলিকে ম্যানিপুলেট করার পদ্ধতি ব্যবহার করা জড়িত। এখানে jQuery এর কিছু মৌলিক সিনট্যাক্স উদাহরণ রয়েছে:
উপাদান নির্বাচন
-
HTML ট্যাগ নামের দ্বারা উপাদান নির্বাচন করুন:
$("tagname")উদাহরণ: পৃষ্ঠার$("p")সমস্ত উপাদান নির্বাচন করে ।<p> -
CSS ক্লাস দ্বারা উপাদান নির্বাচন করুন:
$(".classname")উদাহরণ:$(".myClass")"myClass" ক্লাস সহ সমস্ত উপাদান নির্বাচন করে। -
আইডি দ্বারা উপাদান নির্বাচন করুন:
$("#idname")উদাহরণ:$("#myElement")আইডি "myElement" সহ উপাদান নির্বাচন করে। -
বৈশিষ্ট্য অনুসারে উপাদান নির্বাচন করুন:
$("[attribute='value']")উদাহরণ: "বোতাম" এ$("[data-type='button']")বৈশিষ্ট্যযুক্ত উপাদান নির্বাচন করে ।data-type -
একত্রিত নির্বাচন:
$("tagname.classname"),$("#idname .classname"), ...
নির্বাচিত উপাদান ম্যানিপুলেট করা
-
একটি উপাদানের বিষয়বস্তু পরিবর্তন করা:
.html(),.text()উদাহরণ:$("#myElement").html("New content")আইডি "myElement" সহ উপাদানটির HTML বিষয়বস্তু সেট করে। -
উপাদান বৈশিষ্ট্য পরিবর্তন:
.attr(),.prop()উদাহরণ: সমস্ত উপাদানের বৈশিষ্ট্য$("img").attr("src", "newimage.jpg")পরিবর্তন.src<img> -
একটি উপাদানের CSS ক্লাস ম্যানিপুলেট করা:
.addClass(),.removeClass(),.toggleClass()উদাহরণ:$("#myElement").addClass("highlight")আইডি "myElement" সহ উপাদানটিতে "হাইলাইট" ক্লাস যোগ করে। -
উপাদান লুকিয়ে/দেখানো:
.hide(),.show(),.toggle()উদাহরণ:$(".myClass").hide()"myClass" ক্লাসের সাথে সমস্ত উপাদান লুকিয়ে রাখে। -
উপাদানগুলিতে ইভেন্ট পরিচালনা করা:
.click(),.hover(),.submit(), ... উদাহরণ:$("button").click(function() { ... })একটি ক্লিক ইভেন্ট হ্যান্ডলার নিবন্ধন করে৷
উপাদান সংগ্রহ সঙ্গে কাজ
-
একটি সংগ্রহের মাধ্যমে পুনরাবৃত্তি:
.each()উদাহরণ: পৃষ্ঠার$("li").each(function() { ... })প্রতিটি উপাদানের উপর পুনরাবৃত্তি করে ।<li> -
একটি সংগ্রহ ফিল্টার করা:
.filter(),.not()উদাহরণ: উপাদানগুলিকে$("div").filter(".myClass")ফিল্টার করে<div>এবং "myClass" ক্লাস সহ সেগুলি নির্বাচন করে৷ -
একটি সংগ্রহে উপাদান সন্নিবেশ করান:
.append(),.prepend(),.after(),.before()উদাহরণ: আইডি "myElement" সহ উপাদানটিতে$("#myElement").append("<p>New paragraph</p>")একটি নতুন উপাদান যুক্ত করে ।<p>
প্রভাব এবং অ্যানিমেশন
-
fadeIn/fadeOut প্রভাবগুলি সম্পাদন করা:
.fadeIn(),.fadeOut()উদাহরণ:$("#myElement").fadeIn(1000)1 সেকেন্ডের সময়কাল ধরে "myElement" আইডি সহ উপাদানে বিবর্ণ। -
স্লাইডআপ/স্লাইডডাউন প্রভাবগুলি সম্পাদন করা:
.slideUp(),.slideDown()উদাহরণ:$(".myClass").slideUp(500)0.5 সেকেন্ডের সময়কাল ধরে "myClass" ক্লাস সহ সমস্ত উপাদানকে স্লাইড করে৷ -
কাস্টম অ্যানিমেশনগুলি সম্পাদন করা:
.animate()উদাহরণ:$("#myElement").animate({ left: '250px', opacity: '0.5' })আইডি "myElement" সহ উপাদানটিকে তার বাম অবস্থান এবং অস্বচ্ছতা পরিবর্তন করে অ্যানিমেট করে৷
এই উদাহরণগুলি দেখায় কিভাবে jQuery-এর মৌলিক সিনট্যাক্সের বিভিন্ন দিক ব্যবহার করে উপাদান নির্বাচন করতে, তাদের বৈশিষ্ট্যগুলি পরিচালনা করতে এবং প্রভাব বা অ্যানিমেশন প্রয়োগ করতে হয়। jQuery ওয়েব ডেভেলপমেন্টের কাজগুলিকে সহজ এবং উন্নত করার জন্য পদ্ধতি এবং কার্যকারিতার একটি সমৃদ্ধ সেট অফার করে৷