Shulou(Shulou.com)06/02 Report--

Firefox and IE between the seven JavaScript differences, many novices are not very clear about this, in order to help you solve this problem, the following editor will explain in detail for you, people with this need can come to learn, I hope you can gain something.

Although the era of JavaScript's history of using lengthy and tiresome code blocks to mark specific browsers is over, it is still necessary to occasionally use simple code blocks and object checks to ensure that some code works properly on the user's machine.

1. CSS "float" attribute

The basic syntax for getting a specific CSS attribute of a given object is the object.style attribute, and the hyphenated attribute is replaced by the camel nomenclature. For example, to get the background-color property of a div whose ID is "header", we would use the following syntax:

Document.getElementById ("header") style.borderBottom= "1px solid # ccc"

But since "float" is a reserved word for JavaScript, we cannot use object.style.float to get the "float" attribute. Here is how we use it in two browsers:

IE syntax:

Document.getElementById ("header") .style.styleFloat = "left"

Firefox syntax:

Document.getElementById ("header") .style.cssFloat = "left"

two。 The calculation style of the element

By using the object.style.property above, JavaScript can easily obtain and modify the set CSS style of the object. But the limitation of this syntax is that it can only get styles inline in HTML, or directly use styles set by JavaScript. The style object cannot get a style set using an external style sheet. To get the "calculation style" of the object, we use the following code:

IE syntax:

Var myObject = document.getElementById ("header"); var myStyle = myObject.currentStyle.backgroundColor

Firefox syntax:

Var myObject = document.getElementById ("header"); var myComputedStyle = document.defaultView.getComputedStyle (myObject, null); var myStyle = myComputedStyle.backgroundColor

3. Get the "class" attribute of the element

Similar to the case of the "float" property, the two browsers use different JavaScript methods to get this property.

IE syntax:

Var myObject = document.getElementById ("header"); var myAttribute = myObject.getAttribute ("className")

Firefox syntax:

Var myObject = document.getElementById ("header"); var myAttribute = myObject.getAttribute ("class")

4. Get the "for" attribute of the label tag

As with the third question, there is a different syntax for using JavaScript to get the "for" attribute of label.

IE syntax:

Var myObject = document.getElementById ("myLabel"); var myAttribute = myObject.getAttribute ("htmlFor")

Firefox syntax:

Var myObject = document.getElementById ("myLabel"); var myAttribute = myObject.getAttribute ("for")

The same syntax is used for the setAtrribute method.

5. Get the cursor position

Getting the cursor position of an element is rare, and if you need to do so, the syntax for IE and Firefox is also different. This sample code is fairly basic and is generally used as part of many complex event handling, which is only used to describe the differences. It is important to note that the results in IE are different from those in Firefox, so there are some problems with this approach.

IE syntax:

Var myCursorPosition = [0,0]; myCursorPosition [0] = event.clientX; myCursorPosition [1] = event.clientY

Firefox syntax:

Var myCursorPosition = [0,0]; myCursorPosition [0] = event.pageX; myCursorPosition [1] = event.pageY

6. Get the size of the window or browser window

Sometimes it is necessary to find out the size of the effective window space of the browser, which is generally called "window".

IE syntax:

Var myBrowserSize = [0,0]; myBrowserSize [0] = document.documentElement.clientWidth; myBrowserSize [1] = document.documentElement.clientHeight

Firefox syntax:

Var myBrowserSize = [0,0]; myBrowserSize [0] = window.innerWidth; myBrowserSize [1] = window.innerHeight

7. Alpha transparency

This is not really a syntax project for JavaScript-alpha transparency is set through CSS. But when the object is set to fade in and out through JavaScript, this needs to be done by getting the alpha setting of the CSS, usually inside the loop. To change the CSS code with the following JavaScript:

IE syntax:

# myElement {filter: alpha (opacity=50);}

Firefox syntax:

# myElement {opacity: 0.5;}

To get these values using JavaScript, you need to use the style object:

IE syntax:

Var myObject = document.getElementById ("myElement"); myObject.style.filter = "alpha (opacity=80)"

Firefox syntax:

Var myObject = document.getElementById ("myElement"); myObject.style.opacity = "0.5"

Of course, it has been said that it is common to change the opcity/alpha in the middle of the loop to create animation effects, but this is a simple example, just to clearly describe how the method is implemented.

Is it helpful for you to read the above content? If you want to know more about the relevant knowledge or read more related articles, please follow the industry information channel, thank you for your support.

Welcome to subscribe "Shulou Technology Information " to get latest news, interesting things and hot topics in the IT industry, and controls the hottest and latest Internet news, technology news and IT industry trends.