Unterschiede in der JavaScript -Syntax zwischen IE und Firefox

Obwohl der Zeitraum in JavaScript von JavaScript in der Verwendung langwieriger und nerviger Codeblöcke für bestimmte Browser beendet ist, ist es weiterhin erforderlich, gelegentlich einfache Codeblöcke und Objekterkennung zu verwenden, um sicherzustellen, dass ein Code ordnungsgemäß auf Benutzermaschinen funktioniert.

In diesem Artikel werde ich kurz die 7 verschiedenen Aspekte der JavaScript -Syntax zwischen Internet Explorer und Firefox beschreiben.

1. CSS -Attribut "Float"

Die grundlegende Syntax zum Erhalten eines spezifischen CSS -Attributs eines bestimmten Objekts ist das Objektstil -Attribut, und Attribute mit Bindestrein sollten durch die Kamelnomenklatur ersetzt werden. Um beispielsweise die Hintergrundfarbe eines DIV mit ID "Header" zu erhalten, müssen wir die folgende Syntax verwenden:

Die Codekopie lautet wie folgt: Document.GetElementById ("Header"). Style.borderbottom = "1px Solid #CCC";

Da "Float" jedoch ein reserviertes Wort für JavaScript ist, können wir Object.Style.float nicht verwenden, um das Attribut "Float" zu erhalten. So verwenden wir es in zwei Browsern:

Dh Syntax:

Die Codekopie lautet wie folgt: document.getElementById ("Header"). Style.Stylefloat = "links";

Firefox -Syntax:

Die Codekopie lautet wie folgt: document.getElementById ("Header"). Style.cssfloat = "links";

2. Elementberechnungsstil

Durch die Verwendung des obigen Objekts.Style.Property kann JavaScript den CSS -Stil des Objekts problemlos erhalten und ändern. Die Einschränkung dieser Syntax besteht jedoch darin, dass sie nur Inline -Stile in HTML erhalten oder JavaScript direkt verwenden kann, um Stile festzulegen. Das Style -Objekt kann Styles mit einem externen Stylesheet nicht einstellen. Um den "berechneten Stil" des Objekts zu erhalten, verwenden wir den folgenden Code:

Dh Syntax:

 var myObject = document.getElementById ("Header"); var mystyle = myObject.currentStyle.backgroundColor;

Firefox -Syntax:

 var myObject = document.getElementById ("Header"); var mycomputedStyle = document.defaultView.getComputedStyle (MyObject, Null); var mystyle = mycomputedstyle.backgroundColor;

3. Holen Sie sich das Attribut "Klasse" des Elements

Ähnlich wie beim Attribut "Float" verwenden die beiden Browser unterschiedliche JavaScript -Methoden, um dieses Attribut zu erhalten.

Dh Syntax:

 var myObject = document.getElementById ("Header"); var myattribute = myObject.getAttribute ("className");

Firefox -Syntax:

 var myObject = document.getElementById ("Header"); var myattribute = myObject.getAttribute ("Klasse");

4. Holen Sie sich das Attribut "für" des Etiketts

Wie bei 3 gibt es verschiedene Syntaxen, die JavaScript verwenden, um das Attribut "für" für eine Etikett zu erhalten.

Dh Syntax:

 var myObject = document.getElementById ("mylabel"); var myattribute = myObject.getAttribute ("htmlfor");

Firefox -Syntax:

 var myObject = document.getElementById ("mylabel"); var myattribute = myObject.getAttribute ("for");

Die gleiche Syntax gilt auch für die SetAttribute -Methode.

5. Holen Sie sich die Cursorposition

Es ist selten, die Cursorposition eines Elements zu erhalten. Wenn Sie dies tun müssen, ist auch die Syntax von IE und Firefox anders. Dieser Beispielcode ist sehr grundlegend und wird im Allgemeinen im Rahmen einer vielen komplexen Ereignisverarbeitung verwendet und wird nur zur Beschreibung der Unterschiede hier verwendet. Es ist zu beachten, dass sich die Ergebnisse in der IE von denen in Firefox unterscheiden, daher hat diese Methode einige Probleme. Normalerweise kann dieser Unterschied durch die Erhöhung der "Bildlaufposition" kompensiert werden - aber das ist Gegenstand eines anderen Artikels.

Dh Syntax:

 var myCursorposition = [0, 0]; MyCursorposition [0] = Ereignis.ClientX; MyCursorposition [1] = Ereignis.Clienty;

Firefox -Syntax:

 var myCursorposition = [0, 0]; MyCursorposition [0] = Ereignis.Pagex; MyCursorposition [1] = Ereignis.pagey;

6. Holen Sie sich die Größe des Fensters oder Browserfensters

Manchmal ist es notwendig, die Größe des effektiven Fensterraums des Browsers herauszufinden, was normalerweise ein "Fenster" ist.

Dh Syntax:

 var mybrowserSize = [0, 0]; MyBrowserSize [0] = document.documentElement.clientwidth; myBrowserSize [1] = document.documentElement.clientHeight;

Firefox -Syntax:

 var myBrowserSize = [0, 0]; MyBrowserSize [0] = Fenster.innernwidth; MyBrowserSize [1] = Fenster.

7. Alpha transparent

Dies ist eigentlich kein Syntaxprojekt für JavaScript - Alpha -Transparenz wird durch CSS eingestellt. Wenn das Objekt jedoch so eingestellt ist, dass sie durch JavaScript ein- und ausblenden, muss dies erreicht werden, indem die Alpha -Einstellungen des CSS erhalten werden, die sich im Allgemeinen innerhalb der Schleife befinden. Um den CSS -Code mit dem folgenden JavaScript zu ändern:

Dh Syntax:

 #MyElement {Filter: alpha (opacity = 50);}

Firefox -Syntax:

 #MyElement {Opazität: 0,5;}

Um diese Werte mit JavaScript zu erhalten, müssen Sie ein Stilobjekt verwenden:

Dh Syntax:

 var myObject = document.getElementById ("myelement"); myObject.style.Filter = "alpha (opacity = 80)";

Firefox -Syntax:

 var myObject = document.getElementById ("myelement"); myObject.style.opacity = "0,5";

Natürlich wurde erwähnt, dass es im Allgemeinen die Opcity/Alpha in der Mitte einer Schleife ändern soll, um Animationseffekte zu erstellen. Dies ist jedoch ein einfaches Beispiel, um klar zu beschreiben, wie die Methode implementiert wird.

Es gibt 7 verschiedene Punkte in der JavaScript -Syntax in Bezug auf JavaScript. Ich hoffe, es wird für das Lernen aller hilfreich sein.