clientHeight/clientWidth العودة قيم مختلفة على مختلف المتصفحات

Question

خصائص document.body.clientHeight و document.body.clientWidth عودة قيم مختلفة على IE7, IE8 و فايرفوكس:

IE 8:

document.body.clientHeight : 704 
document.body.clientWidth  : 1148

IE 7:

document.body.clientHeight : 704 
document.body.clientWidth  : 1132

فايرفوكس:

document.body.clientHeight : 620 
document.body.clientWidth  : 1152

لماذا هذا التناقض موجود ؟
هل هناك أي ما يعادل الخصائص التي هي متسقة عبر مختلف المتصفحات (IE8, IE7, فايرفوكس) دون استخدام jQuery ؟

Answer 1

وهذا له علاقة مع نموذج الصندوق المتصفح. استخدام شيء مثل مسج أو مكتبة أخرى التجريد جافا سكريبت لتطبيع نموذج DOM.

Answer 2

وبول A غير الصحيح حول سبب وجود تفاوت ولكن الحل التي تقدمها NGM خطأ (بمعنى مسج).

وأي ما يعادل clientHeight وclientWidth في مسج (1.3) هو

$(window).width(), $(window).height()

Answer 3

على الجسم عنصر يأخذ المتاحة العرض ، والتي عادة ما المتصفح العرض.على هذا النحو, سوف تكون مختلفة الأبعاد عبر متصفح بسبب متصفح كروم الحدود التمرير العمودي الفضاء يستغرق من قبل القوائم وغيرها...

حقيقة أن مرتفعات تختلف أيضا ، كما يقول لي تعيين الجسم/html الارتفاع إلى 100% خلال المغلق منذ ذروة عادة ما تعتمد على عناصر داخل الجسم..

إلا إذا قمت بتعيين عرض الجسم عنصر ثابت القيمة من خلال css أو أنه أسلوب من هذه الأبعاد سوف وكقاعدة عامة ، تختلف دائما عبر المتصفحات/إصدارات وربما اعتمادا على الإضافات المثبتة على المتصفح.القيم الثابتة في مثل هذه الحالة هو أكثر استثناء من القاعدة...

عند استدعاء .clientWidth على العناصر الأخرى التي لا تأخذ التلقائي عرض المعاينة المتصفح, وسوف يعود دائما عناصر 'عرض' + 'الحشو'.لذا شعبة مع عرض 200 و الحشو من 20 سوف يكون clientWidth = 240 (20 الحشو اليسار واليمين).

السبب الرئيسي ولكن لماذا تحتج clientWidth هو بالضبط بسبب ممكن المتوقع التباين في النتائج.إذا كنت تعرف أنك سوف تحصل على العرض المستمر والقيمة هو معروف ، ثم الاحتجاج clientWidth زائدة...

Answer 4

وأي ما يعادل offsetHeight وoffsetWidth في مسج هو $ (إطار) .width ()، $ (إطار) .height () انها ليست clientHeight وclientWidth

Answer 5

Element.clientWidth & Element.clientHeight عودة ارتفاع/عرض هذا العنصر المحتوى بالإضافة المعمول بها الحشو.

مسج تنفيذ هذه هي:$(target).outerWidth() & $(target).outerHeight()

.clientWidth & .clientHeight مدرجة في CSSOM وحدة الرأي مواصفات والذي هو حاليا في مرحلة الصياغة.في حين المتصفحات الحديثة ثابت تنفيذ هذه المواصفات ، لضمان أداء ثابت عبر إرث منصات مسج تنفيذ ينبغي أن لا تزال تستخدم.

معلومات إضافية:

• https://developer.mozilla[dot]org/en-US/docs/Web/API/عنصر.clientWidth
• https://developer.mozilla[dot]org/en-US/docs/Web/API/عنصر.clientHeight

Answer 6

وماذا فعلت لإصلاح مشكلة لي مع clientHeight هو استخدام clientHight من الضوابط firstChild. يمكنني استخدام IE 11 لطباعة الملصقات من قاعدة بيانات وclientHeight التي عملت في IE 8 كان عائدا ذروة 0 في IE 11. لقد وجدت خاصية في ذلك السيطرة التي تم سردها كما firstChild والتي كان لها الممتلكات إذا clientHeight وفعلا كان ل ارتفاع كنت أبحث عنه. إذا كان الأمر كذلك التحكم الخاصة بك بإرجاع clientSize 0 نلقي نظرة على ممتلكات firstChild لها. انها ساعدتني ...

Answer 7

وكان لي مشكلة مماثلة - فايرفوكس عاد القيمة الصحيحة من obj.clientHeight لكن أي فعل not- عادت 0. I تغييره إلى obj.offsetHeight وأنه يعمل. يبدو أن هناك بعض الدول التي لديها أي لclientheight - أن يجعل من غير محدد ...

Answer 8

ويمكن أن يسببه خلل نموذج الصندوق IE ل. لحل هذه المشكلة، يمكنك استخدام rel="nofollow صندوق نموذج هاك .

Answer 9

وبعض مزيد من المعلومات لنافذة المتصفح: http://www.w3schools.com/js/js_window.asp؟output=print