1.firefox kann innerText nicht unterstützen.
Firefox unterstützt innerHTML, aber nicht innerText. Es unterstützt textContent zur Implementierung von innerText, aber die zusätzlichen Leerzeichen werden standardmäßig ebenfalls beibehalten. Wenn textContent nicht verwendet wird, kann stattdessen innerHTML verwendet werden, wenn die Zeichenfolge keinen HTML-Code enthält.
2. Auswahl von Webinhalten verbieten:
Verwenden Sie im IE im Allgemeinen js: obj.onselectstart=function(){return false;}
Firefox verwendet CSS:-moz-user-select:none
3. Filterunterstützung (Beispiel: transparenter Filter):
IE:filter:alpha(opacity=10);
firefox:-moz-opacity:.10;
4. Ereignis erfassen:
IE: obj.setCapture(), obj.releaseCapture()
Firefox: document.addEventListener("mousemove",mousemovefunction,true);
document.removeEventListener("mousemove",mousemovefunction,true);
5. Mausposition abrufen:
IE: event.clientX, event.clientY
Firefox: Die Ereignisfunktion ist erforderlich, um das Ereignisobjekt
zu übergeben
obj.onmousemove=function(ev){
X=ev.pageX;Y=ev.pageY;
}
6. Grenzprobleme von DIV und anderen Elementen:
Beispiel: Legen Sie das CSS eines div::{width:100px;height:100px;border:#000000 1px solid;}
fest
Im IE: Div-Breite (einschließlich Randbreite): 100 Pixel, Div-Höhe (einschließlich Randbreite): 100 Pixel;
Und Firefox: die Breite des Div (einschließlich der Randbreite): 102 Pixel, die Höhe des Div (einschließlich der Randbreite): 102 Pixel;
Wenn Sie also dieses Ziehfenster erstellen, das mit IE und Firefox kompatibel ist, müssen Sie beim Schreiben von JS und CSS Ihr Gehirn einsetzen. Hier sind zwei Tipps für Sie
1. Bestimmen Sie den Browsertyp:
var isIE=document.all? true:false;
Ich habe eine Variable geschrieben. Wenn die document.all-Syntax unterstützt wird, ist IE=true, andernfalls isIE=false
2. CSS-Verarbeitung unter verschiedenen Browsern:
Zum Beispiel: {border-width:0px!important;border-width:1px;}
Unter Firefox hat dieses Element keinen Rahmen. Unter IE beträgt die Rahmenbreite 1px
1.document.formName.item("itemName") Problem
Lösung: document.formName.elements["elementName"] einheitlich verwenden.
2. Problem mit dem Sammelobjekt
Lösung: Verwenden Sie [] einheitlich, um Sammlungsklassenobjekte zu erhalten.
3. Probleme mit benutzerdefinierten Attributen
Lösung: Erhalten Sie benutzerdefinierte Attribute einheitlich über getAttribute().
4.eval("idName") Problem
Lösung: Verwenden Sie getElementById("idName") einheitlich, um das HTML-Objekt zu erhalten, dessen ID idName ist.
5. Das Problem, dass der Variablenname mit einer HTML-Objekt-ID identisch ist
Problemumgehung: Verwenden Sie document.getElementById("idName") anstelle von document.idName. Es ist am besten, Variablennamen nicht mit derselben HTML-Objekt-ID zu verwenden, um Fehler beim Deklarieren von Variablen zu vermeiden. Fügen Sie immer das Schlüsselwort var hinzu, um Mehrdeutigkeiten zu vermeiden.
6.const-Problem
Lösung: Verwenden Sie das Schlüsselwort var einheitlich, um Konstanten zu definieren.
7.input.type-Attributproblem
Lösung: Ändern Sie das Attribut input.type nicht. Wenn Sie es ändern müssen, können Sie zunächst die ursprüngliche Eingabe ausblenden und dann an derselben Position ein neues Eingabeelement einfügen.
8.window.event-Problem
Lösung: Fügen Sie den Ereignisparameter zu der Funktion hinzu, in der das Ereignis auftritt, und verwenden Sie var myEvent = evt?evt:(window.event?window.event:null)
im Funktionskörper (vorausgesetzt, der formale Parameter ist evt).
Beispiel: