jQuery এইচটিএমএল এলিমেন্ট নির্বাচন করুন এবং তাদের উপর কিছু “কার্য” সম্পাদন করুন।
jQuery সিনট্যাক্স
jQuery সিনট্যাক্স হল এইচটিএমএল এলিমেন্ট নির্বাচক এবং উক্ত এলিমেন্ট এর উপর কিছু কার্য সম্পাদন করা।
মৌলিক সিনট্যাক্স হচ্ছে : $(selector).action()
- $ চিহ্ন হচ্ছে jQuery কে সঙ্গায়িত বা jQuery এ প্রবেশ করার জন্য
- (selector) হচ্ছে এইচটিএমএল এলিমেন্ট এর "কুয়েরি (বা খোজার জন্য)"
- jQuery action() হচ্ছে এলিমেন্ট এর উপর কার্য সম্পাদনের জন্য
উদাহরন
$(this).hide() – বর্তমান এলিমেন্ট লুকায়
$("p").hide() – সকল <p> এলিমেন্ট লুকায়
$(".test").hide() – class="test" আছে এমন সকল এলিমেন্ট লুকায়
$("#test").hide() – id="test" আছে এমন সকল এলিমেন্ট লুকায়
আপনি কি সিএসএস সেক্টর এর সাথে পরিচিত ?
jQuery নির্বাচন করার জন্য সিএসএস সিনট্যাক্স ব্যাবহার করে। আপনি পরবর্তী টিউটরিয়াল এ সিলেক্টর সিনট্যাক্স সম্বন্ধে আরও জানতে পারবেন ।
Document Ready ইভেন্ট
আমাদের সকল উদাহরণে jQuery মেথড document ready ইভেন্ট এর ভিতরে লেখা হয়েছে:
$(document).ready(function(){
// jQuery methods go here...
});
এটি ডকুমেন্ট লোড হওয়ার পূর্বে jQuery কোড রান হওয়া থেকে রক্ষা করে।
ভাল অভ্যাস হচ্ছে jQuery নিয়ে কাজ করার পূর্বে ডকুমেন্ট পুরোপুরি লোড হওয়া পর্যন্ত অপেক্ষা করা। এটি ডকুমেন্ট প্রদর্শনের পূর্বেই হেড সেকশনে আপনার জাভাস্ক্রিপ্ট কোড পাওয়ার জন্য সহায়তা করে।
ডকুমেন্ট পুরোপুরি লোড হওয়ার পূর্বেই jQuery মেথড নিয়ে কাজ করলে কোন কার্য ব্যর্থ হতে পারে এখানে তার কিছু উদাহরণ দেখানো হলো:
- একটি এলিমেন্টকে লুকানর চেষ্টা করে যা এখনও তৈরি হয়নিি
- একটি ছবির আকার পেতে চেষ্টা করে যা এখনও লোড হয়নি
টিপস : jQuery টিম document ready এর জন্য সংক্ষিপ্ত পদ্ধতি তৈরি করেছে:
$(function(){
// jQuery methods go here...
});
