Quelle est la différence entre mettre le script dans la tête et le corps?

J'ai été faire un problème .

<head>
  <meta http-equiv="content-type" content="text/html; charset=utf-8" />
  <script type="text/javascript">
  alert(document.getElementsByTagName("li").length); 
  </script>
  <title>purchase list</title>
</head>
<body>
  <h1>What to buy</h1>
  <ul id="purchases">
    <li> beans</li>
    <li>Cheese</li>
  </ul>
</body>

Quand j'ai mis les scripts dans la tête, le résultat montre que 0

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN"
                      "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en"> 
<head>
  <meta http-equiv="content-type" content="text/html; charset=utf-8" />
  <title>Shopping list</title>
</head>
<body>
  <h1>What to buy</h1>

  <ul id="purchases">
    <li>Cheese</li> 
    <li>Milk</li>
    <script type="text/javascript">
    alert(document.getElementsByTagName("li").length);
    </script>
  </ul>
</body>

Quand j'ai essayé de mettre les scripts dans le corps, le résultat montre que 2. pourquoi il y a une telle différence?
quelle est la principale différence?

Parce qu'à l'époque de appelez-vous cela dans la tête, le li n'existe pas encore (Aussi loin que le DOM est concerné)
Il est recommandé de mettre du JavaScript (pas de bibliothèques, mais de travail JS que la page utilise) sur le fond de la page. Comme pour les bibliothèques que vous devriez inclure dans <head>.Notez que, le navigateur est rendu de code de haut en bas.
double possible de Javascript - tête, le corps ou jQuery?
merci u al.... 🙂
Très bonne explication et de la recommandation: stackoverflow.com/a/24070373/548473

InformationsquelleAutor Deepika C P | 2013-06-14

html javascript

17

Quelle est la différence entre mettre le script dans la tête et le corps?

Le temps qu'il exécute.

Quand j'ai mis les scripts dans la tête, le résultat montre que 0 liste de courses

Les éléments que vous tentez d'accéder n'existe pas lorsque le script s'exécute (puisqu'ils apparaissent à la fin du script dans le document).

Notez que vous pouvez écrire un script, de sorte qu'une fonction est appelée plus tard (pour différentes valeurs de plus tard y compris "quand tout le document a été chargé") à l'aide de les gestionnaires d'événements.
- Pouvez-vous expliquer pourquoi puis-je obtenir par exemple, innerHTML d'un élément avec un script à partir de la tête, mais le script à partir de la question ne peut pas obtenir la longueur. Merci!!!!
- Voir le dernier paragraphe de la réponse.
- Je ne vois pas vraiment une réponse là... je comprends que puis-je réaliser avec les gestionnaires d'événements, mais ce n'est pas ce que je vous demande. Je veux savoir pourquoi script à partir de la tête d'élément de processus.innerHTML mais l'élément.la longueur ne peut pas. C'est juste que je suis confondu parce que vous avez dit des éléments n'existe pas si l'on tente d'accéder à partir d'un script au-dessus de ces éléments (balise head dans notre cas). Merci d'essayer de me comprendre, je vous remercie.
- Parce que c'est important lorsque la ligne de code est exécuté, non pas quand elle est déclarée. Si c'est dans une fonction qui s'exécute en retard, c'est bien.
InformationsquelleAutor Quentin
8

C'est simple, JavaScript, aller de haut en bas, sauf si vous lui dites de faire quelque chose d'autre. Au moment où il atteint le li éléments, le code JavaScript a déjà été réalisé.

Si vous voulez le garder dans la tête cependant, vous pouvez utiliser le document.prêt de fonction et il se charge seulement après que le HTML c'est chargé.

InformationsquelleAutor Rinon
7

Tête se rendait avant du Corps. Si vous essayez d'accéder à votre li balises dans la tête, la réponse évidente est qu'ils ne sont pas créés jusqu'à ce que le navigateur rend le corps de l'article et, par conséquent, ne peut pas être référencé.

InformationsquelleAutor Darren

Parce qu'à l'époque de appelez-vous cela dans la tête, le li n'existe pas encore (Aussi loin que le DOM est concerné) – F4r-20 1 min et il y a

C'est correct.
Mais, essayez ceci:

HTML:

<head>
      <meta http-equiv="content-type" content="text/html; charset=utf-8" />
      <script type="text/javascript">
        window.onload = function(){ alert(document.getElementsByTagName("li").length); }
      </script>
      <title>purchase list</title>
    </head>
    
    <body>
      <h1>What to buy</h1>
      <ul id="purchases">
        <li> beans</li>
        <li>Cheese</li>
      </ul>
    </body>

InformationsquelleAutor CastenettoA

3

Lorsque vous composez le:
```
alert(document.getElementsByTagName("li").length); 
```
Vous voulez obtenir un élément qui n'existe pas encore. parce que la tête est la première chose qui s'exécute lors du chargement de la page.

c'est la recherche de la li élément, mais il n'est pas encore là quand le chef des charges.

Vous devez le mettre dans le corps, car alors, les éléments de liste. puis il travaille.

InformationsquelleAutor Kees Sonnema
1

Lorsque les scripts sont inclus dans la tête de charger ou d'exécuter avant que le contenu de la page. Lorsque vous les inclure dans le corps de leur chargement, ou courir après le précédent html. Il est généralement conseillé de placer les scripts de fermer à la fin du corps que possible.

InformationsquelleAutor br3w5
1

Si vous placez le script dans la tête, le code javascript est exécuté avant même que les contrôles dans les balises de corps sont rendus. Donc, si vous voulez garder vos scripts dans la balise head, assurez-vous qu'elles sont exécutées une fois onload est terminé. Ci-dessous est un exemple:
```
 <script type="text/javascript">
function MyFunction() {
    alert(document.getElementsByTagName("li").length);
}
window.onload = MyFunction;
</script>
```
InformationsquelleAutor Nitin Agrawal
1

Généralement les scripts et les fichiers CSS doit être adapté en tête, comme une bonne pratique.

Pour plus de détails au sujet de quand mettre dans la tête et le corps de la balise, consultez ce lien - Où dois-je mettre le CSS et le code Javascript dans une page HTML?
&
Dois-je écrire le script dans le corps ou la tête du code html?

InformationsquelleAutor orangeguy

Vous devez vous connecter pour publier un commentaire.