jQuery পরিচিতি ও ইনস্টলেশন

লেসন ৩৫ / ৪৪

jQuery কী?

jQuery হলো একটি জনপ্রিয় JavaScript লাইব্রেরি যা DOM manipulation, event handling, animation ও AJAX-কে অত্যন্ত সহজ করে তোলে।

🎯 Motto: "Write less, do more"

jQuery কেন ব্যবহার করবেন?

  • সহজ syntax — কম কোডে বেশি কাজ
  • Cross-browser compatible (পুরনো IE-তেও চলে)
  • বিশাল plugin ecosystem
  • AJAX অত্যন্ত সহজ
  • অনেক পুরনো WordPress/corporate সাইটে এখনো ব্যবহৃত

⚠️ আধুনিক পরিস্থিতি

আধুনিক browser-এ vanilla JavaScript অনেক শক্তিশালী। React/Vue/Angular এ jQuery লাগে না। তবুও অনেক legacy প্রজেক্টে jQuery থাকে, তাই জানা দরকার।

jQuery যুক্ত করা

১. CDN থেকে (সবচেয়ে সহজ)

<!DOCTYPE html>
<html>
<head>
    <script src="https://code.jquery.com/jquery-3.7.1.min.js"></script>
</head>
<body>
    <h1 id="title">Hello</h1>
    <script>
        $("#title").css("color", "red");
    </script>
</body>
</html>

২. Download করে

<script src="jquery-3.7.1.min.js"></script>

Document Ready

HTML লোড শেষ হওয়ার পর কোড চালাতে হয়।

// পুরনো syntax
$(document).ready(function() {
    console.log("DOM ready!");
});

// Shorthand (সবচেয়ে জনপ্রিয়)
$(function() {
    console.log("DOM ready!");
});

// Arrow function
$(() => {
    $("h1").css("color", "blue");
});

$ Sign ও jQuery

$ হলো jQuery-র alias — jQuery এর সংক্ষিপ্ত রূপ।

// দুটোই একই
$("#title")
jQuery("#title")

// Conflict থাকলে
jQuery.noConflict();
jQuery(function($) {
    $(".btn").click(function() { ... });
});

jQuery vs Vanilla JS

// Vanilla JavaScript
document.getElementById("btn").addEventListener("click", function() {
    document.querySelector(".box").style.display = "none";
});

// jQuery
$("#btn").click(function() {
    $(".box").hide();
});