জে-কোয়েরী সিনট্যাক্স(jQuery Syntax) :

jQuery syntax দ্বরা html উপাদান(element) কে select করা হয় এবং ঐ উপাদান গুলির(elements) উপর কিছু কার্য(action) সম্পাদন করা হয়। jQuery কে প্রকাশের জন্য নিম্নের প্রতীক গুলি ব্যবহার করা হয়। যেমন: jQuery, window.jQuery, $( dollar sign), window.jQuery.$ । তবে আমরা $ প্রতীকটি বেশী ব্যবহার করবো, কারন $ প্রতীকটি সবচেয়ে ছোট এবং সহজ।

jQuery লেখার Basic syntax : $(selector).action()

এখানে,

• Dollar ($) প্রতীক jQuery কে নির্দেশ করে।
• selector html উপাদান কে খোঁজার(search) জন্য ব্যবহার করা হয়।
• এবং html উপাদানের উপর যে কার্য সম্পন্ন হবে তা action() মধ্যে থাকবে।

উদাহরণ :

1. $(this).hide() – বর্তমান উপাদানটি অদৃশ্য হবে (hides current element)।
2. $("p").hide() – সকল paragraph অদৃশ্য হবে (hides all paragraphs)।
3. $("p.test").hide() – যে সকল paragraph এর class="test", সেগুলি অদৃশ্য হবে (hides all paragraphs with class="test")।
4. $("#test").hide() - যে সকল elements এর id="test", সেগুলি অদৃশ্য হবে (hides the element with id="test")।

Javascript/jQuery Best Practices :

Rule #1: Javascript এর event inline attribute হিসেবে ব্যবহার করা ঠিক নয়।

Bad markup:

Good markup:

Rule #2 : সব সময় Javascript এর উপর নির্ভর করা উচিত নয়।

Bad markup:

var now = new Date();
if(now.getHours() < 12)
	document.write('Good Morning!');
else
	document.write('Good Afternoon!');

]]>

Good markup:

Rule #3: প্রত্যেক Markup এর মধ্যে JavaScript function call করা ঠিক নয়। root Markup এ id দিয়ে তার নিচের সবগুলি detect করা উচিত।

Bad markup:

    
First Option
    
First option description
    
Second Option
    
Second option description

Good markup:

Good Morning!

    
First Option
    
First option description
    
Second Option
    
Second option description

Rule #4: Hello World! Why $(document).ready() is SO cool[পরবর্তীতে এ নিয়ে বিস্তারিত অলোচনা করা হবে।]

Bad markup:

Good markup:

$(document).ready(function()
{
	alert('Hello World');
});

Rule #5: Dynamic CSS Rule তৈরি করা।

Bad markup:

HTML:

This is a heading

This is some information about the heading.

CSS:

p.hide-me-first
{
	display: none;
}

Good markup:

HTML:

This is a heading

This is some information about the heading.

jQuery/Javascript:

$(document).ready(function(){
	jQuery.cssRule("p.hide-me-first", "display", "none");
});

লেখকঃ ঢাকা প্রকৌশল ও প্রযুক্তি বিশ্ববিদ্যায়ের(DUET) কম্পিউটার সায়েন্স এ্যান্ড ইঞ্জিনিয়ারিং(CSE) বিভাগের ৪র্থ বর্ষের এক জন ছাত্র। তিনি ওয়েব ডিজাইন, ওয়েব ডেভলপমেন্ট এর বিভিন্ন বিষয় যেমন : এইচটিএমএল, সিএসএস, জাভাস্ক্রিপ্ট, জে কোয়েরি, পিএইচপি, .Net ইত্যাদি বিষয়ের উপর অভিজ্ঞ। তিনি ACM ICPC সহ বিভিন্ন আন্তর্জাতিক প্রোগ্রামিং প্রতিযোগীতায় অংশগ্রহন করেছেন। তাকে ফেসবুকে অনুসরন করতে এখানে ক্লিক করুন।