The difference between the reference js in IE and FF is explained in detail
- 2020-03-29 23:54:21
- OfStack
Js debugging tools recommend firefox's firebug plug-in
The ability to set breakpoints for js execution
Ability to modify CSS styles at run time
View the dom model, etc
Do things IE8 also comes with a great developerbar
Do things open all firefox js warnings:
Type about:config in the address bar
Double click, set javascriptoptionrestict open to true to see a lot of warnings to help correct errors
Nurture - IE > Firefoxjavascript class
Delta document. All (" id ") - > Document. The getElementById (" id ")
And the control should always be identified with an id, not a name
Tip:
If the control has only name and no id, use getElementById:
IE: you can also find objects
FF: returns NULL
Delta method to obtain an element in the form
ElForm. Elements [' name '];
The method to determine whether an object is an object should be delta
If (typeof object variable =="object")
Instead of if(object variable =="[object]")
delta calls the object directly through the id
Object id. Value = ""
Instead of
Document. The getElementById (" name "). The value = ""
Delta obj. InsertAdjacentElement (" beforeBegin objText);
Instead of using
Obj. ParentNode. InsertBefore (objText, obj);
With the document. The write (esHTML);
Or you can set the attributes after you create the element. For the input element, you need to set the type before you add it to the dom
Varobj = createElement method (" input ");
Obj. Type = "checkbox";
Varobj2 = document. GetElementById (" id2 ");
Obj2. ParentNode. InsertBefore (obj, obj2);
If you're inserting HTML code directly, consider using it
createContextualFragment
Delta the innerText - > textContent
The $in the object name is not recognized, it is recommended to _
ObjName = "t1 $spin"
Instead of
ObjName = "t1_spin"
delta FF sets an Attribute to an object, and then retrieves it, and the properties of the object are lost?
ObjText. SetAttribute (" obj ", obj);
Alert (obj.id)// correct name
Obj = objText. GetAttribute (" obj ");
Alert (obj. Id) / / null
There is no problem under IE,FF for setAttribute, the second parameter is string!!
So if the second argument is an object, you're calling the object's toString() method
The solution is to use the following method:
ObjText. Dropdown_select = obj;
Obj = objText dropdown_select
Delta className - > The class
Replace the className under IE with class under FF
Because the class is the key word, so you need to use the setAttribute/getAttribute
SetAttribute ("class"," CSS style name ");
delta attributes defined in HTML, you must use getAttribute
< Tdid = "TD1" isOBJ = "true" >
When access to:
Document.getelementbyid ("TD1").isobj always returns undefined,IE is ok
To use:
Document. The getElementByID (" TD1 "). The getAttribute (" isOBJ ")
Delta FF select control is no longer: always at the top
So you might want to set the zIndex of the control
The way to override the select control in IE is to use ifame
delta the value below if(vars==undefined) is used to determine that it is equivalent
undefined
null
false
0
delta if FF calls obj.focus(); Error report, please try to change to:
Window. The setTimeout (function () {obj. Focus (); }, 20);
Delta FF,keyCode is read-only, how to convert the return to TAB? What about key value conversion at entry time?
The workarounds are:
1. Return jump -> Write your own jump handling code.
Walk through all the elements in the dom, find the next element of the current element that can set the focus, and give it the focus
2. In controls that can be typed,
Vartext = string.fromcharcode (event.keycode);
Prevent key events from being uploaded, call: event.preventdefault ()
Delta < Button> Will be interpreted by firefox to submit a form or refresh a page??
You need to write standards < Buttontype = "button" >
Or onclick=" function call (); Returnfalse;"
Delta in firefox,document.onfocus gets a control that doesn't actually get focus?
Why document.keydown works?
Delta children - > .childnodes
Delta sytle. PixelHeight - > Style. The height
Delta determines whether a function or variable exists
If (! (" varName "inwindow)) varVarName = 1;
Delta document. Body. ClientWidth
< ! DOCTYPEhtmlPUBLIC "- / / / / W3C DTDXHTML1.0 Transitional / / EN" >
If the HTML contains the above statement, it should be retrieved using the following method
Document. The documentElement. ClientWidth
Delta window. CreatePopup
Delta document. Body. Onresize
In the window. Onresize
Note that the onresize event is not triggered when the page opens, right? It needs to be called once in onload as well
Problems with the delta box model
The default under IE is content-box. For unification, the following Settings can be used:
Div, td {- moz - box - sizing: border - box; The box - sizing: border - box; Margin: 0; Padding: 0; }
Can also be added to the document header:
< ! DOCTYPEhtmlPUBLIC "- / / / / W3C DTDXHTML1.0 Strict / / EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd" >
But the old IE code has a greater impact
Delta registration event
IE: attachEvent
FF: addEventListener (" blur ", myBlur, false);
The first parameter event name does not need to be "on"
The third parameter, false, represents event passing from the event object down the dom tree to the body
Delta trigger event
IE: obj. FireEvent (" onclick ");
FF:
Vare = document. CreateEvent (" Events ");
E.i nitEvent (" click ", true, false);
Element. DispatchEvent (event)
delta gets the object handle in the event handler
VaroThis = this;
Obj. An onfocus = function (evt) {
OThis. DoOnFocus (evt);
}
Code for the unified event handling framework
DoOnFocus (evt) {
Evt = evt | | window. The event;
Varel = evt. Target | | evt. SrcElement;
// follow-up
}
However, the setter method of the property can be defined in FF, as follows:
HTMLElement. Prototype. __defineSetter__ (" readOnly ", function (readOnly) {
// construct a virtual event object
Varevt = [];
Evt/" target = this;
Evt [" propertyName] = 'readOnly'
// the onpropertychange function needs to define the evt parameter, referring to the unified event handling framework code
If (this. Onpropertychange) enclosing onpropertychange (evt).
});
Nurture - IE > Firefoxcss class
Delta cursor: hand - > Cursor: pointer
Expression also consumes a lot of CPU in IE, so it should not be used!!
In order to achieve better results, you should establish your own expressiontojavascript processing function
This will work in both IE and FF.
The filter: Alpha (Opacity = 50);
Replace with
Moz - opacity: 0.5;
Delta text - overflow
Delta transparent
Must use obj. Style. BackgroundColor = "transparent"
delta FF under the text control height and IE different, unified
Input [type = text] {
Height: 20 px;
}
Note that there should be no space between input and [!
delta font in IE does not work for body, td, etc.,FF does
Unified with the font-family