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

Today, I will talk to you about the difference between JavaScript in IE and Firefox. Many people may not know much about it. In order to let everyone know more, Xiaobian summarizes the following contents for everyone. I hope everyone can gain something according to this article.

1. JavaScript differences in CSS "float" property

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

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

But since "float" is a JavaScript reserved word, we can't use object.style.float to get the "float" attribute. Here are the methods we use in both browsers:

IE syntax:

document.getElementById("header").style.styleFloat = "left";

Firefox syntax:

document.getElementById("header").style.cssFloat = "left";

2. JavaScript differences in the computational style of elements

By using object.style.property above, JavaScript can easily get and modify CSS styles for objects. However, the limitation of this syntax is that it can only get styles inline in HTML or set directly using JavaScript. Style objects cannot acquire styles that use external style sheet settings. To get the "calculation style" of an 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. Gets the "class" attribute of an element

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

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. Gets the "for" attribute of the label label

As in 3, there is a different syntax for the "for" attribute that uses JavaScript to get 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 applies to the setAtribute method.

5. Get cursor position

Cursor positions for fetching elements are rare, and IE and Firefox syntaxes differ if they are needed. This sample code is fairly basic, generally used as part of many complex event processing, and is used here only to describe the differences. Note that the results in IE are different from those in Firefox, so there are some problems with this approach. Usually, this discrepancy can be compensated for by acquiring "scroll positions"-but that's the subject of another article.

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;

After reading all this, do you have any idea what the difference between JavaScript in IE and Firefox is? If you still want to know more knowledge or related content, please pay attention to 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.