JavaScript Window - مدل فرانت‌اند مرورگر

مدل شیء مرورگر (Browser Object Model (BOM) به JavaScript اجازه می‌دهد تا با مرورگر صحبت کند.

مدل شیء مرورگر (Browser Object Model (BOM))

استاندارد رسمی برای مدل شیء مرورگر (BOM) وجود ندارد.

مرورگرهای مدرن (تقریباً) روش‌ها و خاصیت‌های مشابه تعامل JavaScript را پیاده‌سازی کرده‌اند، بنابراین اغلب روش‌ها و خاصیت‌های BOM به آن اشاره می‌کنند.

شیء Window

همه مرورگرها آن را پشتیبانی می‌کنند window شیء. این آن را به عنوان پنجره مرورگر نمایان می‌کند.

تمام شیء، توابع و متغیرهای جهانی JavaScript به طور خودکار اعضای شیء window هستند.

متغیرهای جهانی خاصیت‌های شیء window هستند.

توابع جهانی توابع شیء window هستند.

حتی (شیء HTML DOM) شیء document نیز یک خاصیت شیء window است:

window.document.getElementById("header");

برابر است با:

document.getElementById("header");

اندازه پنجره

این دو خاصیت می‌توانند برای تعیین اندازه پنجره مرورگر استفاده شوند.

این دو خاصیت به صورت پیکسل اندازه‌ها را برمی‌گردانند:

  • window.innerHeight - ارتفاع داخلی پنجره مرورگر (به پیکسل)
  • window.innerWidth - پهنای داخلی پنجره مرورگر (به پیکسل)

پنجره مرورگر (پنجره دید کاربر) شامل نوار ابزار و نوار прокسیل نیست.

برای اینترنت اکسپلورر 8، 7، 6، 5:

  • clientHeight
  • clientWidth

یا

  • document.body.clientHeight
  • document.body.clientWidth

یک راهکار عملی JavaScript (شامل تمام مرورگرها):

مثال

var w = window.innerWidth
|| document.documentElement.clientWidth
|| document.body.clientWidth;
var h = window.innerHeight
|| document.documentElement.clientHeight
|| document.body.clientHeight;

به طور مستقیم امتحان کنید

این مثال نمایش می‌دهد که高度的 و عرضیت پنجره مرورگر چیست: (منهای نوار ابزار و اسکرول‌بارها)

روش‌های دیگر جعبه‌های پنجره

روش‌های دیگر:

  • window.open() - باز کردن جعبه جدید
  • window.close() - بستن جعبه حالت فعلی
  • window.moveTo() - حرکت جعبه حالت فعلی
  • window.resizeTo() - باز کردن جعبه حالت فعلی