در جلسات قبلی مدل DOM در جاوا اسکریپت یاد گرفتیم. در این بخش از سری آموزش جاوا اسکریپت قصد داریم درباره شیء window صحبت کنیم.
شیء window
آبجکت window نشان دهنده یک پنجره (مرورگر) شامل سند DOM است. یک window می تواند پنجره اصلی مرورگر, یک frameset یا فریم جدا یا حتی یک پنجره جدید ساخته شده توسط جاوا اسکریپت.
اگر از جلسات قبلی به خاطر داشته باشید ما از متد alert() برای نمایش یک پیام پاپ-آپ استفاده کردیم. این متدی از آبجکت window است.
در چند جلسه بعدی تعدادی از متدها و خصوصیات شیء window را که به شما امکان دریافت اطلاعات از کاربر, تایید عملیات, باز کردن پنجره جدید در مرورگر و .. می دهد.
محاسبه عرض و ارتفاع پنجره مرورگر
شیء window خصوصیات innerWidth و innerHeight را برای پیدا کردن عرض و ارتفاع پنجره نمایش مرورگر که شامل اسکرول بار افقی و عمودی هم است(اگر رندر شده باشد.), استفاده می شود.
در مثال زیر اندازه فعلی پنجره مرورگر را با کلیک روی دکمه نمایش می دهد:
|
1 2 3 4 5 6 7 8 9 |
<script> function windowSize(){ var w = window.innerWidth; var h = window.innerHeight; alert("Width: " + w + ", " + "Height: " + h); } </script> <button type="button" onclick="windowSize();">Get Window Size</button> |
به هر حال, اگر قصد پیدا کردن انداره پنجره به همراه اسکرول بارها را دارید میتونید از clientWidth و clientHeight روی هر المان DOM مثل div استفاده کنید:
|
1 2 3 4 5 6 7 8 9 |
<script> function windowSize(){ var w = document.documentElement.clientWidth; var h = document.documentElement.clientHeight; alert("Width: " + w + ", " + "Height: " + h); } </script> <button type="button" onclick="windowSize();">Get Window Size</button> |
نکته: شیء document.documentElement نشان دهنده عنصر ریشه سند است که همان <html> است در حلی که document.body نشان دهنده عنصر <body> است.
امیدوارم از آموزش شیء window در جاوا اسکریپت (مدل BOM) نهایت استفاده را برده باشید.
هر سوالی داشتید ، از قسمت نظرات ارسال کنید . سریعا ، پاسخگوی سوالات شما هستیم .
موفق باشید.
