Differences between js in IE and firefox_Basic knowledge-JS Tutorial-php.cn

1.firefox cannot support innerText.
Firefox supports innerHTML but not innerText. It supports textContent to implement innerText, but the extra spaces are also retained by default. If textContent is not used, innerHTML can be used instead if the string does not contain HTML code.

2. Prohibit selection of web content:
Generally use js in IE: obj.onselectstart=function(){return false;}
Firefox uses CSS:-moz-user-select:none

3. Filter support (example: transparent filter):
IE:filter:alpha(opacity=10);
firefox:-moz-opacity:.10;

4. Capture event:
IE: obj.setCapture(), obj.releaseCapture()
Firefox: document.addEventListener("mousemove",mousemovefunction,true);
document.removeEventListener("mousemove",mousemovefunction,true);

5. Get mouse position:
IE: event.clientX, event.clientY
firefox: event function is required to pass event object
obj.onmousemove=function(ev){
X=ev.pageX;Y=ev.pageY;
}

6. Boundary issues of DIV and other elements:
For example: set the CSS of a div::{width:100px;height:100px;border:#000000 1px solid;}
In IE: div width (including border width): 100px, div height (including border width): 100px;
And firefox: the width of the div (including the border width): 102px, the height of the div (including the border width): 102px;

So when making this dragging window that is compatible with IE and Firefox, you have to use your brain when writing js and css. Here are two tips for you

1. Determine the browser type:
var isIE=document.all? true:false;
I wrote a variable, if the document.all syntax is supported then isIE=true, otherwise isIE=false

2. CSS processing under different browsers:
Generally, you can use !important to prioritize the use of css statements (only supported by firefox)
For example: {border-width:0px!important;border-width:1px;}
Under Firefox, this element has no border. Under IE, the border width is 1px

1.document.formName.item("itemName") problem
Description of the problem: Under IE, you can use document.formName.item("itemName") or document.formName.elements ["elementName"]; under Firefox, you can only use document.formName.elements["elementName"].
Solution: Use document.formName.elements["elementName"] uniformly.

2. Collection object problem
Description of the problem: Under IE, you can use () or [] to obtain collection objects; under Firefox, you can only use [ ] to obtain collection objects.
Solution: Use [] uniformly to obtain collection class objects.

3. Custom attribute issues
Description of the problem: 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.
Solution: Uniformly obtain custom attributes through getAttribute().

4.eval("idName") problem
Description of the problem: 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 get the HTML object with the id idName. .
Solution: Use getElementById("idName") uniformly to obtain the HTML object whose id is idName.

5. The problem that the variable name is the same as an HTML object ID
Description of the problem: Under IE, the ID of the HTML object can be used directly as the variable name of the subordinate object of document, but not under Firefox; under Firefox, the same variable name as the HTML object ID can be used, but not 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
Description of the problem: 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
Description of the problem: 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
Description of the problem: window.event can only be run under IE, not 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:

Copy code The code is as follows: