OffsetTop
يحصل على الموضع العلوي المحسوب للكائن بالنسبة إلى التخطيط أو الإحداثيات الأصلية المحددة بواسطة خاصية OffsetParent.
OffsetLeft
يحصل على الموضع الأيسر المحسوب للكائن بالنسبة إلى التخطيط أو الإحداثيات الأصلية المحددة بواسطة خاصية offsetParent.
OffsetHeight
الحصول على ارتفاع الكائن بالنسبة إلى التخطيط أو الإحداثي الأصل المحدد بواسطة خاصية OffsetParent.
يعتقد IE وOpera أن offsetHeight = clientHeight + شريط التمرير + الحدود.
يعتبر NS وFF أن offsetHeight هو الارتفاع الفعلي لمحتوى صفحة الويب، والذي يمكن أن يكون أصغر من ClientHeight.
OffsetWidth
الحصول على عرض الكائن بالنسبة إلى التخطيط أو الإحداثي الأصل المحدد بواسطة خاصية OffsetParent.
OffsetParent
الحصول على مرجع لكائن الحاوية الذي يحدد خصائص OffsetTop وoffsetLeft للكائن.
ClientHeight
الحصول على ارتفاع كائن، دون حساب أي هوامش أو حدود أو أشرطة تمرير أو مساحة متروكة قد يتم تطبيقها على الكائن.
ليس لدى الجميع أي اعتراض على ClientHeight، فهم جميعًا يعتقدون أنه ارتفاع المنطقة المرئية من المحتوى، أي ارتفاع المنطقة التي يمكن رؤية المحتوى فيها في متصفح الصفحة هي المنطقة الموجودة أسفل شريط الأدوات الأخير وفوق شريط الحالة، ولا علاقة لها بمحتوى الصفحة.
clientLeft
الحصول على المسافة بين خاصية OffsetLeft والجانب الأيسر الفعلي لمنطقة العميل.
clientTop
الحصول على المسافة بين خاصية OffsetTop والجزء العلوي الفعلي لمنطقة العميل.
عرض العميل
الحصول على عرض الكائن، دون حساب أي هوامش أو حدود أو أشرطة تمرير أو مساحة يمكن تطبيقها على الكائن.
سمة التمرير
انتقل
يضبط أو يحصل على ما إذا كان التمرير متوقفًا أم لا.
التمرير الارتفاع
احصل على ارتفاع التمرير للكائن.
التمرير لليسار
يضبط المسافة بين الحافة اليسرى للكائن والحافة اليسرى للمحتوى المرئي حاليًا في النافذة أو يحصل عليها.
ScrollTop
يضبط المسافة بين أعلى الكائن وأعلى المحتوى المرئي في النافذة أو يحصل عليها.
عرض التمرير
يحصل على عرض التمرير للكائن. سمة الحدث
س
يضبط أو يحصل على إحداثيات x-pixel لموضع مؤشر الماوس بالنسبة للمستند الأصلي.
ScreenX
يضبط أو يحصل على إحداثيات x لموضع مؤشر الماوس بالنسبة لشاشة المستخدم
إزاحةX
يضبط أو يحصل على إحداثي x لموضع مؤشر الماوس بالنسبة للكائن الذي أطلق الحدث.
ClientX
يضبط أو يحصل على إحداثي x لموضع مؤشر الماوس بالنسبة إلى منطقة العميل في النافذة، حيث لا تتضمن منطقة العميل عناصر التحكم وأشرطة التمرير الخاصة بالنافذة.
نتحدث هنا عن تفسير ClientHeight وoffsetHeight وscrollHeight لـ document.body بواسطة أربعة متصفحات. هذا هو document.body، إذا كان عنصر تحكم HTML، فهو مختلف.
هذه المتصفحات الأربعة هي IE (Internet Explorer)، وNS (Netscape)، وOpera، وFF (FireFox).
ClientHeight
ليس لدى الجميع أي اعتراض على ClientHeight، فهم جميعًا يعتقدون أنه ارتفاع المنطقة المرئية من المحتوى، أي ارتفاع المنطقة التي يمكن رؤية المحتوى فيها في متصفح الصفحة هي المنطقة الموجودة أسفل شريط الأدوات الأخير وفوق شريط الحالة، ولا علاقة لها بمحتوى الصفحة.
OffsetHeight
يعتقد IE وOpera أن offsetHeight = clientHeight + شريط التمرير + الحدود. يعتبر NS وFF أن offsetHeight هو الارتفاع الفعلي لمحتوى صفحة الويب، والذي يمكن أن يكون أصغر من ClientHeight.
التمرير الارتفاع
يعتبر IE وOpera أن ارتفاع التمرير هو الارتفاع الفعلي لمحتوى صفحة الويب، والذي يمكن أن يكون أصغر من ارتفاع العميل. يعتبر NS وFF أنscrollHeight هو ارتفاع محتوى صفحة الويب، ولكن الحد الأدنى للقيمة هوclientHeight. ببساطة
ClientHeight هو ارتفاع المنطقة التي يتم عرض المحتوى فيها من خلال المتصفح.
يعتقد NS وFF أن offsetHeight وscrollHeight كلاهما ارتفاعات محتوى الويب، ولكن عندما يكون ارتفاع محتوى الويب أقل من أو يساوي ClientHeight، فإن قيمة التمرير هي ClientHeight، ويمكن أن تكون OffsetHeight أقل من ClientHeight.
يعتبر IE وOpera أن offsetHeight هو شريط التمرير ClientHeight للمنطقة المرئية بالإضافة إلى الحدود. التمرير هو الارتفاع الفعلي لمحتوى صفحة الويب.
نفس السبب
تفسيرات ClientWidth وoffsetWidth وscrollWidth هي نفسها المذكورة أعلاه، فقط استبدل الارتفاع بالعرض.
لكن
يفسر FF ClientHeight بشكل مختلف في DOCTYPEs المختلفة، لكن xhtml 1 trasitional لا يفسره على النحو الوارد أعلاه. المتصفحات الأخرى ليس لديها هذه المشكلة.
يحصل Js على ارتفاع الصفحة
انسخ رمز الكود كما يلي:
<النص البرمجي>
وظيفة الحصول على المعلومات ()
{
فارس = "";
s += "عرض المنطقة المرئية لصفحة الويب:"+ document.body.clientWidth;
s += "ارتفاع المنطقة المرئية لصفحة الويب:"+ document.body.clientHeight;
s += "عرض المنطقة المرئية لصفحة الويب: "+ document.body.offsetWidth + " (بما في ذلك عرض الحواف وأشرطة التمرير)";
s += "ارتفاع المنطقة المرئية لصفحة الويب: "+ document.body.offsetHeight + " (بما في ذلك عرض الحافة)";
s += "عرض النص الكامل لنص صفحة الويب:"+ document.body.scrollWidth;
s += "ارتفاع النص الكامل لنص صفحة الويب:"+ document.body.scrollHeight;
s += "الارتفاع الذي تم تمرير صفحة الويب إليه (ff):"+ document.body.scrollTop;
s += "الارتفاع الذي تم تمرير صفحة الويب إليه (على سبيل المثال):"+ document.documentElement.scrollTop;
s += "تم تمرير الجانب الأيسر من صفحة الويب:"+ document.body.scrollLeft;
s += "في النص الرئيسي لصفحة الويب: "+ window.screenTop;
s += "يسار جزء النص من صفحة الويب:"+ window.screenLeft;
s += "ارتفاع دقة الشاشة:"+ window.screen.height;
s += "عرض دقة الشاشة:"+ window.screen.width;
s += "ارتفاع منطقة العمل المتوفرة على الشاشة:"+ window.screen.availHeight;
s += "عرض منطقة العمل المتوفرة على الشاشة:"+ window.screen.availWidth;
s += "إعدادات الشاشة هي "+ window.screen.colorDepth +" لون البت";
s += "إعدادات الشاشة" + window.screen.deviceXDPI +" بكسل/بوصة"؛
//تنبيه (تنبيه) ؛
}
getInfo();
</script>
في اختباري المحلي:
يمكن استخدامها تحت IE، فايرفوكس، أوبرا
document.body.clientWidth
document.body.clientHeight
إنه متاح وبسيط ومريح.
ومن مشاريع الشركة:
الأوبرا لا تزال تستخدم
document.body.clientWidth
document.body.clientHeight
ولكن استخدام IE وفايرفوكس
document.documentElement.clientWidth
document.documentElement.clientHeight
اتضح أن معايير W3C تسبب المتاعب.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
إذا قمت بإضافة هذا السطر من العلامات إلى الصفحة
في آي إي:
document.body.clientWidth ==> عرض كائن الجسم
document.body.clientHeight ==> ارتفاع كائن الجسم
document.documentElement.clientWidth ==> عرض المنطقة المرئية
document.documentElement.clientHeight ==> ارتفاع المنطقة المرئية
في فايرفوكس:
document.body.clientWidth ==> عرض كائن الجسم
document.body.clientHeight ==> ارتفاع كائن الجسم
document.documentElement.clientWidth ==> عرض المنطقة المرئية
document.documentElement.clientHeight ==> ارتفاع المنطقة المرئية
في الأوبرا:
document.body.clientWidth ==> عرض المنطقة المرئية
document.body.clientHeight ==> ارتفاع المنطقة المرئية
document.documentElement.clientWidth ==> عرض كائن الصفحة (أي عرض كائن BODY بالإضافة إلى عرض الهامش)
document.documentElement.clientHeight ==> ارتفاع كائن الصفحة (أي ارتفاع كائن BODY بالإضافة إلى ارتفاع الهامش)
وإذا لم يكن هناك معيار W3C محدد، إذن
أي هو:
document.documentElement.clientWidth ==> 0
document.documentElement.clientHeight ==> 0
فايرفوكس هو:
document.documentElement.clientWidth ==> عرض كائن الصفحة (أي عرض كائن BODY بالإضافة إلى عرض الهامش) document.documentElement.clientHeight ==> ارتفاع كائن الصفحة (أي ارتفاع كائن BODY بالإضافة إلى ارتفاع الهامش)
الأوبرا هي:
document.documentElement.clientWidth ==> عرض كائن الصفحة (أي عرض كائن BODY بالإضافة إلى عرض الهامش) document.documentElement.clientHeight ==> ارتفاع كائن الصفحة (أي ارتفاع كائن BODY بالإضافة إلى ارتفاع الهامش)
إنه أمر مزعج حقًا، في الواقع، من منظور التطوير، سيكون من الملائم جدًا أن يكون لديك عدد أقل من الكائنات والأساليب وعدم استخدام أحدث المعايير.