somewhere in... blog
x
ফোনেটিক ইউনিজয় বিজয়

আসুন jQuery শিখি

০৫ ই জুন, ২০১১ রাত ৮:০৯
এই পোস্টটি শেয়ার করতে চাইলে :

jQuery কি ?

jQuery হচ্ছে, javaScript er একটা Library. jQuery এর slogan হচ্ছে, “ write less, do more”.
আজকাল ওয়েবসাইট গুলা দেখতে অনেক সুন্দর এবং ব্যাবহারও বন্ধুসুলভ এবং এইসব সাইট এর ৯০% ই jQuery এর অবদান।
আগে যে কাজটা করতে ডেভলপার দের হাজার লাইন কোড লিখতে হতো এখন jQuery এক লাইন কোড ই যথেষ্ট।
আগে থেকে যা জানতে হবেঃ
১। HTML http://www.w3schools.com/html/default.asp
২। css http://www.w3schools.com/css/default.asp
৩। javaScript http://www.w3schools.com/js/default.asp
HTML, javaScript এবং css খুব ই সহজ জিনিস। উপরের লিংক গুলা মন দিয়ে পড়লে, একদিনেই শেষ করা সম্ভব।
তার পড়েও যাদের on the fly শেখার অভ্যাস, তারা ইতস্তত না করে comment এ জিজ্ঞাসা করতে পারেন।


পর্ব-১ - শুরু থেকে শুরু

Download jQuery library: http://code.jquery.com/jquery-1.6.1.min.js
একটা folder খুলেন, নাম দেন ndh-tutorial-part-1
ndh-tutorial-part-1 Folder এর ভিতর jquery-1.6.1.min.js ফাইলটা কপি করেন।
ndh-tutorial-part-1 Folder এর ভিতর নতুন একটা html file খুলেন, নাম দেন part-1.html
নিচের code copy করে part-1.html file এ paste করেন। এবং ফাইল সেভ করেন।





$(document).ready(function(){

$("p").click(function(){
$(this).hide();
});

});




If you click on me, I will disappear.



এখন part-1.html ফাইলটা কোন একটা ব্রাউজার দিয়া ওপেন করেন।
একটা লেখা পাবেন “If you click on me, I will disappear.”
এটার উপর ক্লিক করেন আর মজা দেখেন।
লেখাটা গায়েব হয়ে যাবে।
পুরা জিনিসটা এক সাথে ডাউনলোড করতে পারেন এইখান থেকে :
http://noscart.com/ndh-tutorial-part-1.zip


কোড এর ব্যাখ্যাঃ

ব্যাখ্যাগুলা একটু বরিং মনে হলেও ধৈর্য ধরে পড়েন please.

$(document).ready()- এই কথার মানে হচ্ছে, ব্রাউজার এ আপনার পেজ লোড পুরা complete হইলেই এর ভিতরের জিনিস গুলা execute হইব।
$("p").click(function(){
$(this).hide();
});
– এইখানে, $(p) দিয়া If you click on me, I will disappear. element টা select করছি।
$("p").click(function(){ - এইখানে বলছি, , element এর উপর ক্লিক হইলে function() call হইব।
Function(){ - এর মাঝে বলা হইছে,
$(this).hide(); - এর মানে হচ্ছে, এই জিনিসটা( মানে element) hide/ লুকায়া ফালাও।
এই $(this) নিয়া বিশাল গল্প আছে, কারো যদি interest থাকে, তাইলে ব্যাখ্যা করুম।


আরো কিছু উদাহরণঃ

$(this).hide()
নগদ HTML element কে গায়েব করা.
$("#test").hide()
এইচটিএমএল পেজে যতগুলো id="test" ওয়ালা জিনিস আছে সব গুলা গায়েব করা।
$(".test").hide()
এইচটিএমএল পেজে যতগুলো class="test" ওয়ালা জিনিস আছে সব গুলা গায়েব করা।


jQuery syntax:
$(".test"), $("#test") এইগুলো হচ্ছে, jQuery selector, এই বেপারে পরে বয়ান দিমু।
.hide(), হচ্ছে jQuery action
jQuery আসলে, এই selector আর action এরই খেলা।

theory দিয়া আর আপনাদের মুল্যবান সময় নষ্ট করবো না।

প্রতি পর্বে সহজ একটা উদাহরণ দিবো sample কোড সহ। তারপর কোড এর ব্যাখ্যা দিবো। আপনারা প্রশ্ন করবেন আমি উত্তর দিবো।
অবান্তর এবং যুগান্তর প্রশ্নের অপেক্ষাতে থাকলাম। সাড়া পেলে ২য় পর্ব এবং advance পর্ব লিখব। সবশেষে jQuery প্লাগইন ডেভেলপমেন্ট নিয়া লিখব।
১০টি মন্তব্য ৮টি উত্তর

আপনার মন্তব্য লিখুন

ছবি সংযুক্ত করতে এখানে ড্রাগ করে আনুন অথবা কম্পিউটারের নির্ধারিত স্থান থেকে সংযুক্ত করুন (সর্বোচ্চ ইমেজ সাইজঃ ১০ মেগাবাইট)
Shore O Shore A Hrosho I Dirgho I Hrosho U Dirgho U Ri E OI O OU Ka Kha Ga Gha Uma Cha Chha Ja Jha Yon To TTho Do Dho MurdhonNo TTo Tho DDo DDho No Po Fo Bo Vo Mo Ontoshto Zo Ro Lo Talobyo Sho Murdhonyo So Dontyo So Ho Zukto Kho Doye Bindu Ro Dhoye Bindu Ro Ontosthyo Yo Khondo Tto Uniswor Bisworgo Chondro Bindu A Kar E Kar O Kar Hrosho I Kar Dirgho I Kar Hrosho U Kar Dirgho U Kar Ou Kar Oi Kar Joiner Ro Fola Zo Fola Ref Ri Kar Hoshonto Doi Bo Dari SpaceBar
এই পোস্টটি শেয়ার করতে চাইলে :
আলোচিত ব্লগ

ভ্রমর কুয়াসার রাত....

লিখেছেন আহমেদ জী এস, ০৩ রা সেপ্টেম্বর, ২০১৫ সকাল ১১:২৫


ভ্রমর কুয়াসার রাত...

পাকুড় বৃক্ষের ডাল বেয়ে নেমে আসা করুন গিরগিটির মতোন কী ভয়ঙ্কর এক একটা রাত অবলীলাক্রমে হেটে আসে কাছে । ভ্রমর কুয়াসার সে রাত তার... ...বাকিটুকু পড়ুন

আমাদের জাফর স্যার আর এরশাদ কাকুর সাথে কোন পার্থক্য দেখছি না

লিখেছেন ব্লগ সার্চম্যান, ০৩ রা সেপ্টেম্বর, ২০১৫ সকাল ১১:৩২


কতো বিনোদন যে স্যার আপনি দেখাইলেন । আরো কত যে দেখাইবেন । স্যার আপনি ইউনিভার্সিটি বিশ্ববিদ্যালয় পড়ুয়া পুলাপাইন গুলারে পিচ্ছি পোলা এরা কিছুই বুঝেনা বললেন । আমার কাছে... ...বাকিটুকু পড়ুন

সোনালি ও অন্যান্য

লিখেছেন সোনাবীজ; অথবা ধুলোবালিছাই, ০৩ রা সেপ্টেম্বর, ২০১৫ সকাল ১১:৪৭

দূরবীক্ষণ

একটা নিহত দিনের সবটুকু মায়া মাটির আধারে গেঁথে রেখে
ক্ষয়িষ্ণু স্মৃতির বুকে লুটিয়ে পড়ে দিশেহারা চোখ;
ক্ষুব্ধবাক পিঁপড়ের রাশি চঞ্চলতা ভুলে গিয়ে খুবলে খায়
দুর্বৃত্ত ঘাস। একজোড়া সংসপ্তক কাক আচানক ডানা ভেঙে
মাটিতে... ...বাকিটুকু পড়ুন

গুলিস্থান না গোরোস্থান

লিখেছেন প্রামানিক, ০৩ রা সেপ্টেম্বর, ২০১৫ দুপুর ১২:৩৩


শহীদুল ইসলাম প্রামানিক

ওই বেটা কই যাস
যাবি নাকি রমনা
দশ টাকা ভাড়া দিমু
ভাড়া কিন্তু কম না?

অন্য কোথাও যামু না
সোজা যামু গুলিস্থান
পানিত নাইমা নাক ডুইবা
রিক্সা ধইরা দিছি টান।

ওই বেটা যাবি কেমনে
রিক্সাটাতো হইছে... ...বাকিটুকু পড়ুন

বিয়ের আগে শারীরিক সম্পর্কের কারণে যে সব সমস্যায় পরতে হয়..?

লিখেছেন মুহাম্মদ রেজাউল হাসান, ০৩ রা সেপ্টেম্বর, ২০১৫ দুপুর ১:৫০

বিয়ে এমন একটি সামাজিক বন্ধন, যা সামাজিক ও ধর্মীয়ভাবে শারীরিক সম্পর্কের অনুমতি দেয়। পাশ্চাত্যের দেশগুলো লিভ টুগেদার প্রথাটি ব্যাপকভাবে প্রচলিত। আমাদের দেশে আজকাল এ প্রথার উদাহরণ দেখা দিলেও তা সামাজিকভাবে... ...বাকিটুকু পড়ুন

নজরবন্দি বাজিকর

লিখেছেন জেন রসি, ০৩ রা সেপ্টেম্বর, ২০১৫ দুপুর ২:০৯



বিধাত্রীর নীলনকশায় নজরবন্দি বাজিকর
চাবুকের লাগামহীন যন্ত্রণা থেকে নিংড়ে
পাওয়া সুখের শেষ সমুদ্রঝড়ে খুন হবে
বলে জানু পেতে বসে আছে-আমরন!
মহাত্মা হৃদয় তবু বেওয়ারিশ লাশেই
অস্ত্রোপচার করে... ...বাকিটুকু পড়ুন