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

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

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

Free-Learn

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

با استفاده از ویژگی offsetWidth میتونیم اندازه عرض ( ویژگی width ) قابل مشاهده ( یا در دسترس ) یک عنصر که شامل مقدار Padding و Border و اسکرول بار ( overflow ) می باشد رو بدست بیاوریم.

و همچنین با استفاده از ویژگی offsetHeight میتونیم اندازه ارتفاع ( ویژگی Height ) یک عنصر را که شامل Padding و Border و اسکرول بار می باشد، محاسبه نماییم.

منظور از اسکرول بار یعنی اون قسمتی از عنصر که اسکرول ایجاد میشه ، یعنی اندازه اون قسمت هم محاسبه میشه.

این ویژگی فقط شامل اندازه Padding و Border و اسکرول می باشد، شامل Margin نمی باشد.

مقدار برگشتی یک عدد که نشان دهنده اندازه کل عرض یک عنصر
بهمراه مقدار Padding و Border و اسکرول بار می باشد

Free-Learn

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

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

مثال شماره ۱ : در مثال زیر هم از ویژگی offsetHeight و هم offsetWidth استفاده شده.

امتحان کنید

Free-Learn

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

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

نام ویژگی Chrome Firefox Opera Safari IE
offsetWidth بله بله بله بله بله

Free-Learn

شکل نوشتاری

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


Free-Learn

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

  • ویژگی offsetHeight مقدار اندازه ارتفاع ( Height ) یک عنصر رو بهمراه مقدار ویژگی Padding و Border و اسکرول بار برمیگردونه.
  • ویژگی offsetWidth مقدار اندازه عرض ( Width ) یک عنصر رو بهمراه مقدار ویژگی Padding و Border و اسکرول بار برمیگردونه.
  • ویژگی clientHeight مقدار اندازه ارتفاع ( Height ) یک عنصر رو بهمراه مقدار فقط ویژگی Padding برمیگردونه.
  • ویژگی clientWidth مقدار اندازه عرض ( Width ) یک عنصر رو بهمراه مقدار فقط ویژگی Padding برمیگردونه.

Free-Learn

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