Wir wissen, dass eine vollständige JavaScript -Implementierung aus drei Teilen bestehen muss: ECMascript (CORE), BOM (Browser -Objektmodell) und DOM (Dokumentobjektmodell).
Heute lerne ich hauptsächlich Bom und Dom.
Bom:
BOM bietet viele Objekte, um auf die Funktionen des Browsers zugreifen zu können, die nichts mit Webseiteninhalten zu tun haben (dies ist das DOM -Geschäft). Derzeit wurde die BOM von W3C in die HTML5 -Spezifikation verschoben.
Fensterobjekt:
Der Kern der BOM repräsentiert eine Instanz des Browsers. Es handelt sich sowohl um JavaScript als auch eine Schnittstelle, die auf das Browserfenster zugreift, als auch über ein von ECMascript angegebenes globales Objekt. Dies bedeutet, dass jedes auf der Webseite definierte Objekt, Variable und Funktionen als globales Objekt ein Fenster enthält und daher die Erlaubnis zum Zugriff auf Methoden wie Paressinint () enthält. (Auszug aus der Höhe III). Wenn eine Webseite Frames enthält, hat jeder Frame ein eigenes Fensterobjekt und wird in der Rahmensammlung gespeichert (Index 0 startet, LTR, TTB).
Zunächst sind Variablen und Funktionen in der globalen Ausführungsumgebung alle Gattungen und Methoden von Fensterobjekten. Natürlich gibt es einen kleinen Unterschied zwischen globalen Variablen und Fensterattributen, die direkt definiert sind. Globale Variablen (um genau zu sein, sollten sie explizit globale Variablen deklariert werden) können keine Löschung verwenden, während die Fensterattribute in Ordnung sind. Darüber hinaus gibt es ein weiteres Detail, das beachtet wird, dass der Versuch, auf nicht deklarierte Variablen zuzugreifen, fehlerhaft ist, es gibt jedoch kein Problem, wenn es darum geht, die Objekte für Abfragen zu verwenden.
Was sind also die gängigen Eigenschaften oder Methoden des Fensters?
1.Name, jedes Fensterobjekt hat ein Namensattribut, das den Namen des Rahmens enthält. Normalerweise um Fensterbeziehungen und Frameworks zu verstehen.
2. Fensterpositionsmethode: Moveto (x -Koordinate der neuen Position, Y -Koordinate der neuen Position), MoveBy (horizontale Bewegung X, vertikale Bewegung y). Diese beiden Methoden gelten nicht für das Framework.
3.. In Chrom geben innere und äußere beide die Größe des Aussichtsbereichs zurück.
Natürlich können Sie die Fenstergröße durch Resizeto ändern (neue Fensterbreite, neue Fensterhöhe), den Größenabschnitt (bis zur ursprünglichen Breite und erhöhen Sie y im Vergleich zur ursprünglichen Höhe). Diese Liebesliedmethode gilt nicht für die Framework -Struktur.
4.Window.open (URL, Fensterziel, Funktionszeichenfolge, ob die neue Seite den Booleschen der aktuell geladenen Seite im Browser -Verlauf ersetzt) zum Navigieren zu einer bestimmten URL oder zum Öffnen eines neuen Fensters. Wenn das Fensterziel angegeben ist und das Fensterziel der Name eines vorhandenen Fensters oder Rahmens ist, wird die angegebene URL in das Fenster oder einen Rahmen geladen, das in der Lage ist. Andernfalls wird das neue Fenster, das sich öffnet, als Zielfenster benannt. Natürlich sind die Schlüsselwörter, die Fensterziele angeben können, _self, _parent, _top, _blank.
<a href = // www.vevb.com> klicken Sie auf mich </a> <script> var link = document.getElementsByTagName ("a") [0]; alert (link.nodename); window.onload = function () {link.onclick = function () {window.open (link.href, "good", "width = 400px, height = 300px"); false zurückgeben; }} </scriptDie spezifischen Einstellungen der Feature -Zeichenfolge sind hier nicht detailliert. Wenn Sie interessiert sind, können Sie hier klicken
5. Als Sprache mit einem Threaden ermöglicht JS weiterhin Zeitüberschreitungswerte (Codeausführung nach dem angegebenen Ereignis) und Intervallzeitwerte (einmal in jeder angegebenen Zeit), um die Codeausführung in einem bestimmten Zeitpunkt zu planen.
Timeout Call: SetTimeout (JS -Code -Zeichenfolge, Millisekundenzeit). Als einsthread-Sprache kann die JS-Task-Warteschlange nur jeweils einen Code ausführen. Wenn die Task -Warteschlange nach dem festgelegten Zeitintervall leer ist, wird die Codezeichenfolge ausgeführt. Andernfalls müssen Sie warten, bis der vorherige Code vor der Ausführung ausgeführt wird.
var al = setTimeout (function () {alert ("good");}, 5000); Alarm (al); // 2Hier rief ich nach 5 Sekunden eine anonyme Funktion an, um gut auszugeben. Im Fenster tauchte ein Warnbox auf, um 2. zu zeigen. Es ist zu sehen, dass die Funktion setTimeout () eine numerische ID zurückgibt, die eindeutig ist. Dann können wir den Timeout -Anruf über diese ID löschen und Clearimeout (ID) verwenden, um sie zu löschen.
Indirekter Anruf: setInterval (), die Parameter, die es akzeptiert, sind die gleichen wie setTimeout (), und gibt auch eine numerische ID zurück und wird mit Clearimeout () gelöscht.
6. Dialogfeld des Systems Dialogfeld Methoden: alert (), bestätigen (), Eingabeaufforderung () usw. werden in meinem vorherigen Blog geschrieben. Klicken Sie hier
Standortobjekt
Anstatt ein Objekt in der BOM zu sein, ist der Ort eine Eigenschaft im Fensterobjekt. Natürlich ist es auch Eigentum des Dokumentobjekts im DOM, das später erörtert wird. Das heißt, window.location und document.location beziehen sich auf dasselbe Objekt.
Das Ändern dieser Attribute für den Standortobjektattribut kann eine neue Seite geladen und einen neuen Datensatz im Verlauf generieren. Verwenden von Location.Replace () generiert keine neuen Aufzeichnungen mehr in historischen Aufzeichnungen.
| Hash | "#Inhalt" | Gibt Hash in URL zurück, nicht "" " |
| Gastgeber | "www.google.com" | Gibt den Servernamen und die Portnummer zurück (falls vorhanden) |
| Hostname | "www.google.com" | Gibt den Servernamen ohne Portnummer zurück |
| href | "www.google.com" | Gibt die vollständige URL der aktuellen Seite zurück und ruft zu ordnungsgemäß () zurück |
| Pfadname | ''/wileycda/'' | Kehren Sie zum Verzeichnisnamen zurück |
| Hafen | "8080" | Gibt die Portnummer zurück, wenn nicht, gibt eine leere Zeichenfolge zurück |
| Protokoll | "Http:" | Kehren Sie zu dem von der Seite verwendeten Protokoll zurück |
| Suchen | "? = JavaScript" | Gibt die Abfragezeichenfolge zurück, beginnend mit einem Fragezeichen |
Navigator -Objekt: Ein De -facto -Standard zur Identifizierung von Browsern und seine Eigenschaften und Methoden werden hauptsächlich zum Erkennen von Browsertypen verwendet.
Der Rest sind wie Geschichtsobjekte (historische Aufzeichnungen speichern) und Bildschirmobjekte (Anzeigen von Client -Funktionen). Da das Programmieren in JS nicht sehr effektiv ist, werde ich sie nicht wiederholen.
------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------
DOM:
DOM ist eine API, die für HTML basierend auf XML erweitert wird, und DOM stützt sich auf die Erweiterung von Knotenbäumen.
Zunächst muss klar sein, dass der Dokumentknoten der Stammknoten jedes Knotens ist. Der Dokumentknoten hat und nur ein untergeordneter Knoten, nämlich das HTML (Dokumentelement).
Knotenentyp:
Eine Schnittstelle in DOM1 wird von allen Knotentypen (Textknoten, Attributknoten, Elementknoten) implementiert, und diese Schnittstelle wird als Knotentyp in JS implementiert.
Nodetyp -Attribut, im Besitz jedes Knotens. Bezeichnet durch 12 numerische Werte, Element-1, Attribut-2, Text-3 ...
Das Nodhename -Attribut für Elementknotenknoten ist der Wert von KnodeName der Labelname.
NodeValue -Attribut für Elementknotenknoten ist der Wert von NodeValue NULL.
Knotenbeziehung: Jeder Knoten hat das Childnodes -Attribut, das das Objekt des Nodelist (Class Array Object) speichert. Jeder Knoten hat eine ParentNode -Eigenschaft, die auf den übergeordneten Knoten zeigt. Die Knoten in Childnodes haben den gleichen Elternteil. Verwenden Sie die Eigenschaften des Vorgangs und Nextsibling, um auf Geschwisterknoten zuzugreifen. Gleichzeitig Childnodes [0] == FirstChild, Childnodes [Childnodes.Length-1] == LastChild.
Operationsknoten: appendChild (), drücken Sie einen Knoten bis zum Ende der Nodelist und geben Sie den neu hinzugefügten Knoten zurück. InsertBefore (), geben Sie einen Knoten an den Nodelist -Header ohne Schaltung zurück und geben Sie einen neuen Knoten zurück. AustauschChild (NewChild, TargetChild) ersetzt den Zielknoten. Der ursprüngliche Knoten befindet sich noch im Dokument, aber es gibt keinen Ort. Removechild (Tragetchild) entfernt den Knoten, und der Effekt ähnelt dem AustauschChild (). Clonechild (boolean) bedeutet, wenn wahr ist, eine vollständige Replikation (der gesamte Knoten und den untergeordneten Knoten), falsche bedeutet grundlegende Replikation.
Dokumenttyp:
Repräsentiert ein Dokument, das Dokumentobjekt ist eine Instanz von htmlddocument (vom Dokumenttyp geerbt), das die gesamte HTML -Seite darstellt. Gleichzeitig ist das Douent -Objekt auch eine Eigenschaft des Fensterobjekts, sodass es als globales Objekt zugegriffen werden kann. document.Firstchild == html. document.body == Körper. document.docType ---> Verweis auf <! docType>. doucment.title ---> title document.url ---> location.url.
Finden Sie Elemente: GetElementById (), GetElementsByTagName (), GetElementsByClassName ().
Schreiben von Dokumenten: write (), writeeln (), open (), close ()
Elementtyp:
GetAtTribute (), die Funktion für die Klasse erhalten, "Klasse" anstelle von Klassenname verwenden, und das Klassenattribut kann erhalten werden, wenn Element.ClassName verwendet wird.
setAttribute () setzt die Funktion fest, wenn die Funktion vorhanden ist, ersetzen Sie sie. Ansonsten erstellen.
removeTtribute () beseitigt die Elementeigenschaften vollständig.
createLement (), erstellen Sie ein neues Element.
Texttyp:
createTextNode () erstellt Textknoten. Wenn ein Textknoten mit einem benachbarten Landsmannknoten verbunden ist, werden die beiden Texte ohne Leerzeichen verbunden.
Die Komposition von JavaScript durch den obigen Artikel --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------