Nous savons qu'une implémentation JavaScript complète doit être composée de trois parties: ECMAScript (Core), BOM (Browser Object Model) et DOM (Document Object Model).
Aujourd'hui, j'apprends principalement Bom et Dom.
Bom:
BOM fournit de nombreux objets pour accéder aux fonctions du navigateur, qui n'ont rien à voir avec le contenu de la page Web (c'est l'entreprise DOM). À l'heure actuelle, la nomenclature a été déplacée dans la spécification HTML5 par W3C.
Objet de fenêtre:
Le noyau de BOM représente une instance du navigateur. Il s'agit à la fois d'une interface pour accéder à la fenêtre du navigateur via JavaScript et un objet global spécifié par ECMascript. Cela signifie que tout objet, variable et fonction définis dans la page Web a la fenêtre comme son objet global, il a donc la permission d'accéder à des méthodes telles que PareSinInt (). (Extrait de l'altitude III). De plus, si une page Web contient des cadres, chaque trame a son propre objet de fenêtre et est enregistrée dans la collection de trames (index 0 démarre, LTR, TTB).
Tout d'abord, les variables et les fonctions dans l'environnement d'exécution global sont toutes des genres et des méthodes d'objets de fenêtre. Bien sûr, il existe une petite différence entre les variables globales et les attributs de fenêtre directement définis. Les variables globales (pour être précises, elles doivent être explicitement déclarées variables globales) ne peuvent pas utiliser la suppression, tandis que les attributs de fenêtre sont bien. En outre, il y a un autre détail pour noter que l'essai d'accéder aux variables non déclarées errera, mais il n'y a aucun problème à utiliser des objets de fenêtre de requête.
Alors, quelles sont les propriétés ou méthodes communes de la fenêtre?
1.Nom, chaque objet Window a un attribut de nom, qui contient le nom du cadre. Généralement pour comprendre les relations et les cadres de fenêtres.
2. Méthode de position de la fenêtre: MoveTo (coordonnée x de la nouvelle position, coordonnée Y de la nouvelle position), Moveby (mouvement horizontal x, mouvement vertical y). Ces deux méthodes ne s'appliquent pas au cadre.
3. Attributs de taille de fenêtre: Innerwidth / Hauteur (taille de vue (moins la largeur de la bordure) / * IE, Safari, Firefox * /), OUTERWIDTH / HEET (Renvoie la taille de la fenêtre du navigateur / * IE, Safari, Firefox * /). Dans Chrome, l'intérieur et l'extérieur retournent les deux de la taille de la zone de vue.
Bien sûr, vous pouvez modifier la taille de la fenêtre par Resizeto (nouvelle largeur de fenêtre, nouvelle hauteur de fenêtre), redimensiby (jusqu'à la largeur d'origine et augmenter Y par rapport à la hauteur d'origine). Cette méthode de la chanson d'amour ne s'applique pas à la structure du cadre.
4.Window.open (URL, cible de fenêtre, chaîne de fonctionnalités, si la nouvelle page remplace le booléen de la page actuellement chargée dans l'historique du navigateur) est utilisé pour naviguer vers une URL spécifique ou ouvrir une nouvelle fenêtre. Si la cible de la fenêtre est spécifiée et que la cible de la fenêtre est le nom d'une fenêtre ou d'une trame existante, l'URL spécifiée sera chargée dans la fenêtre ou le cadre qui a été renommé. Sinon, la nouvelle fenêtre qui s'ouvre sera nommée comme la fenêtre cible. Bien sûr, les mots clés que les cibles de fenêtre peuvent spécifier sont _self, _parent, _top, _blank.
<a href = // www.vevb.com> Cliquez sur moi </a> <cript> var link = document.getElementsByTAGName ("A") [0]; alert (link.nodeName); window.onload = function () {link.onclick = function () {window.open (link.href, "bon", "width = 400px, height = 300px"); retourne false; }} </ scriptLes paramètres spécifiques de la chaîne de fonctionnalités ne sont pas détaillés ici. Si vous êtes intéressé, vous pouvez cliquer ici
5. En tant que langue unique, JS permet toujours de définir des valeurs de délai d'attente (exécution de code après l'événement spécifié) et des valeurs de temps d'intervalle (boucle une fois à chaque heure spécifiée) pour planifier l'exécution du code à un moment spécifique.
Appel de délai de temps: setTimeout (chaîne de code JS, heure du milliseconde). En tant que langue unique, la file d'attente de tâches JS ne peut exécuter qu'un seul morceau de code à la fois. Si la file d'attente de tâche est vide après l'intervalle de temps défini, la chaîne de code sera exécutée. Sinon, vous devez attendre que le code précédent soit exécuté avant l'exécution.
var al = setTimeout (function () {alert ("good");}, 5000); alerte (al); // 2Ici, j'ai appelé une fonction anonyme après 5 secondes pour sortir bien. Une boîte d'avertissement est apparue dans la fenêtre pour afficher 2. On peut voir que la fonction setTimeout () renvoie un ID numérique, qui est unique. Ensuite, nous pouvons effacer l'appel de temps mort via cet ID et utiliser Cleartimeout (ID) pour l'effacer.
Appel indirect: setInterval (), les paramètres qu'il accepte sont les mêmes que SetTimeout (), et renvoie également un ID numérique et effacé avec ClearTimeout ().
6. Méthodes de boîte de dialogue système: alert (), confirm (), inside (), etc. sont écrites dans mon blog précédent, cliquez ici
objet de localisation
Plutôt que d'être un objet dans la nomenclature, l'emplacement est une propriété dans l'objet Window. Bien sûr, c'est aussi la propriété de l'objet de document dans le DOM qui sera discutée plus tard. Autrement dit, Window.Location et Document.Location se réfèrent au même objet.
Liste d'attribut d'objet d'emplacement, la modification de ces attributs peut charger une nouvelle page et générer un nouvel enregistrement dans l'histoire. Utilisation de l'emplacement.replace () ne générera plus de nouveaux enregistrements dans les archives historiques.
| hacher | "#contenu" | Renvoie un hachage dans l'URL, pas "" |
| hôte | "www.google.com" | Renvoie le nom du serveur et le numéro de port (le cas échéant) |
| nom d'hôte | "www.google.com" | Renvoie le nom du serveur sans numéro de port |
| href | "www.google.com" | Renvoie l'URL complète de la page actuelle et appelle Assign () |
| cheminée | '' / wileycda / ' | Retour au nom du répertoire |
| port | "8080" | Renvoie le numéro de port, sinon, renvoie une chaîne vide |
| protocole | "Http:" | Retour au protocole utilisé par la page |
| Recherche | "? = javascript" | Renvoie la chaîne de requête, en commençant par un point d'interrogation |
Objet Navigator: une norme de facto utilisée pour identifier les navigateurs, et ses propriétés et méthodes sont principalement utilisées pour détecter les types de navigateurs.
Les autres sont comme des objets historiques (enregistrer des enregistrements historiques) et des objets d'écran (montrant les capacités du client). Étant donné que la programmation en JS n'est pas très efficace, je ne les répéterai pas.
------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------
DOM:
DOM est une API qui est étendue pour HTML basée sur XML, et DOM s'appuie sur les arbres de nœud pour se développer.
Tout d'abord, il est nécessaire d'être clair que le nœud de document est le nœud racine de chaque nœud. Le nœud de document a et un seul nœud enfant, à savoir le HTML (élément de document).
Type de nœud:
Une interface dans DOM1 est implémentée par tous les types de nœuds (nœuds de texte, nœuds d'attribut, nœuds d'élément), et cette interface est implémentée en tant que type de nœud dans JS.
Attribut de nodetype, appartenant à chaque nœud. Indiqué par 12 valeurs numériques, élément - 1, attribut - 2, texte - 3 ...
Attribut nodename, pour le nœud du nœud d'élément, la valeur de nodename est le nom d'étiquette.
Attribut nodevalue, pour le nœud du nœud d'élément, la valeur de nodevalue est nul.
Relation du nœud: chaque nœud a l'attribut ChildNodes, qui enregistre l'objet nodeList (objet de classe Array). Chaque nœud a une propriété ParentNode, pointant vers le nœud parent. Les nœuds dans ChildNodes ont le même parentNode. Utilisez les propriétés précédentes et nuites pour accéder aux nœuds de frères et sœurs. En même temps, ChildNodes [0] == FirstChild, ChildNodes [ChildNodes.Length-1] == LastChild.
Node de fonctionnement: appendChild (), poussez un nœud à la fin de Nodelist et renvoyez le nœud nouvellement ajouté. insertFore (), renvoyez un nœud à l'en-tête de nodeliste et renvoyez un nouveau nœud. RemplaceChild (Newchild, TargetChild), remplace le nœud cible. Le nœud d'origine est toujours dans le document, mais il n'y a pas de lieu. Removechild (Tragetchild), supprime le nœud et l'effet est similaire à RempaceChild (). CLONECHILD (Boolean), lorsque cela est vrai, signifie une réplication complète (le nœud entier et le nœud enfant), FAUX signifie réplication de base.
Type de document:
Représente un document, l'objet de document est une instance de HTMLDDocument (hérité du type de document), représentant toute la page HTML. Dans le même temps, l'objet Douent est également une propriété de l'objet Window, donc il peut être accessible en tant qu'objet global. Document.FirstChild == Html. document.body == corps. document.doctype ---> Référence à <! doctype>. Doucment.Title ---> Title Document.url ---> Location.url.
Trouver des éléments: getElementById (), getElementsByTagName (), getElementsByClassName ().
Écriture de documents: écriture (), writeeln (), open (), close ()
Type d'élément:
getAttribute (), obtenir la fonctionnalité pour la classe, utiliser "class", au lieu de className, et l'attribut de classe peut être obtenu lors de l'utilisation de l'élément.classname.
setAttribute (), définit la fonctionnalité, si la fonctionnalité existe, remplacez-la. Sinon, créez.
RemoveAtTribute () supprime complètement les caractéristiques des éléments.
createElement (), créer un nouvel élément.
Type de texte:
CreateTextNode (), crée des nœuds de texte. Si un nœud de texte est connecté à un nœud compatriote voisin, les deux textes seront connectés sans espaces.
The above article's composition of JavaScript------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------