1. Finden Sie die Elemente:
document.getElementById ("id"); Finden Sie nach ID und finden Sie höchstens eins;
var a = docunment.getElementById ("id"); Platzieren Sie das gefundene Element in die Variable;
document.getElementsByName ("Name"); Nach dem Namen finden, und das Array wird gefunden;
document.getElementsByTagName ("Name"); Finden Sie das Array nach dem Tag -Namen.
document.getElements byclassName ("name") finden nach className, und das Array wird gefunden;
2. Betriebsinhalt:
1. Nicht-Form-Elemente:
(1) Inhalt erhalten:
Alarm (A.innerhtml); Der HTML -Code und der Text im Tag werden erhalten und alle Inhalte im Tag werden erhalten.
Zum Beispiel: Es gibt eine solche DIV im Körper:
<div id = "me"> <b> Versuchen Sie es </b> </div>
Verwenden Sie Innerhtml, um den Inhalt in das DIV in Skript zu erhalten:
var a = document.getElementById ("me");
Alarm (A.innerhtml);
Die Ergebnisse sind wie folgt:
Alarm (A.InnerText); Nehmen Sie den Text nur hinein
Alarm (A.Outerhtml); Enthält den Inhalt des Tags selbst (einfaches Verständnis)
(2) Inhalt festlegen:
A.innerhtml = "<font color = rot> Hallo Welt </font>";
Wenn das Ergebnis wie folgt mit dem Einstellungsinhaltscode folgt, wird der Inhalt im DIV ersetzt:
A.InneText wird den Inhalt so darstellen, wie er ist
Inhalt löschen: Weisen Sie eine leere Zeichenfolge zu
2. Formularelemente:
(1) Es gibt zwei Möglichkeiten, Inhalte zu erhalten:
var t = document.f1.t1; Formformformformular -ID wird mit T1 in F1 eingegeben;
var t = document.getElementById ("id"); Holen Sie es direkt mit ID.
Alarm (T.Value); Ruft den Wertwert in der Eingabe ab;
Alarm (T.innerhtml); Holen Sie sich den Wert hier <textArea> </textArea>;
(2) Inhalt festlegen: t.Value = "Inhaltsänderung";
3. Ein kleiner Wissenspunkt:
<a href = "http://www.baidu.com" onclick = "return false"> wenden Sie sich an baidu </a>; Wenn die Rückkehrflase hinzugefügt wird, wird nicht springen, die Standardeinstellung wird true springen. Gleiches gilt für Tasten. Wenn die Rückgabebastel in der Taste eingestellt ist, wird die Einreichung nicht vorgenommen. Dies kann verwendet werden, um den Einreichungssprung zu steuern.
3. Betriebseigenschaften
Verwenden Sie zunächst die ID des Elements, um das Element zu finden und in einer Variablen zu speichern:
var a = document.getElementById ("id");
Dann können Sie die Eigenschaften des Elements betreiben:
A.SetatTribute ("Attributname", "Attributwert"); Setzen Sie ein Attribut, fügen Sie es hinzu oder ändern Sie es.
A.GetAttribute ("Attributname"); Holen Sie sich den Wert des Attributs;
A. removeAttribute ("Attributname"); Entfernen Sie ein Attribut.
Beispiel 1: Machen Sie eine Frage. Wenn die Eingabeantwort korrekt ist, wird sie korrekt angezeigt, und der Fehler wird Fehler angezeigt.
Hier ist ein in dem Text geschriebenes Daan -Attribut, das den Antwortwert enthält. Wenn Sie auf die Antwort klicken, um die Antwort zu überprüfen, entspricht der Inhaltseingang durch Cheak die gleiche wie die Antwort:
Code im Körper:
<form> In welchem Jahr war die Gründung der Republik China? <Eingabe type = "text" daan = "1912" value = "" id = "t1" name = "t1" /> <Eingabe type = "button" onclick = "check ()" id = "t2" name = "t2" value = "prüfen die Antwort" /> < /Form>
Code in JS:
Funktion check () {var a = document.getElementById ("t1"); var a1 = a.Value; var a2 = a.getAttribute ("Daan"); if (a1 == a2) {alert ("Herzlichen Glückwunsch zum richtigen Antworten!"); } else {alert ("Idiot!"); }}Ergebnisse, wenn die Antwort korrekt ist:
Beispiel 2: Die Taste vereinbart, Countdown auf 10 Sekunden, die Taste vereinbart wird eingereicht. Hier wird das Operation Attribut: Deaktiviert verwendet, um den Status der Schaltfläche zu ändern. Wenn deaktiviert = "deaktiviert" ist nicht verfügbar.
Code im Körper:
<form> <Eingabe type = "Senden" id = "b1" name = "b1" value = "stireal (10)" deaktiviert = "deaktiviert" /> < /form>
Code in JS:
var n = 10; var a = document.getElementById ("B1"); Funktion bian () {n--; if (n == 0) {a.removeAttribute ("deaktiviert"); A.Value = "stimmen"; zurückkehren; } else {a.Value = "vereinbart ("+n+")"; window.settimeout ("Bian ()", 1000); }} window.settimeout ("bian ()", 1000);Ergebnisse des Laufs:
4. Betriebsstil
Verwenden Sie zunächst die ID des Elements, um das Element zu finden und in einer Variablen zu speichern:
var a = document.getElementById ("id");
Dann können Sie die Eigenschaften des Elements betreiben:
A. ; Betreiben Sie die Eigenschaften dieses ID -Stils.
Der Stil ist ein Stil in CSS und alle Stile können mit Code betrieben werden.
document.body.style.backgroundcolor = "color"; Hintergrundfarbe des gesamten Fensters.
Betriebsklasse: a.classname = "className in Style Sheet" betreibt eine Reihe von Stilen
Beispiel 1: Automatisches und manuelles Umschalten von Anzeigebildern;
Der Code im Körper, um ein DIV mit Hintergrundbild- und Kontrollobjekten auf beiden Seiten zu erstellen:
<div id = "tuijian" style = "Hintergrund-Image: URL (IMGE/TJ1.JPG);"> <div id = "p1" onclick = "dodo (-1)"> </div> <div> </div> id = "p2" onclick = "dodo (1)"> </div> </div> </div> </div> </div> </div> </div> </div> </div> </div>
Code in Stylesheet:
<style type = "text/css"> *{margin: 0px auto; Polsterung: 0px; Schriftfamilie: "Microsoft Yahei"; } #tuijian {width: 760px; Höhe: 350px; Hintergrundrepeat: No-Repeat; } .pages {top: 200px; Hintergrundfarbe:#000; Hintergrundposition: Zentrum; Hintergrundrepeat: No-Repeat; Opazität: 0,4; Breite: 30px; Höhe: 60px; } #p1 {Hintergrund-Image: URL (iMges/prev.png); float: links; Rand: 150px 0px 0px 10px; } #p2 {Hintergrund-Image: URL (IMGES/Next.png); float: rechts; Rand: 150px 10px 0px; } </style>Der Code in JS ruft hauptsächlich alle 3 Sekunden die Funktion huan () auf, um den Stil des Hintergrundbildes zu ändern. Wenn Sie auf den linken und rechten Schalter klicken, wird er manuell umgeschaltet und der automatische Schalter stoppt:
<script Language = "javaScript"> var jpg = new Array (); jpg [0] = "url (iMges/tj1.jpg)"; jpg [1] = "url (iMges/tj2.jpg)"; if (xb == jpg.length) {xb = 0; } tjimg.style.backgroundimage = jpg [xb]; if (n == 0) {var id = window.settimeout ("huan ()", 3000); }} Funktion Dodo (m) {n = 1; xb = xb+m; if (xb <0) {xb = jpg.length-1; } else if (xb> = jpg.length) {xb = 0; } tjimg.style.backgroundimage = jpg [xb]; } window.settimeout ("huan ()", 3000); </script>Der Effekt ist wie folgt:
5. Verwandte Elementoperationen:
var a = document.getElementById ("id"); finde a;
var b = a.nextsibling, finde das nächste Peer -Element von a, achten Sie auf die enthaltenen Räume;
var b = a.previoussibling, finde das vorherige Peer -Element von a, achten Sie auf die enthaltenen Räume;
var b = a.parentnode, das vorherige übergeordnete Element von a finden;
var b = a.childnodes, das Array wird gefunden, und das nächste untergeordnete Element von A wird gefunden;
var b = A.Firstchild, das erste untergeordnete Element, lastChild Last, Childnodes [n] Finden Sie die Anzahl der ersten;
alarm (Knoten [i] Instanz des Textes); Bestimmen Sie, ob es sich um Text handelt, gibt true, nicht Flase zurück, verwenden Sie, ob der Wert falsch ist, und Sie können Räume entfernen.
6. Erstellung, Ergänzung und Löschen von Elementen:
var a = document.getElementById ("id"); finde a;
var obj = document.createelement ("Tag -Name"); Erstellen Sie ein Element
obj.innerhtml = "Hallo Welt"; Beim Hinzufügen müssen Sie zuerst ein Element erstellen.
A.Appendchild (OBJ); fügen Sie ein untergeordnetes Element zu a hinzu.
A.removechild (OBJ); Löschen Sie ein untergeordnetes Element.
A.gewählteIndex in der Liste: die Anzahl der ausgewählten;
//a.options?a.Selectindex] Entfernen Sie das Option Objekt aus dem Index gemäß dem Index.
7. Stringoperation:
var s = new String (); oder var s = "aaaa";
var s = "Hallo Welt";
Alert (S.TolowerCase ()); zu Kleinbuchstaben touppercase () in Großbuchstaben
Alert (substring (3,8)); Abfangen von der dritten Position zur achten Position
Alert (S.Substr (3,8)); beginnt aus der dritten Position abzufangen, acht Zeichen lang abzufangen und nicht die folgenden Zahlen bis zum Ende zu schreiben.
S.Split (''); Zerlegen Sie die Charaktere nach den angegebenen Zeichen, setzen Sie sie in ein Array und sortieren Sie sie automatisch
S.Length ist die Eigenschaft
S.Intexof ("Welt"); Welt der Welt in der Saite kehrt nicht -1 zurück
s.lastindexof ("o"); o, wo das letzte Vorkommen von s.lastindexof ("o"); o in der Saite
8. Datums- und Uhrzeitbetrieb
var d = neues Datum (); Aktuelle Zeit
D.setfoulyear (2015,11,6);/*Subtrahieren Sie 1 Einstellung in dem Monat, in dem Sie einstellen möchten*/
D.Getingvoll: Nehmen Sie das Jahr;
D.GetMonth (): Nehmen Sie den Monat, und je weniger Sie erhalten, werden herausgenommen;
D.GetDate (): Nimm den Himmel;
D.Getay (): Nehmen Sie den Wochentag
D.Gethours (): Nehmen Sie die Stunde;
D.GetMinutes (): Minuten nehmen; D.GetSeconds (): Nehmen Sie sich Sekunden
D.setfoulyear (): Legen Sie das Jahr fest und achten Sie auf -1, wenn Sie den Monat festlegen.
9. Betrieb mathematischer Funktionen
Math.ceil (); Die kleinste Ganzzahl größer als die aktuelle Dezimalzahlung
Math.floor (); Die größte Ganzzahl der aktuellen Dezimalzahl der kleinen Fische
Math.sqrt (); Offenes Quadrat
Math.round (); runden(); runden
Math.random (); Zufallszahl zwischen 0-1 und
10. Einige Tipps
Doppelte Zitate draußen und Doppelzitate im Inneren werden in einzelnen Zitate geändert.
Beim Einstellen der Zeilenhöhe in der DIV, unabhängig von der Einstellung der Einstellung, befindet sich die besetzte Reihe standardmäßig in der mittleren Position (die Mitte der oberen und unteren Bereiche der Div - [Standard] vertikal zentriert).
Der Wert aus dem Textfeld ist eine Zeichenfolge und muss unter Verwendung von ParseInt () in eine Zahl konvertiert werden.
S.Match (Reg); s repräsentiert eine Zeichenfolge, Reg repräsentiert eine Zeichenfolge und die beiden übereinstimmen. Wenn die beiden Saiten nicht übereinstimmen, wird ein Null zurückgegeben.
Die obige detaillierte Erläuterung des JavaScript-Dom-Operation-Window.Document-Objekts ist der gesamte Inhalt, den ich mit Ihnen teile. Ich hoffe, Sie können Ihnen eine Referenz geben und ich hoffe, Sie können wulin.com mehr unterstützen.