آموزش ویژگی scrollHeight در DOM جاوااسکریپت

سلام خدمت تمامی دوستان و همراهان محترم سایت آموزشی فری لرن ، امیدوارم که حال همگیتون خوب باشه. لطفا در ادامه با آموزش ویژگی scrollHeight در DOM جاوااسکریپت با من همراه باشید.

ویژگی scrollHeight در DOM جاوااسکریپت

Free-Learn

ویژگی scrollHeight در DOM جاوااسکریپت

با استفاده از ویژگی scrollHeight میتونیم اندازه کل ارتفاع ( ویژگی Height )  یک عنصر رو که شامل مقدار Padding می باشد رو بدست آوریم، و همچنین با استفاده از ویژگی scrollWidth میتونیم اندازه کل عرض ( ویژگی width ) یک عنصر را که شامل Padding می باشد، محاسبه نماییم.

  • نحوه محاسبه اندازه عرض عنصر برای scrollWidth :

Padding-Left + Padding-Right + Width = scrollWidth

  • نحوه محاسبه اندازه ارتفاع عنصر برای scrollHeight :

Padding-Top + Padding-Bottom + Height = scrollHeight

مقدار برگشتی یک عدد که نشان دهنده اندازه کل ارتفاع یک عنصر
بهمراه مقدار Padding می باشد

Free-Learn

مثال از این ویژگی

در ادامه میتوانید یک مثال از این ویژگی را در زبان جاوا اسکریپت مشاهده نمایید.

مثال شماره ۱ : در مثال زیر هم از ویژگی scrollWidth و هم scrollHeight استفاده شده ( برای بدست آوردن اندازه عرض و ارتفاع یک عنصر که شامل مقدار ویژگی Padding می باشد )

امتحان کنید

Free-Learn

پشتیبانی مرورگرها

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

نام ویژگی Chrome Firefox Opera Safari IE
scrollHeight بله ۲۱ ۱۰ ۳٫۱ ۸

Free-Learn

شکل نوشتاری

نحوه نوشتن یا استفاده یا سینتَکس (Syntax) این ویژگی در جاوااسکریپت بصورت زیر می باشد.


Free-Learn

نکات و توضیحات

  • این ویژگی یک ویژگی فقط خواندنی یا Read-Only می باشد.
  • این ویژگی فقط شامل اندازه Padding از سمت بالا و پایین ( برای scrollHeight ) و راست و چپ ( برای scrollWidth ) می باشد، و شامل ویژگی Margin یا ویژگی Border نمی باشد.
  • ویژگی scrollHeight مقدار اندازه ارتفاع ( Height ) یک عنصر رو بهمراه فقط مقدار ویژگی Padding برمیگردونه.
  • ویژگی scrollWidth مقدار اندازه عرض ( Width ) یک عنصر رو بهمراه فقط مقدار ویژگی Padding برمیگردونه.
  • ویژگی offsetHeight مقدار اندازه ارتفاع ( Height ) یک عنصر رو بهمراه مقدار ویژگی Padding و Border و اسکرول بار برمیگردونه.
  • ویژگی offsetWidth مقدار اندازه عرض ( Width ) یک عنصر رو بهمراه مقدار ویژگی Padding و Border و اسکرول بار برمیگردونه.

Free-Learn

دریافت PDF یا پرینت این مطلب