Comment savoir si un navigateur est en mode «bizarreries»?

128

Supposons que vous ayez une page avec un doctype relativement strict et un balisage HTML assez proche de la conformité, mais qui manque peut-être de quelques manières idiotes, peut-être à cause d'un contenu utilisateur qui échappe à votre contrôle ... disons que vous travaillez sur un contenu système de gestion ou un thème pour un système de gestion de contenu où vous contrôlez une structure de base et avez besoin de javascript, mais vous n'êtes pas responsable de tout ce qui entre dans les pages.

Comment savoir (ou: qu'est-ce qui déterminera) quand le navigateur décide de passer en mode "bizarreries" plutôt que d'utiliser son moteur plus conforme aux normes?

Je cherche des réponses pour chacun des principaux navigateurs, car IE, Chrome, Safari et Firefox vont bien sûr tous gérer cela différemment. Une seule erreur suffit-elle pour la forcer ou avez-vous une marge de manœuvre?

html browser quirks-mode Joël Coehoorn
la source

Réponses:

159

Dans Firefox et Opera, vous pouvez déterminer si votre navigateur est en "mode bizarreries" en vérifiant les informations de la page.

L'utilisation de document.compatMode, vous indiquera le mode dans lequel vous vous trouvez avec la plupart des navigateurs.

Dans Chrome, Safari et IE , exécutez ce javascript dans la barre d'adresse:

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

(notez que vous devrez retaper la javascript:partie après l'avoir collée dans votre barre d'adresse, en raison des récents changements de sécurité)

Chris Ballance
la source
Il y a une autre valeur potentielle dans IE que j'ai rencontrée en forçant une vieille page en mode "EDGE". La valeur était "BackCompat"
Greg Woods
J'ai également BackCompat dans Chrome lors de la configuration de DOCTYPE sur quelque chose de complètement invalide. Selon le code de cette réponse, si la valeur est autre chose que CSS1Compat, elle est en mode quirks. Est-ce vraiment vrai? Quelles sont toutes les valeurs possibles?
still_dreaming_1
Apparemment, BackCompatible est la valeur standard pour le mode «bizarreries» / «compatibilité». Il n'y a que les 2 valeurs: developer.mozilla.org/en-US/docs/Web/API/Document/compatMode
still_dreaming_1
19

Comme vous pouvez interroger le mode de rendu en JavaScript, vous pouvez avoir un Bookmarklet qui vous dira quel mode de rendu une page utilise.

J'ai trouvé ce bookmarklet de mode de rendu qui fonctionne bien pour moi:

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

La réponse complète à votre question spécifique: "Une seule erreur suffit-elle pour la forcer ou avez-vous une certaine marge de manœuvre?" est que cela dépend totalement de l'erreur. Par exemple,

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

forcera le mode quirks dans IE 6 & 7 bien qu'il ne s'agisse pas vraiment d'une erreur (ils lancent juste un total bancal lorsque la toute première ligne du fichier n'est pas une déclaration). Une liste rapide des types / bizarreries peut être trouvée ici

Essayez de coller la ligne suivante dans votre HTML pour le test (très mauvais comportement javascript que je passe ici - désolé ... assurez-vous que cela ne sera jamais mis en ligne :)

<a href="javascript:alert(document.compatMode);">What mode am I?</a>
Steerpike
la source
Merci pour le testeur javascript, car mes deux premières tentatives pour échapper au mode bizarreries n'ont pas fonctionné.
Noumenon
css1compat! = mode bizarreries?
Mike Cole
4

Selon http://www.quirksmode.org/css/quirksmode.html : "Le problème était que certaines pages écrites en mode quirks avaient des doctypes. Par conséquent, chaque navigateur a sa propre liste avec des doctypes qui déclenchent le mode quirks. Voir ce navigateur tableau de comparaison pour un aperçu de ces listes: http://hsivonen.iki.fi/doctype/ "

J'espère que cela t'aides

Sébastien Nussbaumer
la source
3

Si vous dites à IE qu'il doit être strict (via doctype), il ne changera pas d'avis à mi-chemin de la page.

i_am_jorf
la source
2

Si je comprends correctement le mode quirks, une page qui ne valide pas par rapport à son doctype déclaré ne suffit pas pour déclencher le mode quirks. Il ne s'affichera tout simplement pas correctement.

La meilleure ressource que j'ai trouvée pour déterminer comment différents navigateurs gèrent chaque doctype est ici .

Bill le lézard
la source
2

Pour Firefox avec le module complémentaire Web Developer Toolbar, vous pouvez regarder le trio d'icônes à droite de la barre. Le plus à gauche vous indique dans quel mode vous vous trouvez.

Arieleo
la source
2

Dans IE, vous le verrez dans les outils de développement (en appuyant sur F12), il le dit dans le menu: Mode Document: ... Et vous pouvez également y forcer un mode différent.

Ronen Festinger
la source
Cela manque le point de la question. Cela ne vous aide pas à écrire du javascript qui s'exécute sur un chemin pour le mode quirks et un chemin différent pour le mode standard.
Joel Coehoorn
En fait, vous ne demandez pas comment le faire en Javascript mais comment savoir quel mode le navigateur utilise. Quoi qu'il en soit, même si vous ne le pensiez pas, cela peut aider les autres qui le recherchent, j'avais moi-même besoin de savoir comment le savoir dans Firefox et je suis arrivé à cette question.
Ronen Festinger
@JoelCoehoorn Le vrai problème est que vous n'avez jamais expliqué ce qu'est un "doctype relativement strict"!
Mr Lister
0

dans la page html5, écrire " <!DOCTYPE html>" commencer par la page peut changer en document.compatMode = 'CSS1Compat'

Miro
la source