پنجره جاوااسکریپت

مهم است که بدانید JavaScript چگونه با مرورگرها ارتباط برقرار می کند. برای برقراری ارتباط با مرورگر ، JavaScript از مدل شی browser مرورگر (BOM) استفاده می کند. با اجزای مرورگر (تاریخچه ، مکان ، ناوبری و صفحه نمایش) سروکار دارد. سند ویژگی BOM است.

در این آموزش ، شما همه چیز را در مورد پنجره جاوااسکریپت یاد خواهید گرفت ، ایده بهتری از آنچه در آن است و نحوه کار با آن دریافت خواهید کرد. با روش های آن و نحوه استفاده از آنها آشنا خواهید شد.

نکات اصلی پنجره جاوااسکریپت:

• Browser Object Model (BOM) به JavaScript کمک می کند تا با مرورگر ارتباط برقرار کند.
• با استفاده از روش ها و خصوصیات یک پنجره JavaScript ، می توانید یک پنجره خاص را اصلاح کرده و اطلاعات مربوط به آن را بدست آورید.

شی پنجره

همه مرورگرها از پنجره شی که JavaScript استفاده می کند پشتیبانی می کنند. این پنجره مرورگر را تعریف می کند. اشیا ، توابع و متغیرهای جاوا اسکریپت جهانی به طور خودکار بخشی از شی window پنجره می شوند.

همه متغیرهای جهانی خصوصیات شی پنجره هستند و همه توابع جهانی روش های آن هستند. کل سند HTML نیز یک ویژگی پنجره است.

در مثال زیر ، می توانید ببینید که چگونه شی document سند (که متعلق به HTML DOM است) در خاصیت شی object پنجره قرار دارد. در اینجا متن اصلی سند را انتخاب می کنیم:

window.document.getElementById("body");

این مثال بعدی دقیقاً همان کار را انجام می دهد. با این حال ، برای نشان دادن اینکه پنجره برای کارکرد لازم نیست ، استفاده می شود:

document.getElementById("body");

BOM در مقابل DOM

برای یک مبتدی آسان است که در میان اصطلاحات مختلف گیج و گم شود ، خصوصاً اصطلاحاتی که شباهت زیادی به هم دارند. بنابراین ، ما فکر کردیم که باید یک بار دیگر روشن کنیم که تفاوت اصلی بین BOM و DOM چیست.

BOM (مدل شی مرورگر) به JavaScript اجازه می دهد تا با مرورگر و اجزای آن مانند تاریخچه ، مکان ، ناوبری ، صفحه و سند ارتباط برقرار کند.

DOM (مدل شی document سند) در واقع سند را نشان می دهد: همه عناصر HTML ، رویدادها و … بنابراین ، DOM بخشی از BOM است.

دریافت اندازه پنجره

از ویژگی های ارتفاع و عرض می توان برای بازگرداندن اندازه پنجره مرورگر استفاده کرد. هر دو ویژگی اندازه را بر حسب پیکسل برمی گردانند:

• windows.innerHeight ارتفاع پنجره مرورگر را برمی گرداند.
• window.innerWidth عرض پنجره مرورگر را برمی گرداند.

به خاطر داشته باشید که ما از ویژگی های مختلفی برای Internet Explorer 8 و نسخه های قدیمی تر استفاده می کنیم:

• document.documentElement.clientHeight
• document.documentElement.clientWidth

یا

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

مثال زیر یک کد جهانی را نشان می دهد که در هر مرورگری کار می کند:

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

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

توجه: ویژگی پنجره طول و عرض پنجره مرورگر را به استثنای نوارابزار برمی گرداند.

روش های مرورگر

روش های دیگری نیز وجود دارد که می توانید برای اشیا JavaScript windows استفاده کنید:

• JavaScript window.open برای باز کردن یک پنجره جدید استفاده می شود.
• window.close برای جاوا اسکریپت بستن پنجره استفاده می شود.
• با استفاده از window.moveTo، می توانید پنجره فعلی را حرکت دهید.
• برای تغییر اندازه پنجره فعلی باید window.resizeTo را انتخاب کنید.

خلاصه پنجره جاوااسکریپت:

• جاوااسکریپت برای ارتباط با مرورگر از مدل شی مرورگر (BOM) استفاده می کند.
• BOM دارای روش ها و ویژگی های مختلفی است که هنگام کار با ویندوز مفید می شود. به عنوان مثال ، JavaScript window.open برای باز کردن مورد جدید استفاده می شود.
• DOM بخشی از BOM است.