Est-il déconseillé de mettre un script en dehors de head ?

**Franck0** · 03/08/2012, 21h26

Bonjour,

J'ai un question simple et un peu bête...
Je suis débutant en Javascript, et je vois que dans presque tout les exemples, les scripts sont dans la balise head. Or, je mets parfois des scripts dans le footer par soucis de simplicité et ça semble très bien marcher aussi.
Est-il donc déconseillé de mettre mes balises <script type="text/javascript"> en dehors de <head> ?

Merci

**thelvin** · 03/08/2012, 22h51

Tout le monde ne le pense pas. D'ailleurs HTML5 autorise <script> presque partout, alors que les précédents HTML s'y refusaient.

Mon opinion personnelle est que mettre le <script> ailleurs que dans <head> n'est pas un problème en soi, mais fait penser les choses de manière bizarre, pas très adaptée. Facile, oui, peut-être, quand on comprend pas vraiment ce qui pourrait être encore plus facile. Et puis, facile ça ne veut pas dire bon.

Il y a aussi le risque de faire une erreur de syntaxe qui décale les éléments, ce qui est difficile à comprendre. Dans le <head> si ça arrive ça se voit.

**SpaceFrog** · 04/08/2012, 08h58

De manière classique les script se placent en effet dans le head, mais dans certains cas ou le document.write est utilisé lors de la construction de la page, le script fait des incursions dans le body.
De plus en plus avec les évolutions de javascript , l'avènement des frameworks et de html5 certains préconisent pour des raisons de rapidité d'éxecution au chargement de mettre les scripts en bas de page avant la balise de fermeture html.

**sekaijin** · 04/08/2012, 15h46

au final ça ne change les chose que dans un seul cas c'est l'utilisation du document.write dans le script en question.

mais je rapelle que le document.write est source de nombreuses erreurs et beaucoup dont moi n'hésitent pas à le banir

A+JYT

**Willpower** · 04/08/2012, 19h52

Envoyé par SpaceFrog

De manière classique les script se placent en effet dans le head, mais dans certains cas ou le document.write est utilisé lors de la construction de la page, le script fait des incursions dans le body.
De plus en plus avec les évolutions de javascript , l'avènement des frameworks et de html5 certains préconisent pour des raisons de rapidité d'éxecution au chargement de mettre les scripts en bas de page avant la balise de fermeture html.

balise html ou body ?

Envoyé par sekaijin

au final ça ne change les chose que dans un seul cas c'est l'utilisation du document.write dans le script en question.

mais je rapelle que le document.write est source de nombreuses erreurs et beaucoup dont moi n'hésitent pas à le banir

A+JYT

ça change qu'en le placant après tes élément html, tu ne doives plus faire de onload(ready) pour lancer tes manipulations sur les éléments.

document write est utile si on sait l'utiliser, par exemple (quasi) tous les scripts de régies publicitaires l'utilise.

**sekaijin** · 05/08/2012, 11h56

sorry je me suis mal exprimé

il n'y a qu'un seul cas ou on ne peut pas faire autrement que de le placer dans le code HTML c'est lorsqu'on utilise document.write.

dans ce cas là le fragment html ajouté est ajouté après le script contenant le document.write.

lorsqu'on n'utilise pas document.write il existe toujours d'autres solutions.

enfin pour finir personellement je n'utilise jamais document.write car ma page html se réduit toujours à

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

<html><head><script src="monScript.js"></script></head><body></body></html>

et rien de plus à par une feuille de style.
mais come je l'ai dit plus haut c'est un choix personnel.

A+JYT

**Watilin** · 05/08/2012, 15h37

C'est une question de standard. Dans les standards HTML 4 et XHTML 1.0, la balise <script> n'est effectivement autorisée que dans le <head> ; alors que selon le standard HTML 5, elle est autorisée n'importe où dans la page.

Tu peux toujours faire valider ta page en cas de doute. Cela dit, il faut garder en tête que la validité d'une page n'est qu'une indication. On peut faire une page valide et mal construire, tout comme on peut faire une page bien construite et pourtant invalide.

Quant aux considérations de performance, elles sont pour ma part assez futiles. Je pense que les navigateurs sont assez grands pour savoir quand et comment gérer les scripts d'une page, quel que soit leur emplacement (pour peu qu'ils soient bien écrits, et là-dessus je rejoins l'avis de Sekaijin : bannir document.write !). On avance parfois l'argument des performances réseau : si un script est codé directement dans la page, ils seront acheminés tous les deux avec la même requête HTTP ; alors que si le script est dans un autre fichier, il fera l'objet d'une requête HTTP différente. Pour des sites à forte fréquentation, ça peut jouer sur la charge du serveur, mais selon moi, ça ne devrait pas être un problème prioritaire.

**dourouc05** · 05/08/2012, 16h07

Envoyé par Watilin

il fera l'objet d'une requête HTTP différente.

S'il n'est pas déjà dans le cache du navigateur

.

**arnogues** · 05/08/2012, 16h14

Envoyé par Watilin

C'est une question de standard. Dans les standards HTML 4 et XHTML 1.0, la balise <script> n'est effectivement autorisée que dans le <head> ; alors que selon le standard HTML 5, elle est autorisée n'importe où dans la page.

Tu peux toujours faire valider ta page en cas de doute. Cela dit, il faut garder en tête que la validité d'une page n'est qu'une indication. On peut faire une page valide et mal construire, tout comme on peut faire une page bien construite et pourtant invalide.

Quant aux considérations de performance, elles sont pour ma part assez futiles. Je pense que les navigateurs sont assez grands pour savoir quand et comment gérer les scripts d'une page, quel que soit leur emplacement (pour peu qu'ils soient bien écrits, et là-dessus je rejoins l'avis de Sekaijin : bannir document.write !). On avance parfois l'argument des performances réseau : si un script est codé directement dans la page, ils seront acheminés tous les deux avec la même requête HTTP ; alors que si le script est dans un autre fichier, il fera l'objet d'une requête HTTP différente. Pour des sites à forte fréquentation, ça peut jouer sur la charge du serveur, mais selon moi, ça ne devrait pas être un problème prioritaire.

Tu te trompe en disant que le navigateur doit savoir quand gérer les scripts d'une page. justement, quand un JS est chargé il est evalué, et si celui-ci fait des traitements, pendant ce temps la page est bloquée.
Donc si tu mets des gros JS dans le head de ta page, ou n'importe ou dans ta page, l'affichage de ton HTML restera bloqué tant que le script ne sera pas chargé ni evalué (exécuté), donc il vaut mieux les mettre en fin de page ainsi l'utilisateur vera la page, et les JS s'éxécuteront ensuite pour rajouter le "dynamisme" de la page

**sekaijin** · 05/08/2012, 17h14

Envoyé par arnogues

Tu te trompe en disant que le navigateur doit savoir quand gérer les scripts d'une page. justement, quand un JS est chargé il est evalué, et si celui-ci fait des traitements, pendant ce temps la page est bloquée...

voilà pourquoi je ne mets pas de script dans la page mais dans des fichiers
et voilà aussi pourquoi mes script ne font jamais que desfinir des methode des classes et quelques variables aucun traitement

il y a suffisament d'événements à géré pour rendre tout ça asynchrone.
A+JYT

**SpaceFrog** · 05/08/2012, 19h25

balise html ou body ?

pour ma part avant la balise de fermeture html
ainsi le body est fermé et donc intégralement instancié
=> on peut utiliser document.body .

**Willpower** · 05/08/2012, 20h57

Envoyé par SpaceFrog

pour ma part avant la balise de fermeture html
ainsi le body est fermé et donc intégralement instancié
=> on peut utiliser document.body .

okay.

parce que de mémoire, j'ai déjà lu plusieurs fois que le script devait être placé dans la balise "head" ou "body", mais je ne sais pas si cette information est vraie ou non.

**Watilin** · 06/08/2012, 04h57

Vous avez tous raison

Simplement, ce que j'ai voulu dire, c'est qu'un script qui prend du temps bloquera la page s'il agit au chargement, quel que soit l'endroit où on l'a mis (et je viens de vérifier

). D'où la nécessité de bien concevoir son script avant de penser aux performances du réseau...

**sekaijin** · 06/08/2012, 07h00

c'est clair
d'ailleur j'ai eu des petits pb avec mon FAI qui mettait 10s à résoudre les adresses de google et du coup

chaque page de developpez.com méttait plus de 10s à arriver
la faute à la pub insérée au début de la page via un script js synchrone (qui bloque le chargement de la page)

il faut avant tout penser ses script avant de penser perf.
A+JYT

**Watilin** · 12/08/2012, 16h20

Après vérification, le validateur HTML5 accepte cette structure :

Code HTML :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
<html>
  ...
  <body>
    ...
    <script></script>
  </body>
</html>

mais pas celle-ci :

Code HTML :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
<html>
  ...
  <body>...</body>
  <script></script>
</html>

D'autre part, il est tout à fait possible d’utiliser document.body avant la fin de celui-ci, contrairement à ce que tu disais SpaceFrog. Même si je ne sais pas par quel miracle

**sekaijin** · 12/08/2012, 17h01

simplement parce que les moteur de rendu crée le body vide
puis lui ajoute le contenu

en fait dès le démarrage du moteur de rendu le document est créé
et cela corespond à

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

<html><head/><body/></html>

sans aucun attributs avant même la lecture des tags.
le document est créé dès que le navigateur à déterminé qu'il fallait créer un DOM

ensuite il lit les tags et positionne les attributs du html ajoute les headers et enfin fixe les attributs du body
ce n'est qu'après cela que le moteur de rendu ajoute le contenu du body.

créez un fichier html avec uniquement dedans

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

<script src="sample.js"></>

mettez du js dans sample.js et ouvrez le fichier dans le navigateur
mettez un point d'arrêt sur la première instruction
rechargez la page.
le chargement s'arrête dès le début
avec l'inspecteur js explorez le contenu de l'objet document
vous y trouverez beaucoup de chose dont un body

A+JYT

**psychadelic** · 13/08/2012, 14h50

Envoyé par SpaceFrog

De manière classique les script se placent en effet dans le head, mais dans certains cas ou le document.write est utilisé lors de la construction de la page, le script fait des incursions dans le body.
De plus en plus avec les évolutions de javascript , l'avènement des frameworks et de html5 certains préconisent pour des raisons de rapidité d'éxecution au chargement de mettre les scripts en bas de page avant la balise de fermeture html.

On peut très bien avoir des "document.write" dans un script si celui-ci est placé dans le head, faut juste penser à ajouter: defer="defer" dans les attributs...

**Bovino** · 14/08/2012, 09h14

Euh... psychadelic, tu devrais revoir tes références

Envoyé par W3C

defer [CI]
When set, this boolean attribute provides a hint to the user agent that the script is not going to generate any document content (e.g., no "document.write" in javascript) and thus, the user agent can continue parsing and rendering.

The SCRIPT element

**psychadelic** · 14/08/2012, 12h39

effectivement...

et je dois avouer aussi que j'utilise plus que rarement "doccument.write ...

**SpaceFrog** · 14/08/2012, 17h56

et je dois avouer aussi que j'utilise plus que rarement document.write ...

C'est en effet la methode à suivre ^^
Il n'y a que de rares cas ou le document.write se justifie lors de la création de la page.
http://www.developpez.net/forums/d11...te-javascript/

Est-il déconseillé de mettre un script en dehors de head ?

JavaScript

Discussions similaires

Partager

Partager