Pourquoi mettre css en haut et js en bas ?

Les raisons pour lesquelles css est placé au-dessus et js est placé en dessous : 1. Lors du chargement de HTML pour générer une arborescence DOM, l'arborescence DOM peut être rendue en même temps, ce qui peut éviter les scintillement, les écrans blancs ou la confusion mises en page ; 2. Chargement de JavaScript Il sera exécuté immédiatement et bloquera le chargement ultérieur des ressources.

L'environnement d'exploitation de cet article : système Windows 7, version HTML5&&CSS3, ordinateur DELL G3.

Recommandé : Tutoriel vidéo CSS

La différence entre href et src

Utilisez généralement href pour charger CSS et le mettre dans la partie en-tête ; utilisez src pour charger le script et placez-le en bas du corps.

href

est l'abréviation de référence hypertexte, qui représente une référence hypertexte et sert à établir un lien entre l'élément courant et le document. Ceux couramment utilisés incluent link et a.

Lorsque CSS est référencé à l'aide de href, le navigateur identifiera le document et demandera le CSS, le téléchargera en parallèle et n'arrêtera pas de charger le document actuel.

src

est l'abréviation de source, qui est une ressource et une partie essentielle de la page. Le contenu pointé par src sera intégré à la position de. la balise actuelle dans le document. Les plus couramment utilisés incluent img, script et iframe.

Lorsque le script utilise la référence src, lorsque le navigateur analyse l'élément, il arrêtera de restituer le document jusqu'à ce que la ressource soit chargée. C'est pourquoi le script est placé en bas au lieu de la tête.

Les raisons de mettre du CSS dans l'en-tête et du script en bas

1 Mettre du CSS dans l'en-tête

Lors du chargement du HTML pour générer un. Arborescence DOM, vous pouvez restituer l'arborescence DOM en même temps.

Cela peut éviter le scintillement, l'écran blanc ou une mise en page confuse.

2. Mettez javascript à la fin

javascript peut modifier la structure de l'arborescence DOM, une arborescence DOM stable est donc nécessaire.

Javascript sera exécuté immédiatement après le chargement et bloquera le chargement ultérieur des ressources. (Caractéristiques du chargement et de l'exécution de javascript)

Développez les connaissances :

1. Tout d'abord, comprenons quelques problèmes courants :

1. Lors de l'optimisation de la page, vous avez besoin. pour mettre les fichiers CSS en tête et les fichiers js à la fin. Pourquoi cela peut-il permettre d'optimiser la page ?

2 Lorsque vous utilisez jquery, pourquoi écrivez-vous la fonction dans l'incident $(document).ready (). ?

3.javascript bloquera l'analyse de dom.

Lorsque la balise

• Que faire si l'arrière-plan CSS dépasse la largeur
• Que faire si Apache ne charge pas les fichiers CSS
• css comment définir une liste avec des éléments carrés
• Comment mettre du texte en gras en CSS
• Comment compresser js css