html এর এলিমেন্ট কে নির্ধারণ অর্থাৎ select করার জন্য যেক্যুয়েরী syntax ব্যবহার করা হয় এবং ঐ উপাদান বা element গুলির উপর কোন কার্য অর্থাৎ action সম্পাদন করা হয়। যেক্যুয়েরী কে প্রকাশের জন্য সর্বদা নিচের প্রতীক গুলো ব্যবহার করা হয়।
websSchool.com এ সকল ক্ষেত্রে আমরা " $ " প্রতীকটিই বেশী ব্যবহার করবো, কারন " $ " প্রতীকটি সবচেয়ে ছোট এবং ব্যবহার করা সহজ।
jQuery কোড লেখার বেসিক সিনট্যাক্সটি হল নিম্মরুপ -
$(selector).action()
সিনট্যাক্সের ব্যাখ্যা
ওপরের সিনট্যাক্সটি দেখুন, এখানে
- Dollar ( $ ) প্রতীকটি jQuery কে নির্দেশ করে,
- selector অংশটি এইচটিএমএল এলিমেন্ট কে নির্ধারণ জন্য ব্যবহার করা হয় এবং
- এইচটিএমএল এলিমেন্ট এর উপর যে কার্য সম্পন্ন হবে তা action() অংসটির মধ্যে থাকে।
ওপরের সিনট্যাক্স অনুসারে নিচে কিছু যেক্যুয়েরী কোডের উদাহরণ দেখুন।
$(this).hide() // বর্তমান এলিমেন্ট অদৃশ্য হবে $("p").hide() // সকল paragraph অদৃশ্য হবে $("p.test").hide() // যে সকল paragraph এর class="test", সেগুলি অদৃশ্য হবে $("#test").hide() যে সকল element এর id="test", সেগুলি অদৃশ্য হবে
websSchool.com এর সকল উদাহরণ গুলো লক্ষ্য করলে দেখবেন প্রায় সকল উদাহরণ গুলোই একটি document ready ইভেন্ট এর মাঝে রাখা হয়েছে। নিচে যেক্যুয়েরী কোড ব্যবহার করে একটি সাধারণ উদাহরণ দেখুন।
$(document).ready(function(){ // jQuery methods go here... });
এ রকমটা করার কারন হল এইচটিএমএল কোড লোড হবার পূর্বেই যেন যেক্যুয়েরী কোড গুলো লোড হয়। যদি এইচটিএমএল কোড লোড হবার পূর্বেই যেক্যুয়েরী কোড লোড হয় তবে এইচটিএমএল কোড গুলোর ওপর যেক্যুয়েরী কোড ঠিক মত কাজ করবে না। উদাহরণ স্বরূপ বলা যায় - যদি কোন এইচটিএমএল এলিমেন্টকে আমার hide করতে চাই তবে, এইচটিএমএল কোড লোড হবার পূর্বেই যেক্যুয়েরী কোড লোড করতে হবে, তবেই তা এমন একটি এইচটিএমএল এলিমেন্টকে hide করতে চেস্টা করবে যা তখনও তৈরিই হয় নি। আবা্র যদি কোন ছবিকে resize করতে চাই তবে কোড গুলো এমন একটি ছবি কে resize করতে চাইবে যে তখনও লোড হয় নি।
যেক্যুয়েরী এর document ready ইভেন্ট এর জন্য jQuery.com একটি সংক্ষিপ্ত নিয়ম তৈরি করেছে। নিচে এর সংক্ষিপ্ত নিয়মের উদাহরণ দেখুন।
$(function(){ // jQuery methods go here... });
শেয়ার করুন
