نافذة لغة جافا سكريبت - نموذج المتصفح

مفهوم Browser Object Model (Browser Object Model (BOM) يسمح لـ JavaScript بالتفاعل مع المتصفح.

مفهوم Browser Object Model (BOM)

لا يوجد معيار رسمي لمفهوم Browser Object Model (BOM).

المتصفحات الحديثة قد قامت (تقريبًا) بتحقيق نفس الطرق والخصائص لتفاعل JavaScript، لذا يتم ذكرها غالبًا كطرق وخصائص BOM.

مفهوم Window

كل المتصفحات يدعمونها window الجسم. إنه يمثل نافذة المتصفح.

جميع الأجرأء العالمية، الوظائف والمتغيرات تصبح أعضاء في خاصية window تلقائيًا.

المتغيرات العالمية هي خصائص خاصية window.

الوظائف العالمية هي طرق خاصية window.

حتى (مثل HTML DOM) هو خاصية من خاصية window:

window.document.getElementById("header");

يساوي:

document.getElementById("header");

حجم النافذة

يمكن استخدام هذه الخصائص لتحديد حجم نافذة المتصفح.

هذه الخصائص تعود بمقاسات بالبكسل:

  • window.innerHeight - طول نافذة المتصفح الداخلية (بالبكسل)
  • window.innerWidth - عرض نافذة المتصفح الداخلية (بالبكسل)

نافذة المتصفح (نافذة عرض المتصفح) لا تشمل شريط الأدوات وخطوط التمرير.

لـ Internet Explorer 8, 7, 6, 5:

  • document.documentElement.clientHeight
  • document.documentElement.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() - تعديل حجم النافذة الحالية