J'ai parcouru JavaScript il y a quelque temps et je me sentais bien dans ma peau à l'époque. Maintenant que j'y pense, j'ai l'impression que ce n'est rien. La tâche d'aujourd'hui est d'étudier le chapitre sur le cycle de vie de la page client dans asp.net ajax. Cependant, j'ai été un peu confus par le contenu de ce chapitre. Aucun de ces doutes n’est mentionné dans le livre.
1. Quel est le processus de chargement détaillé de la page HTML ? Quelle est la priorité des éléments de la page lors du chargement ?
2. La portée de JavaScript, la portée des variables et la relation entre les différents segments de script ?
3. Quel est le cycle de vie des pages html ?
Ces questions m’ont vraiment touché. Sans les comprendre, je ne peux pas voir les principes sous-jacents à travers le framework ajax asp.net. Je le sais seulement mais je ne sais pas pourquoi.
En cas de recherche approfondie d'informations sur Internet. J'ai des réponses.
À propos du chargement du HTML :
De manière générale, le HTML est chargé et analysé de haut en bas, tout en générant des objets DOM. Quant à ce qui est mixé en HTML :
document.write("xxxx");
<script type="text/javascript" src="aaa.js"></script>
Quelle est leur commande ? Toujours pareil, si vous rencontrez ces choses lors de l'analyse HTML, vous arrêterez d'analyser et exécuterez ces instructions générées. Si un lien externe est inséré au milieu, vous analyserez et exécuterez le js correspondant au lien externe. Les instructions suivantes ont des résultats différents selon les navigateurs :
<script type="text/javascript" src="aaa.js"></script>
dans c'est à dire. Il n'attendra pas que aaa.js soit téléchargé et analysé. Il créera un autre thread pour le gérer, et le thread principal passera par là. Mais aux ff. Il attendra que aaa.js soit téléchargé, analysé et exécuté.
Concernant l'exécution de javascript, veuillez consulter les documents de référence joints à la fin de cet article, qui contiennent une discussion détaillée.
A propos du cycle de vie des pages en html :
Les deux événements les plus importants sont onLoad et onUnLoad. onLoad est déclenché lorsque la page est chargée. onUnLoad est déclenché après la destruction du DOM de la page. Cependant, onLoad est un peu spécial, veuillez également consulter les documents de référence joints à la fin de cet article. Assurez-vous d'attirer l'attention.
J'ai regardé le code source html de plusieurs sites et j'ai trouvé le code suivant :
<div><script src="/ggjs/view1602_w.js"></script></div>
Il s'agit du code permettant à un site Web d'afficher des publicités sur la page. Sur les sites Web nationaux, les publicités affichées utilisent généralement des iframes pour introduire des pages tierces, mais ici elles sont générées directement à l'aide de segments javascript. Plus tard, j'ai regardé le code html généré par le blog 163, c'était tellement anormal. L'intégralité du code HTML n'a qu'une seule étagère et toutes les pages sont générées via js. J'ai vu que plusieurs fichiers js étaient introduits derrière la page, et finalement il y a eu un appel à la fonction initAll à la fin de la page. Je n'ai pas étudié attentivement son code js. Je soupçonne qu'il place toutes les fonctions de la couche de présentation dans le fichier js du client. Le côté serveur ne comprend que quelques racks de pages et de nombreux services Web. C'est vraiment à couper le souffle.
Concernant un événement déclenchant plusieurs fonctions de réponse :
J'ai déjà pensé à implémenter quelque chose de similaire à un délégué en C#. Les événements JavaScript peuvent être associés à plusieurs fonctions. Une liste d'événements peut être déclenchée à la fois. J'étudie asp.net ajax ces jours-ci et il existe un package pour cela.
Dans asp.net ajax, un élément dom peut être encapsulé dans un objet Sys.UI.DomElement dans asp.net ajax. Ensuite, vous pouvez utiliser ses méthodes : addHandler(), addHandlers(), removeHander() pour faire fonctionner la liste d'événements. Comme c’est pratique. Je n'avais pas bien compris ce principe à l'époque. Aujourd'hui, j'ai vu les deux morceaux de code dans le matériel de référence ci-dessous, ce qui m'a permis de bien comprendre les détails :
1. Utilisez l'interface du dom 2 :
Copiez le code comme suit :
si(document.addEventListener){
window.addEventListener('load',f,false);
window.addEventListener('load',f1,false);
…
}autre{
window.attachEvent('onload',f);
window.attachEvent('onload',f1);
…
}
Il s’avère que ce concept existait déjà dans les DOM. C'est seulement à ce moment-là que j'ai su. Il semble qu’il y ait encore beaucoup de choses que je ne comprends pas à propos de Dom.
Deuxièmement, cette méthode est mise en œuvre uniquement à la main. Voir le code ci-dessous :
Copiez le code comme suit :
fonction addLoadEvent (func) {
var oldonload = window.onload;
if (typeof window.onload != 'function') {
window.onload = func;
} autre {
window.onload = fonction() {
si (ancien chargement) {
vieuxonload();
}
fonction();
}
}
}
Cette fonction est très intelligemment écrite. Utilisez des fonctions anonymes pour y parvenir !