آموزش ویژگی clientTop در DOM جاوااسکریپت
سلام خدمت تمامی دوستان و همراهان محترم سایت آموزشی فری لرن ، امیدوارم که حال همگیتون خوب باشه. لطفا در ادامه با آموزش ویژگی clientTop در DOM جاوااسکریپت با من همراه باشید.
Free-Learn
آنچه در این جلسه میخوانید :
ویژگی clientTop در DOM جاوااسکریپت
با استفاده از ویژگی clientLeft میتونیم اندازه بوردِر یا Border یا حاشیه سمت چپ ( Left ) یک عنصر رو بدست بیاوریم، و همچنین با استفاده از ویژگی clientTop میتونیم اندازه بوردِر یا Border یا حاشیه سمت بالا ( Top ) یک عنصر رو بدست بیاوریم.
| مقدار برگشتی | یک عدد که نشان دهنده اندازه ویژگی Border از سمت بالا یک عنصر می باشد |
|---|
Free-Learn
مثال از این ویژگی
در ادامه میتوانید یک مثال از این ویژگی را در زبان جاوا اسکریپت مشاهده نمایید.
مثال شماره ۱ : در مثال زیر هم از ویژگی clientLeft و هم clientTop استفاده شده ( clientLeft برای بدست آوردن اندازه اندازه Border جهت چپ و clientTop برای بدست آوردن اندازه Border جهت بالا )
|
1 2 3 4 5 6 7 8 9 10 11 |
<script> function get_border() { var mybox , result , myborder; mybox = document.getElementById("MyDiv"); result = document.getElementById("Result"); myborder = "اندازه بوردر بالا = " + mybox.clientTop + "px" + "<br>" + "اندازه بوردر چپ = " + mybox.clientLeft + "px"; result.innerHTML = myborder; } </script> |
Free-Learn
پشتیبانی مرورگرها
در جدول زیر میتوانید مشاهده نمایید که آیا مرورگرهای اینترنتی از این ویژگی در جاوااسکریپت پشتیبانی میکنند یا خیر.
| نام ویژگی | Chrome | Firefox | Opera | Safari | IE |
| clientTop | بله | بله | بله | بله | بله |
Free-Learn
شکل نوشتاری
نحوه نوشتن یا استفاده یا سینتَکس (Syntax) این ویژگی در جاوااسکریپت بصورت زیر می باشد.
|
1 |
Element.clientTop; |
Free-Learn
نکات و توضیحات
- ویژگی clientLeft مقدار اندازه بوردر ( Border ) سمت / چپ بالارو برمیگردونه.
- برای بدست آوردن اندازه ارتفاع ( Height ) یک عنصر + مقدار Padding باید از ویژگی clientHeight استفاده کرد.
- برای بدست آوردن اندازه عرض ( Width ) یک عنصر + مقدار Padding باید از ویژگی clientWidth استفاده کرد.
