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