Home >Web Front-end >JS Tutorial >JavaScript multi-browser compatible
Javascript compatible with multiple browsers
1. Document.formName.item("itemName") problem
Problem description: Under IE, you can use document.formName.item("itemName") or document.formName.elements["elementName"] ;Under Firefox, only document.formName.elements["elementName"] can be used.
Solution: Use document.formName.elements["elementName"] uniformly.
2. Collection class object problem
Problem description: 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
Problem description: Under IE, you can use the method of getting regular attributes to get custom attributes, or you can use getAttribute() to get custom attributes; under Firefox, you can only use getAttribute() to get custom attributes Attributes.
Solution: Uniformly obtain custom attributes through getAttribute().
4. eval("idName") problem
Problem description: Under IE, you can use eval("idName") or getElementById("idName") to get the HTML object with the id idName; under Firefox, you can only use getElementById(" idName") to obtain the HTML object with the id idName.
Solution: Use getElementById("idName") uniformly to obtain the HTML object with the id idName.
5. The problem that the variable name is the same as the ID of an HTML object
Problem description: Under IE, the ID of the HTML object can be used directly as the variable name of the subordinate object of the document, but not under Firefox; under Firefox, the same as the HTML object ID can be used The variable name is not available under IE.
Workaround: 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 the var keyword to avoid ambiguity.
6. Const problem
Problem description: 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. Problem with input.type attribute
Problem description: The input.type attribute under IE is read-only; but the input.type attribute under Firefox is read-write.
Solution: Do not modify the input.type attribute. If you must modify it, you can hide the original input first, and then insert a new input element at the same position.
8. Window.event problem
Problem description: window.event can only be run under IE, but not under Firefox. This is because Firefox's event can only be used at the scene where the event occurs.
Solution: Add the event parameter to the function where the event occurs, and use var myEvent = evt?evt:(window.event?window.event:null) in the function body (assuming the formal parameter is evt)
Example:
< input type="button" onclick="doSomething(event)"/>