Quel est le but de la classe de « no-js » HTML ?

Question

Quel est le but de la classe de « no-js » HTML ?

Demandé el 17 de Juillet, 2011: Quand la question a-t-elle été
78866 affichage: Nombre de visites la question a
5 Réponses: Nombre de réponses aux questions
Résolu: Situation réelle de la question

J'ai remarqué que dans beaucoup de moteurs de template, dans le HTML5 Boilerplate, dans différents cadres et en php des sites de l' no-js classe ajoutée sur l' <HTML> balise.

Pourquoi est-ce fait? Est-il une sorte de comportement par défaut du navigateur qui réagit à cette classe? Pourquoi il toujours? N'est-ce pas rendre la classe elle-même obsolète, si il n'y a pas de no-"no-js" affaire et html peuvent être adressées directement?

Voici un exemple de l'HTML5 Boilerplate index.html:

<!--[if lt IE 7 ]> <html lang="en" class="no-js ie6"> <![endif]-->
<!--[if IE 7 ]>    <html lang="en" class="no-js ie7"> <![endif]-->
<!--[if IE 8 ]>    <html lang="en" class="no-js ie8"> <![endif]-->
<!--[if IE 9 ]>    <html lang="en" class="no-js ie9"> <![endif]-->
<!--[if (gt IE 9)|!(IE)]><!--> <html lang="en" class="no-js"> <!--<![endif]-->

Comme vous pouvez le voir, l' <html> élément aura toujours cette classe. Quelqu'un peut m'expliquer pourquoi ceci est fait si souvent?

Demandé el 17 de Juillet, 2011 par Swader

Answer 1

5 Réponses

Answer 2

514voto

Gregory Pakosz Points 35546

Lors de l’exécution de Modernizr, il supprime la classe « no-js » et le remplace par « js ». Il s’agit d’un moyen de savoir dans vos CSS ou non le support Javascript est activé.

Voir le code source de modernisateur.

Répondu el 17 de Juillet, 2011 par Gregory Pakosz (35546 Points )

Answer 3

116voto

Zach L Points 3560

L' no-js classe est utilisée par la Modernizr fonctionnalité de détection de la bibliothèque. Lorsque Modernizr des charges, il remplace no-js avec js. Si JavaScript est désactivé, le reste de la classe. Cela vous permet d'écrire du CSS qui permet de cibler facilement une ou l'autre condition.

De Modernizrs' Enrichies Source (qui n'est plus maintenu):

Supprimer les "no-js" classe de l'élément, si elle existe: docElement.className=docElement.className.replace(/\bno-js\b/,'') + ' js';

Je voudrais faire la même chose, mais sans Modernizr. J'ai mis la suivante <script> dans la <head> de changer la classe d' js si le JavaScript est activé.

<script>
    document.documentElement.className = 
       document.documentElement.className.replace("no-js","js");
</script>

Avant cette technique, je voudrais généralement il suffit d'appliquer js-charge styles directement avec JavaScript. Par exemple:

$('#someSelector').hide();
$('.otherStuff').css({'color' : 'blue'});

Avec l' no-js astuce, cela peut Maintenant être fait avec css:

.js #someSelector {display: none;}
.otherStuff { color: blue; }
.no-js .otherStuff { color: green }

C'est préférable parce que:

Il charge plus rapide (pas de flash)
Séparation des préoccupations, etc...

Répondu el 13 de Septembre, 2012 par Zach L (3560 Points )

Answer 4

41voto

SLaks Points 391154

Modernizr.js va supprimer la `` classe.

Cela vous permet d’établir des règles CSS `` de les appliquer uniquement si Javascript est désactivé.

Répondu el 17 de Juillet, 2011 par SLaks (391154 Points )

Answer 5

17voto

marc Points 4070

Le `` classe obtient enlevée par un script javascript, afin que vous puissiez modifier/afficher/cacher les choses en utilisant le css si js est désactivé.

Répondu el 17 de Juillet, 2011 par marc (4070 Points )

Answer 6

13voto

Fizer Khan Points 4128

Ce n’est pas seulement applicable en modernisateur. Je vois certains site implémenter comme ci-dessous pour vérifier si elle a prise en charge javascript ou non.

Si javascript support est là, il va supprimer classe. Sinon restera dans la balise body. Ensuite, ils contrôlent les styles css lorsque aucune prise en charge de javascript.

Répondu el 1 de Août, 2014 par Fizer Khan (4128 Points )

Quel est le but de la classe de « no-js » HTML ?

Réponses

Questions en vedette

Top Tags

Prograide.com

Powered by:

Quel est le but de la classe de « no-js » HTML ?

Réponses

Questions connexes

Questions en vedette

Top Tags

Dans notre réseau

Prograide.com

Powered by: