Lassen Sie uns zunächst erklären, die Version meines Testbrowsers lautet Chrome15.0.874.121 Firefox 8.01 IE9 Ietetester
Der folgende Code handelt von der Anweisung
1: Die Rollstange bekommen
Kopieren Sie den Code -Code wie folgt:
Funktion getScroll () {{)
var t, l, w, h;
If (document.documentElement && document.documentedlement.scrolltop) {
t = document.documentElement.scrolltop;
l = document.documentElement.scrollleft;
w = document.documentElement.scrollwidth;
H = Dokument.DocumentElement.ScrollHeight;
}
anders
if (document.body) {
t = document.body.scrolltop;
l = document.body.scrollleft;
w = document.body.scrollwidth;
h = document.body.scrollHeight;
}
Zurückkehren {
T: T,
LL,
W: W,
H: h
};
}
2: Holen Sie sich die Breite des Ansichtsbrowsers
Kopieren Sie den Code -Code wie folgt:
Funktion getPageWidth () {
var pagewidth = window.innnerwidth;
IFOF PAGEWINDTH!
if (document.compatmode == "CSS1Compat") {{{{{{{
pagewidth = document.documentElement.clientwidth;
}
anders {
pagewidth = document.body.clientwidth;
}
}
Rückgabe -Seitenwidth;
}
Funktion getPageHeight () {
var pageHeight = window.innerHeight;
IFOF PAGEWINDTH!
if (document.compatmode == "CSS1Compat") {{{{{{{
pageHeight = document.documentElement.clientHeight;
}
anders {
pageHeight = document.body.clitingHeigh;
}
}
Rückgabe von PageHeight;
}
3: Holen Sie sich den aktuellen Browser -Modellnamen
Kopieren Sie den Code -Code wie folgt:
Function () {
var sys = {};
var ua = navigator.useragent.tolowerCase ();
var S;
(s = ua.match (/msie ([/d.+)/))? /)? (/Opera. (#/D.+)/))? )))))))))))))).
if (sys.ie! = null) {
Return ("dh:" + sys.ie);
}
if (sys.firefox! = null) {
Return ("Firefox:" + sys.firefox);
}
if (sys.chrome! = null) {
Return ("Chrome:" + sys.chrome);
}
if (sys.opera! = null) {
Return ("Opera:" + sys.opera);
}
if (sys.safari! = null) {
Return ("safari:" + sys.safari);
}
}
4: Ereignisüberwachung
Kopieren Sie den Code -Code wie folgt:
Funktion (Element, Typ, Handler) {{{
if (element.addeVentristener) {{{{{{{{{{{{{{{{{{{{{{
Element.AdDeVentListener (Typ, Handler, Falsch);
}
anders
Ifment.attacheAvent) {
Element.attacheAvent ("on" + Typ, Handler);
}
anders {
Element [auf " + Typ] = Handler;
}
}
5: Ereignisentfernung
Kopieren Sie den Code -Code wie folgt:
Funktion (Element, Typ, Handler) {{{
If (element.removeEventListener) {
Element.RemoveEventListener (Typ, Handler, Falsch);
}
anders
ifment.detACHEvent) {
Element.DetACHEvent ("on" + Typ, Handler);
}
anders {
Element ["on" + Typ] = null;
}
}
6: Wenn das Ereignis, wenn das Firefox -Ereignis ständig verteilt ist, wird es Probleme mit dem ersten Vorfall geben.
Kopieren Sie den Code -Code wie folgt:
Funktion (Ereignis) {
Ereignis = (Ereignis? Ereignis: window.event);
if (event == null) {
var $ e = function () {
var c = $ e.caller;
Während (C.Caller)
C = C.Caller;
Rückgabe c.Argumente [0]
};
__DefineGetter __ ("Event", $ e);
}
Rückkehrereignis;
}
7: Verhindern Sie Standardereignisse
Kopieren Sie den Code -Code wie folgt:
Funktion (Ereignis) {
if (event.preventDefault) {
Event.PreventDefault ();
}
anders {
Ereignis.ReturnValue = false;
}
}
8: Verbreiten Sie den Vorfall nicht weiter
Kopieren Sie den Code -Code wie folgt:
Funktion (Ereignis) {
if (Event.StopPropagation) {
Event.StopPropagation ();
}
anders {
event.cancelBubble = true;
}
}
9: Holen Sie sich das Ziel des Ereignisses
Kopieren Sie den Code -Code wie folgt:
Funktion (Ereignis) {
Return event.target ||.
}
10: documen.docType ist mit Unterstützung nicht überein
E: Wenn eine Beschreibung des Dokumenttyps vorliegt, wird er durch einen Fehler als Anmerkung und als Kommentarknoten erklärt.
Firefox: Wenn eine Dokumenttypbeschreibung vorhanden ist, verwenden Sie sie als erste Sub -Node des Dokuments.
Safari, Chrome, Opera: Wenn es eine Beschreibung des Dokumenttyps gibt, wird sie als Erklärung erklärt, wird jedoch nicht in Childnodes als Unterkinder des Dokuments angezeigt.
11: Elemente finden
Manchmal verstehe ich wirklich nicht, was IE immer tut, ich möchte immer einen Unterschied machen. Wenn das System mich nicht durchbrowser lässt, wage ich zu sagen, dass der IE -Anteil weniger sein wird.
Wenn ID und Name gleich sind, wird er auch zurückgegeben
Kopieren Sie den Code -Code wie folgt:
<html>
<kopf>
<Script Defer>
var it item = document.getElementById ("my");
It.Value = "Second";
</script>
</head>
<body>
<Eingabe type = "text" name = "mein" value = "zuerst">
</body>
</html>
In IE ändern sich die Ergebnisse.
Das gleiche ist dh dh, id ist nicht unterschieden
Kopieren Sie den Code -Code wie folgt:
<html>
<kopf>
<Script Defer>
var it item = document.getElementById ("my");
It.Value = "Second";
</script>
</head>
<body>
<Eingabe type = "text" id = "mein" value = "zuerst">
</body>
</html>
Entschuldigung, seine Ergebnisse änderten sich wieder.
12: Wenn es sich um ein benutzerdefiniertes Attribut handelt, ist Element.
Kopieren Sie den Code -Code wie folgt:
Funktion (Element, myatt) {
Gibt es zurück.
}
Im gleichen Fall sollte das Einstellungsattribut wissen, was zu tun ist, dh die Zuordnung.
Kopieren Sie den Code -Code wie folgt:
Funktion (Element, Myatt, Wert) {
item.attributes [myatt].
}
13: Die Anzahl der Sub -Nodes des Elements
Kopieren Sie den Code -Code wie folgt:
<ul id = "myul">
<li> Erstens </li>
<li> Zweiter </li>
<li> dritter </li>
</ul>
Das IE -Ergebnis ist 3 und der andere Browser ist 7.
Das leere Symbol zwischen Knoten ist ein Textknoten in anderen Browsern und das Ergebnis 7. Wenn es so wird,
Kopieren Sie den Code -Code wie folgt:
<ul id = "myul"> <li> Erstens </li> <li> Zweitens </li> <li> dritten </li> </ul>
Auf diese Weise sind alle Ergebnisse 3.
14: Knotenprobleme erstellen
Kopieren Sie den Code -Code wie folgt:
// Dynamisch ein Element hinzufügen, können alle Browser erreicht werden
var newnode = document.createelement ("input");
newnode.type = "button";
newnode.Value = "Sechster";
// Es kann in IE realisiert werden
var newnode = document.createelement ("<Eingabe type =/" Taste/">">);
15: Bei der Abschirmung des rechten Klicks unterscheidet sich Firefox in dem Vorfall mit OncontextMenu.
16: Wenn Sie dynamisch Stil und Skript hinzufügen, sind dh und andere Browser unterschiedlich. Spezifische Überprüfung.
17: Für DOM2 und DOM3 ist die Situation komplizierter.