JavaScript Window – The Browser Object Model (BOM) | বাংলা টিউটোরিয়াল
JavaScript এর মাধ্যমে যখন আমরা ব্রাউজারকে নিয়ন্ত্রণ করতে চাই, তখন আমরা Browser Object Model (BOM) ব্যবহার করি। BOM এমন একটি কাঠামো যা আমাদের ব্রাউজারের বিভিন্ন ফিচারের সাথে কাজ করার সুযোগ দেয় — যেমন পপআপ তৈরি, ইউআরএল হ্যান্ডলিং, স্ক্রিন প্রপার্টিজ জানা ইত্যাদি। এর মূল ভিত্তি হলো window object, যা পুরো ব্রাউজারের রিপ্রেজেন্টেশন।
১. Window Object কী?
JavaScript কোডে আপনি যদি window না ও ব্যবহার করেন, তবুও আপনি আসলে window অবজেক্টের মাধ্যমেই কাজ করছেন। এটা পুরো ব্রাউজারের কন্টেক্সট রিপ্রেজেন্ট করে। যেমন:
// alert() = window.alert()
// location = window.location
// document = window.document
অর্থাৎ, আপনি যখন alert() লিখেন, তখন আসলে window.alert() কল করেন।
২. Window Object এর গুরুত্বপূর্ণ Properties ও Methods
| Property / Method | ব্যাখ্যা (বাংলায়) |
|---|---|
| window.alert() | একটি এলার্ট বক্স দেখায় |
| window.confirm() | OK/Cancel ডায়ালগ দেখায় |
| window.prompt() | ইউজারের কাছ থেকে ইনপুট নেয় |
| window.innerWidth / innerHeight | ভিউপোর্টের প্রস্থ ও উচ্চতা |
| window.location | বর্তমান URL এবং পাথ সম্পর্কিত তথ্য |
| window.open() | নতুন ব্রাউজার উইন্ডো/ট্যাব খোলে |
৩. উদাহরণসমূহ (Code + ব্যাখ্যা)
// এলার্ট বক্স দেখানো
window.alert("স্বাগতম! এটা একটি alert box।");
ব্যাখ্যা: উপরের কোডটি একটি এলার্ট ডায়ালগ দেখাবে যেটি window অবজেক্ট ব্যবহার করে।
// ইউজারের নাম ইনপুট নেওয়া
let name = window.prompt("আপনার নাম লিখুন:");
document.write("স্বাগতম, " + name + "!");
ব্যাখ্যা: prompt() ইউজারের কাছ থেকে ডেটা ইনপুট নেয় এবং সেটি ব্যবহার করে DOM-এ প্রিন্ট করে।
// ইউজারকে কনফার্ম করানো
let sure = confirm("আপনি কি সাইটটি ছাড়তে চান?");
if(sure) {
alert("সাইট ত্যাগ করা হলো!");
} else {
alert("ধন্যবাদ থাকায় জন্য!");
}
ব্যাখ্যা: confirm ডায়ালগ ইউজারকে দুটি অপশন দেয়: OK বা Cancel। এর ভিত্তিতে পরবর্তী পদক্ষেপ নেয়া হয়।
৪. location, screen এবং history
- location.href: সম্পূর্ণ URL দেয়
- location.reload(): পেজ রিলোড করে
- screen.width/height: ইউজারের স্ক্রিন সাইজ
- history.back(): ব্রাউজারে এক ধাপ পিছনে যায়
- history.forward(): সামনে যায়
সারসংক্ষেপ
Browser Object Model (BOM) হল সেই মাধ্যম যার মাধ্যমে আমরা JavaScript দিয়ে ব্রাউজারকে নিয়ন্ত্রণ করতে পারি। window অবজেক্ট BOM-এর কেন্দ্রবিন্দু এবং এর সাহায্যে আমরা পেজ রিলোড, স্ক্রিন সাইজ চেক, ইউজারের ইনপুট নেওয়া, URL পরিবর্তন ইত্যাদি কাজ করতে পারি।
এই বিষয়গুলো JavaScript দিয়ে প্রফেশনাল ও ইউজার-ফ্রেন্ডলি ইন্টারফেস তৈরি করার জন্য অপরিহার্য।