1. Problem der Elementsuche
1. Dokument.all [Name]
(1) Bestehendes Problem: Firefox unterstützt Dokument nicht. Alle [Name]
(2) Lösung: Verwenden Sie GetElementsByName (Name), GetElementById (ID) usw., um es zu ersetzen.
2. Problem des Sammelnobjekts
(1) vorhandenes Problem: IE kann () bei Verwendung vieler Sammlungsklassenobjekte verwenden, aber nur [] kann in Firefox verwendet werden.
Zum Beispiel: In IE kann document.Forms ("Formname") verwendet werden, um ein Formular mit dem Namen "Formname" zurückzugeben, aber es funktioniert nicht in Firefox.
(2) Lösung: Verwenden Sie [], im obigen Beispiel können Sie in document.Forms ["Formname" ändern].
3. Die ID des HTML -Elements ist in JavaScript sichtbar
(1) vorhandenes Problem: Die ID im HTML -Element in IE kann direkt als variabler Name des untergeordneten Objekts des Dokuments verwendet werden. Nicht in Firefox verfügbar.
(2) Lösung: Verwenden Sie GetElementById ("IDName") anstelle von IDNAME als Objektvariable.
4. Eval (IDName) Ruft das Objekt ab
(1) vorhandenes Problem: In IE kann die Verwendung von Eval (IDName) HTML -Objekte mit IDName erhalten, kann jedoch nicht in Firefox verwendet werden.
(2) Lösung: Verwenden Sie GetElementById (idName) anstelle von Eval (idName).
5. Der variable Name entspricht der HTML -Objekt -ID
(1) Bestehendes Problem: In Firefox können Sie denselben Variablennamen wie die HTML -Objekt -ID, die in IE nicht verwendet werden kann, nicht der Name des HTML -Objekts wie die HTML -Objekt -ID verwendet werden.
(2) Lösung: Wenn Sie Variablen deklarieren, fügen Sie VAR hinzu, um Unklarheiten zu vermeiden, damit sie auch in IE normal ausgeführt werden kann. Darüber hinaus ist es am besten, nicht den gleichen variablen Namen wie die HTML -Objekt -ID zu nehmen, um Fehler zu reduzieren.
HINWEIS: 3, 4 und 5 gehören zu derselben Kategorie von Problemen.
6. Rahmen
(1) Bestehendes Problem: In IE können Sie Window.top.frameid und window.top.frameName verwenden, um das vom Bild dargestellte Fenster zu erhalten. Nur Window.Top.FramEname kann in Firefox verwendet werden.
(2) Lösung: Setzen Sie die ID und den Namen des Frame auf denselben und verwenden Sie Window.Top.FramEname, um auf den Frame zuzugreifen.
2. DOM -Betrieb
1. Stellen Sie den Textinhalt des Elements fest.
.
(2) Lösung: Wenn der Textinhalt keine Sonderzeichen wie "<" und ">" enthält, können Sie Innerhtml verwenden. Andernfalls können Sie verwenden:
var Child = Elem.Firstchild; if (Kind! = null) Elem.removechild (Kind); Elem.AppendChild (document.CreateTextNode (Inhalt));
2. Eltern, Eltern
(1) Bestehendes Problem: IE kann Parentelement verwenden, um übergeordnete Knoten zu erhalten, und Eltern. Children können alle untergeordneten Knoten von Knoten erhalten. Firefox unterstützt es nicht.
(2) Lösung: Verwenden Sie ParentNode und Parent.childnodes.
3. Erklärung von Childnodes.
(1) Bestehendes Problem: Die Erklärungen von Kindern in IE und Firefox sind unterschiedlich. IE wird keine leeren Textknoten enthalten, während Firefox einbezieht.
(2) Lösung: Verwenden Sie Childnodes, um Textknoten wie folgt zu filtern:
var Kinder = Elem.Childnodes; für (i = 0; i <childhin.length; i ++) {if (childhin [i] .nodetype! = 3) {// filterte Textknoten // ...}}4. Erläuterung des Dokuments.
.
(2) Lösung: Verwenden Sie GetElementsByName nicht, um Elemente als <eingabe> und <img> zu überprüfen. Wenn Sie ein einzelnes Element erhalten möchten, versuchen Sie, GetElementById zu verwenden.
5. Erläuterung des Dokuments.GetElementById.
(1) Bestehendes Problem: GetElementById in IE überprüft nicht nur das ID -Attribut, sondern überprüft auch das Namensattribut des Namens. Dieses Element wird auch zurückgegeben, wenn das Namensattribut mit dem Parameter übereinstimmt. In Firefox wird nur das ID -Attribut überprüft.
(2) Lösung: Versuchen Sie, die ID zu behalten und gleich zu benennen, und erstellen Sie nicht das Namensattribut eines Elements und das ID -Attribut eines anderen Elements gleich.
III. Ereignisse
1. Event.x und Event.y Ausgaben
(1) Bestehendes Problem: In IE hat das Ereignisobjekt x, y -Attribute, aber nicht in Firefox.
(2) Lösung: In Firefox ist das Äquivalent von Event.x Event.Pagex. Kann verwendet werden:
mx = event.x? event.x: event.pagex;
2. Window.Event
(1) vorhandenes Problem: Verwenden von window.event kann nicht auf Firefox ausgeführt werden
(2) Lösung:
Ursprünglicher Code (kann in IE ausgeführt werden):
<input type = "button" name = "smebutton" value = "subly" onclick = "javaScript: gotOsubmit ()"/> ... <script langer = "javaScript"> Funktion gotOsubmit () {... alert (window.event); // window.event ...} </script> verwendenNeuer Code (kann in IE und Firefox ausgeführt werden):
<input type = "button" name = "smebutton" value = "suruging" onclick = "javaScript: gotOsubmit (Ereignis)"/> ... <script langual = "javaScript"> Funktion GotOSubmit (evt) {evt = evt? EVT: (window.event? window.event: null); ... alarm (evt); // EVT ...} </script> verwenden3.. Anhang und AddEventListener
(1) Bestehendes Problem: IE verwendet AttachEvent, um Ereignisse hinzuzufügen, und Firefox verwendet AddEventListener.
.
if (document.attacheAvent) document.attachEvent ("klicken", clickHandler, false);
sonst document.adDeventListener ("Onclick", ClickHandler);
4. Grammatik
1. Const
(1) vorhandenes Problem: Das CONT -Schlüsselwort kann nicht in IE verwendet werden. Zum Beispiel Constvar = 32; In IE ist dies ein Syntaxfehler.
(2) Lösung: Verwenden Sie CONT nicht und verwenden Sie stattdessen VAR.
2. zusätzliche Kommas
(1) Bestehendes Problem: Das Objekt wörtliche Konstanten in Firefox enthalten viele Kommas, die in IE nicht erlaubt sind. Die folgende Erklärung ist in IE illegal.
var obj = {'key': 'aaa',}
(2) Lösung: Entfernen Sie die überschüssigen Kommas.
5. xml
1. Erstellen Sie xmlhttprequest
(1) Vorhandene Probleme: Firefox verwendet XMLHTTPREQUEST, dh ActiveXObject.
(2) Lösung:
if (window.xmlhttprequest) {req = new XmlHttpRequest (); } else if (window.activeXObject) {req = new ActiveXObject ("microsoft.xmlhttp"); }2. Erstellen Sie ein DOM
(1) Bestehendes Problem: Firefox und dh erstellen DOMs unterschiedlich.
(2) Lösung:
Funktion createxmldom () {var oxmldom; if (window.activeXObject) {// ie oxmldom = new ActiveXObject ("microsoft.xmldom"); } else {// Firefox oxmldom = document.implementation.createdocument ("", "", null); }}3. Laden Sie XML
(1) Bestehendes Problem: Wenn Sie externe Dateien laden möchten, dh und Firefox, können Sie es verwenden:
oxmldom.async = false; // Dies ist in Firefox notwendig
oxmldom.load ("test.xml");
Sie laden jedoch XML -Zeichenfolgen auf unterschiedliche Weise. Sie können oxmldom.loadxml ("<root> <kind/> </root>") in IE direkt verwenden, während Firefox DomParser verwenden muss:
var oprarser = new domparser ();
var oxmldom = oparser.parsefromstring ("<root/>", "text/xml");
(2) Lösung: Die bessere Methode besteht darin, das von Firefox erzeugte XMLDOM -Methode hinzuzufügen:
if (isfirefox) {// erfordert die Browsererkennung
Document.Prototype.loadxml = Funktion (sxml) {var oparser = new DomParser (); var oxmldom = oparser.parsefromstring (SXML, "text/xml"); während (this.Firstchild) this.removechild (this.Firstchild); für (var i = 0; i <oxmldom.childnodes.length; i ++) {var OneWnode = this.importnode (oxmldom.childnodes [i], true); this.AppendChild (OneWnode); }}}Auf diese Weise kann die LOADXML -Methode in IE und Firefox aufgerufen werden.
4. XPath -Unterstützung
(1) Vorhandene Probleme: In IE können Sie die Selectnodes von XMLDOM direkt verwenden, um Knoten basierend auf der XPath -Darstellung auszuwählen. Firefox ist komplizierter und erfordert die Verwendung von Xpathevaluator.
Dh:
var lstnodes = oxmldom.documentElement.selectnodes ("Mitarbeiter/Name"); für (var i = 0; i <lstnodes.length; i ++) {alert (lstnodes [i] .Firstchild.nodeValue); }Firefox:
var oevaluator = neuer xpathevaluator (); var oresult = oevaluator.evaluate ("Mitarbeiter/Name", oxmldom.documentElement, null, xpatheResult.Ordereded_node_iterator_type, null); var oelement = oresult.IterateNext (); while (oelement) {alert (oelement.firstchild.nodeValue); oelement = oresult.IterateNext (); }(2) Lösung: Eine bessere Methode zum Hinzufügen von SelectNodes -Methoden zum Firefox -Element.
if (isFirefox) {// Der Browser muss Element.Prototype.Selectnodes = Funktion (SXPath) {var oevaluator = new Xpathevaluator () erkennen; var oresult = oevaluator.evaluate (sxpath, this, null, xpatheResult.Ordered_node_iterator_type, null); var Anodes = new Array (); if (oresult! while (oelement) {anodes.push (oelement); oelement = oresult.IterateNext (); }} return Anoden; }}Auf diese Weise kann die SelectNodes -Methode sowohl in IE als auch in Firefox aufgerufen werden.
5. XSLT -Unterstützung
(1) Bestehendes Problem: In IE können Sie die TransferNode -Methode von XMLDOM in HTML umwandeln, während Firefox XSLTProcessor verwenden muss.
Dh:
oxmldom.load ("Mitarbeiter.xml"); oxsldom.load ("Mitarbeiter.xslt"); var sresult = oxmldom.transformNode (oxsldom);Firefox:
var oprocessor = new XSLTPROCESSOR (); oprocessor.importStylesheet (oxsldom); var oresultdom = oprocessor.transformTodocument (oxmldom); var oserializer = new XmlSerializer (); var sxml = oserializer.SerializeToString (Oresultdom, "text/xml"); Alarm (SXML);
(2) Lösung: Eine bessere Möglichkeit, dem Firefox -Knoten eine Transfernode -Methode hinzuzufügen.
if (isFirefox) {// Der Browser muss node.prototype.transformNode = function (oxSldom) {var oprocessor = new Xsltprozessor () erfassen; oprocessor.importStylesheet (oxsldom); var oresultdom = oprocessor.transformTodocument (oxmldom); var oserializer = new XmlSerializer (); var sxml = oserializer.SerializeToString (Oresultdom, "text/xml"); return sxml; }}Auf diese Weise kann die TransferNode -Methode sowohl in IE als auch in Firefox aufgerufen werden.
Das obige ist eine Zusammenfassung der Browser-kompatiblen JS-Schreibmethode. Ich hoffe, dass es für das Lernen aller hilfreich sein wird.