গত সপ্তাহে, আমি যে কোনও আধুনিক ওয়েব ডেভেলপারের জন্য jQuery কতটা গুরুত্বপূর্ণ এবং কেন এটি দুর্দান্ত তা নিয়ে কথা বলেছি। এই সপ্তাহে, আমি মনে করি এখন সময় এসেছে যে আমরা কিছু কোড দিয়ে আমাদের হাত নোংরা করে ফেললাম এবং কীভাবে আমাদের প্রকল্পগুলিতে jQuery ব্যবহার করতে হয় তা শিখেছি।

আমি এখনই বলব - jQuery ব্যবহার করার জন্য আপনাকে জাভাস্ক্রিপ্ট শিখতে হবে না। এটি সম্ভবত সবচেয়ে ভাল যদি আপনি jQuery কে জাভাস্ক্রিপ্টের বিবর্তন হিসাবে মনে করেন - এটি করার একটি ভাল উপায় - কেবল একটি লাইব্রেরির চেয়ে যা কার্যকারিতা যোগ করে। আপনার যে কোনও জাভাস্ক্রিপ্ট পথের মধ্যে তুলে নেওয়া হবে। তবে ধরে নেওয়া হয় যে একজন ওয়েব ডেভেলপার হিসাবে আপনার HTML এবং CSS সম্পর্কে বেশ ভাল জ্ঞান আছে (এবং যদি না হয় সহায়ক বিনামূল্যে xHTML নির্দেশিকা!)।

ডকুমেন্ট অবজেক্ট মডেল

jQuery হল ট্র্যাভারসাল এবং এর হেরফের সম্পর্কে বিচার - দ্য ডি নথি অথবা বাজে এম গন্ধ DOM হল পৃষ্ঠার একটি শ্রেণীবিন্যাস বৃক্ষ উপস্থাপনা, যা সকল HTML কোড পড়ার পর ব্রাউজার দ্বারা নির্মিত। JQuery এ, আমরা যেমন পরিভাষা ব্যবহার করব পিতামাতা , শিশু , এবং ভাইবোন প্রায়শই, তাই DOM এর সাথে এর অর্থ কী তা সম্পর্কে আপনার ধারণা থাকা উচিত।

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

jQuery code codes here`

$ ('নির্বাচক')।পদ্ধতি();

শিরোনামে এটিই আছে। এটি DOM কে হেরফের করার জন্য jQuery কোডের একক টুকরাটির মৌলিক কাঠামো। সহজ, তাই না?

দ্যনির্বাচকjQuery কে এই নিয়মের সাথে মেলে এমন জিনিস খুঁজে পেতে বলে, এবং সিএসএস নির্বাচকদের মতো (এবং তারপরে আরও কিছু)। সুতরাং, ঠিক যেমন CSS এ আপনি সমস্ত লিঙ্কগুলি স্টাইল করবেন

a { }

একই হিসাবে jQuery এ করা হবে

$('a')

এটি যেকোন HTML উপাদানগুলির জন্য করা যেতে পারে - div, h1, span - যাই হোক না কেন। আপনি আরো সুনির্দিষ্ট হতে CSS ক্লাস এবং আইডি ব্যবহার করতে পারেন।

উদাহরণস্বরূপ, ক্লাস 'findme' এর সাথে সমস্ত লিঙ্ক খুঁজে পেতে, আপনি ব্যবহার করবেন:

$('a.findme')

আপনার প্রতিবার উপাদানটির ধরন নির্দিষ্ট করার দরকার নেই - তবে আপনি যদি তা করেন তবে এটি কেবল নিয়মটিকে আরও নির্দিষ্ট করে তোলে। আপনি শুধু বলতে পারতেন

$('.findme')

যা ক্লাসের সাথে সবকিছু মিলে যাবে আমাকে খুজে বের কর , এটি একটি লিঙ্ক ছিল কিনা।

একটি নামযুক্ত আইডি উপাদান ব্যবহার করতে, ব্যবহার করুন # পরিবর্তে স্বাক্ষর করুন। এখানে মূল পার্থক্য হল যে একটি আইডি নির্বাচক শুধুমাত্র একটি বস্তু নির্বাচন করবে, যখন একটি শ্রেণী নির্বাচক একাধিক খুঁজে পেতে পারে।

এই যন্ত্রটি এই যন্ত্র দ্বারা সমর্থিত নয়

$('#something')

মূলত যদি আপনি CSS এ করতে পারেন তবে jQuery এটিও করবে। আসলে, আপনি কিছু মোটামুটি জটিল CSS3 স্টাইলের ছদ্ম নির্বাচকদের পছন্দ করতে পারেন: প্রথম

$('body p:first')

যা পৃষ্ঠার অনুচ্ছেদ দখল করবে। আপনি কিছু বৈশিষ্ট্যের উপাদানও খুঁজে পান। এই উদাহরণ বিবেচনা করুন; আমরা পৃষ্ঠায় সমস্ত লিঙ্ক খুঁজে পেতে চাই যা অভ্যন্তরীণভাবে নির্দেশ করে ব্যবহার করা এবং সেগুলোকে কোনোভাবে হাইলাইট করুন। এখানে আমরা কিভাবে তাদের খুঁজে পেতে পারি:

$('a[href*='makeuseof']')

এটা কি শান্ত না? ভাল, আমি মনে করি এটা।

আপনার পরবর্তী কল পোর্ট হতে হবে নির্বাচকদের জন্য jQuery API ডকুমেন্টেশন । এটি বিভিন্ন ধরণের নির্বাচকদের ব্যবহারের জন্য একটি বিশাল তালিকা, এবং কেউই আশা করবে না যে আপনি সেগুলি শিখবেন।

সমীকরণের পরবর্তী অংশ হলপদ্ধতি- একবার আপনি সেগুলি খুঁজে পেলে সেই জিনিসগুলির সাথে কী করবেন - তবে আমরা পরবর্তী পাঠের জন্য এটি ছেড়ে দেব। আপনি যদি এখন বিভিন্ন নির্বাচকদের চেষ্টা করে শুরু করতে চান তবে আমি আপনাকে নিম্নলিখিত CSS পদ্ধতিতে থাকার পরামর্শ দিচ্ছি। এটি দুটি পরামিতি নেয় - একটি CSS সম্পত্তির নাম , এবং একটি নতুন মান সেই সম্পত্তি বরাদ্দ করতে। সুতরাং, সমস্ত লিঙ্কগুলিকে একটি লাল পটভূমি রঙ দিতে, আপনি করবেন:

$('a').css('background-color','red');

যথেষ্ট সহজ! যদিও এটি কোনও ব্যবহারিক ব্যবহার নাও হতে পারে, এটি আপনাকে আপনার নির্বাচকদের ব্যবহার করে যে কোনও উপাদান সহজেই দেখতে দেবে। এখন এগিয়ে যান, এবং নির্বাচন করুন - DOM আপনার জন্য অপেক্ষা করছে।

আমি আশা করি এই টিউটোরিয়াল আপনার জন্য দরকারী হয়েছে; আমি এটাকে যতটা সম্ভব সহজ করে বোঝার চেষ্টা করেছি। আপনার যে কোন প্রশ্ন করতে বিনা দ্বিধায় বা মতামত দিন, কিন্তু সচেতন থাকুন যে আমি অবশ্যই কোন অভিজাত jQuery নিনজা নই।

শেয়ার করুন শেয়ার করুন টুইট ইমেইল আপনার ভার্চুয়ালবক্স লিনাক্স মেশিনগুলিকে সুপারচার্জ করার ৫ টি টিপস

ভার্চুয়াল মেশিন দ্বারা দেওয়া খারাপ পারফরম্যান্সে ক্লান্ত? আপনার ভার্চুয়ালবক্সের কর্মক্ষমতা বাড়ানোর জন্য আপনার যা করা উচিত তা এখানে।

পরবর্তী পড়ুন সম্পর্কিত বিষয়

ওয়েব সংস্কৃতি
ওয়েব ডেভেলপমেন্ট
জাভাস্ক্রিপ্ট
প্রোগ্রামিং
jQuery

লেখক সম্পর্কে জেমস ব্রুস(707 নিবন্ধ প্রকাশিত)

জেমসের কৃত্রিম বুদ্ধিমত্তায় একটি বিএসসি আছে এবং এটি CompTIA A+ এবং Network+ প্রত্যয়িত। যখন তিনি হার্ডওয়্যার রিভিউ এডিটর হিসেবে ব্যস্ত থাকেন না, তখন তিনি লেগো, ভিআর এবং বোর্ড গেম উপভোগ করেন। মেক ইউসঅফে যোগদানের আগে তিনি ছিলেন একজন আলো প্রযুক্তিবিদ, ইংরেজি শিক্ষক এবং ডেটা সেন্টার ইঞ্জিনিয়ার।

জেমস ব্রুস থেকে আরো

আমাদের নিউজলেটার সদস্যতা

প্রযুক্তি টিপস, রিভিউ, ফ্রি ইবুক এবং এক্সক্লুসিভ ডিলের জন্য আমাদের নিউজলেটারে যোগ দিন!

সাবস্ক্রাইব করতে এখানে ক্লিক করুন