จะทราบได้อย่างไรว่าเบราว์เซอร์อยู่ในโหมด "นิสัยใจคอ"?

128

สมมติว่าคุณมีหน้าเว็บที่มี doctype และ HTML ที่ค่อนข้างเข้มงวดซึ่งใกล้เคียงกับมาตรฐาน แต่อาจจะพลาดไปในทางที่โง่อาจเป็นเพราะเนื้อหาของผู้ใช้ที่อยู่นอกเหนือการควบคุมของคุณ ... บอกว่าคุณกำลังทำงานกับเนื้อหาอยู่ ระบบการจัดการหรือชุดรูปแบบสำหรับระบบการจัดการเนื้อหาที่คุณควบคุมโครงสร้างพื้นฐานบางอย่างและต้องการจาวาสคริปต์ แต่คุณจะไม่รับผิดชอบทุกอย่างที่เข้าสู่หน้าเว็บ

คุณจะบอกได้อย่างไร (หรือ: อะไรจะเป็นตัวกำหนด) เมื่อเบราว์เซอร์ตัดสินใจที่จะเข้าสู่โหมด "นิสัยใจคอ" แทนที่จะใช้มันเป็นเครื่องมือที่สอดคล้องกับมาตรฐานมากขึ้น?

ฉันกำลังมองหาคำตอบสำหรับเบราว์เซอร์หลัก ๆ แต่ละอันเนื่องจากแน่นอนว่า IE, Chrome, Safari และ Firefox จะจัดการแตกต่างกันไป มีข้อผิดพลาดเพียงข้อเดียวเพียงพอที่จะบังคับหรือคุณมีระยะทางไกลบ้างไหม?

html browser quirks-mode

— Joel Coehoorn
แหล่งที่มา

159

ในFirefox และ Operaคุณสามารถตรวจสอบว่าเบราว์เซอร์ของคุณอยู่ใน "โหมด quirks" โดยตรวจสอบข้อมูลหน้า

การใช้document.compatModeจะบอกโหมดที่คุณใช้กับเบราว์เซอร์ส่วนใหญ่

ในChrome, Safari และ IEให้เรียกใช้จาวาสคริปต์นี้ในแถบที่อยู่:

 javascript:window.alert('You are in ' + (document.compatMode==='CSS1Compat'?'Standards':'Quirks') + ' mode.')

(โปรดทราบว่าคุณจะต้องพิมพ์javascript:ส่วนอีกครั้งหลังจากวางลงในแถบที่อยู่ของคุณเนื่องจากการเปลี่ยนแปลงความปลอดภัยล่าสุด)

— Chris Ballance
แหล่งที่มา

มีอีกค่าที่เป็นไปได้ใน IE ที่ฉันเจอเมื่อบังคับให้หน้าเก่าเข้าสู่โหมด "EDGE" ค่าคือ "BackCompat"

— Greg Woods

ฉันได้ BackCompat ใน Chrome เช่นกันเมื่อตั้งค่า DOCTYPE เป็นสิ่งที่ไม่ถูกต้องสมบูรณ์ ตามรหัสในคำตอบนี้ถ้าค่าเป็นอย่างอื่นที่ไม่ใช่ CSS1Compat มันอยู่ในโหมด quirks เป็นเรื่องจริงเหรอ? ค่าที่เป็นไปได้ทั้งหมดคืออะไร?

— still_dreaming_1

Apparently BackCompatible เป็นค่ามาตรฐานสำหรับโหมด "quirks" / "ความเข้ากันได้" มีเพียง 2 ค่าเท่านั้นคือdeveloper.mozilla.org/en-US/docs/Web/API/Document/compatMode

— still_dreaming_1

19

ในขณะที่คุณสามารถสืบค้นโหมดการเรนเดอร์ใน JavaScript คุณสามารถมีBookmarkletซึ่งจะบอกโหมดการเรนเดอร์ที่เพจกำลังใช้

ฉันพบbookmarklet โหมดการแสดงผลนี้ทำงานได้ดีสำหรับฉัน:

javascript:m=(document.compatMode=='CSS1Compat')?'Standards':'Quirks';window.alert('You%20are%20in%20'%20+%20m%20+%20'%20mode.');

— เดฟเวบบ์
แหล่งที่มา

11

คำตอบสำหรับคำถามเฉพาะที่แท้จริงของคุณคือ 'มีข้อผิดพลาดเพียงข้อเดียวเพียงพอที่จะบังคับใช้หรือคุณมีระยะเวลาเพิ่มขึ้นบ้างไหม' คือทั้งหมดขึ้นอยู่กับข้อผิดพลาด ตัวอย่างเช่น,

<!-- Comment -->
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

จะบังคับโหมด quirks ใน IE 6 และ 7 แม้จะไม่ใช่ข้อผิดพลาดจริง ๆ (พวกเขาเพียงแค่โยนรวมสั่นคลอนเมื่อบรรทัดแรกของไฟล์ที่ไม่ได้ประกาศ) รายการประเภท / quirks อย่างรวดเร็วสามารถพบได้ที่นี่

ลองติดบรรทัดต่อไปนี้ใน HTML ของคุณเพื่อทดสอบ (จาวาสคริปต์ที่แย่มาก ๆ ฉันกำลังส่งต่อที่นี่ - ขอโทษ ... ตรวจสอบให้แน่ใจว่าสิ่งนี้จะไม่เกิดขึ้น :)

<a href="javascript:alert(document.compatMode);">What mode am I?</a>

— Steerpike
แหล่งที่มา

ขอบคุณสำหรับผู้ทดสอบจาวาสคริปต์เพราะสองคนแรกของฉันพยายามหนีโหมดนิสัยใจคอไม่ทำงาน

— Noumenon

css1compat! = โหมดแปลก ๆ ?

— Mike Cole

4

ตามที่http://www.quirksmode.org/css/quirksmode.html : "ปัญหาคือว่าบางหน้าที่เขียนในโหมด quirks มี doctypes ดังนั้นแต่ละเบราว์เซอร์มีรายการของตัวเองด้วย doctypes ที่เรียกโหมด quirks ดูเบราว์เซอร์นี้ แผนภูมิเปรียบเทียบสำหรับภาพรวมของรายการเหล่านี้: http://hsivonen.iki.fi/doctype/ "

หวังว่านี่จะช่วยได้

— Sébastien Nussbaumer
แหล่งที่มา

3

หากคุณบอก IE ว่าควรเข้มงวด (ผ่าน doctype) มันจะไม่เปลี่ยนใจไปครึ่งหน้า

— i_am_jorf
แหล่งที่มา

2

หากฉันเข้าใจโหมด quirks อย่างถูกต้องหน้าเว็บที่ไม่ได้ตรวจสอบความถูกต้องกับประเภทเอกสารที่ประกาศไว้นั้นไม่เพียงพอที่จะเรียกใช้โหมด quirks มันจะแสดงไม่ถูกต้อง

ทรัพยากรที่ดีที่สุดที่ฉันได้พบในการกำหนดวิธีการที่แตกต่างกันเบราว์เซอร์จัดการแต่ละประเภทเอกสารที่เป็นที่นี่

— Bill the Lizard
แหล่งที่มา

2

สำหรับ Firefox ที่มีแถบเครื่องมือผู้พัฒนาเว็บเพิ่มคุณสามารถดูไอคอนสามอันทางด้านขวาของแถบ ทางซ้ายสุดจะบอกคุณว่าคุณอยู่ในโหมดใด

— Arieleo
แหล่งที่มา

2

ใน IE คุณจะเห็นมันในเครื่องมือของนักพัฒนาซอฟต์แวร์ (กด F12) มันบอกว่ามันอยู่ในเมนู: โหมดเอกสาร: ... และคุณยังสามารถบังคับโหมดอื่นที่นั่นได้

— Ronen Festinger
แหล่งที่มา

สิ่งนี้ไม่ตรงกับคำถาม แต่นั่นไม่ได้ช่วยให้คุณเขียนจาวาสคริปต์ที่เรียกใช้เส้นทางเดียวสำหรับโหมด quirks และเส้นทางอื่นสำหรับโหมดมาตรฐาน

— Joel Coehoorn

จริงๆแล้วคุณไม่ได้ถามว่าจะทำอย่างไรใน Javascript แต่จะรู้ได้อย่างไรว่าเบราว์เซอร์ใช้โหมดใด แม้ว่าคุณจะไม่ได้หมายความว่ามันอาจช่วยคนอื่นที่มองหามันฉันเองก็จำเป็นต้องรู้วิธีที่จะรู้ใน Firefox และได้รับคำถามนี้

— Ronen Festinger

@JoelCoehoorn ปัญหาที่แท้จริงคือคุณไม่เคยอธิบายว่า "ประเภทของคำสั่งที่ค่อนข้างเข้มงวด" คืออะไร!

— นาย Lister

0

ในหน้า html5 เขียน " <!DOCTYPE html>" เริ่มต้นด้วยหน้าสามารถเปลี่ยนเป็น document.compatMode = 'CSS1Compat'

— Miro
แหล่งที่มา