Home
Web Front-end
JS Tutorial
Summary of Firefox and IE compatibility issues and solutions_javascript skills
Web Front-end
JS Tutorial
Summary of Firefox and IE compatibility issues and solutions_javascript skills
Summary of Firefox and IE compatibility issues and solutions_javascript skills
firefox
ie
compatibility
In the process of developing multi-language Java websites, I found a lot of codes that can run normally in FF, but not in IE, and vice versa. The incompatibilities and unification methods between IE and Firefox (Firefox) in JavaScript are summarized as follows:
1. Compatible with firefox’s outerHTML, there is no outerHtml method in FF
Copy code The code is as follows:
if (window.HTMLElement) {
HTMLElement.prototype.__defineSetter__("outerHTML" ,function(sHTML) {
var r=this.ownerDocument.createRange();
r.setStartBefore(this);
var df=r.createContextualFragment(sHTML);
this.parentNode. replaceChild(df,this);
return sHTML;
});
HTMLElement.prototype.__defineGetter__("outerHTML",function() {
var attr;
var attrs =this.attributes;
var str="<" this.tagName.toLowerCase();
for (var i=0;i
return str ">" this.innerHTML "";
});
HTMLElement.prototype.__defineGetter__("canHaveChildren",function( ) {
switch(this.tagName.toLowerCase()) {
case "area":
case "base":
case "basefont":
case "col":
case "frame":
case "hr":
case "img":
case "br":
case "input":
case "isindex":
case "link":
case "meta":
case "param":
return false;
}
return true;
});
}
2. Collection class object problem
Explanation: Under IE, you can use () or [] to obtain collection class objects; under Firefox, you can only use [] to obtain collection class objects. .Solution: Use [] uniformly to obtain collection objects.
3. Custom attribute problem
Explanation: Under IE, you can use the method of obtaining regular attributes. To obtain custom attributes, you can also use getAttribute() to obtain custom attributes; under Firefox, you can only use getAttribute() to obtain custom attributes. Solution: uniformly obtain custom attributes through getAttribute().
4.eval("idName") problem
Explanation: Under IE, you can use eval("idName") or getElementById("idName") to obtain the HTML object whose id is idName; Under Firefox, you can only use getElementById("idName") to obtain the HTML object with the id of idName. Solution: Use getElementById("idName") uniformly to obtain the HTML object with the id of idName.
5 .The problem that the variable name is the same as the ID of an HTML object
Explanation: Under IE, the ID of the HTML object can be used directly as the variable name of the subordinate object of the document; it cannot be used under Firefox. Under Firefox, it can be used The variable name is the same as the HTML object ID; this is not possible under IE. Solution: Use document.getElementById("idName") instead of document.idName. It is best not to use variable names with the same HTML object ID to reduce errors; when declaring variables, always add var to avoid ambiguity.
6.const problem
Explanation: Under Firefox, you can use the const keyword or the var keyword to define constants; under IE, you can only use the var keyword to define constants. Solution: Use the var keyword uniformly to define constants.
7.input.type attribute problem
Explanation: The input.type attribute is read-only under IE; but The input.type attribute under Firefox is read and write.
8.window.event problem
Explanation: window.event can only run under IE, not Firefox This is because Firefox's event can only be used at the site where the event occurs. Solution:
IE:
...
IE&Firefox:
...
