Section 1.2. Cross-Browser Incompatibility and Other Common JavaScript Myths

1.2. Cross-Browser Incompatibility and Other Common JavaScript Myths

The JavaScript language runs in multiple environments and on many platforms. It can be used to develop web pages (and other applications) that work in operating systems such as Mac OS X, Windows, and Linux. It doesn't require any special download or installation, because JavaScript is built into whatever browser you decide to use.

Most browsers implement a common subset of the language, making most code quite compatible across browsers. This can lead to confusion: if the language implementation is similar, where do the issues of cross-browser incompatibilities arise?

Most cross-browser incompatibilities are based on differences in the underlying Document Object Model (DOM) exposed by the browser, rather than on the language itself. For instance, a JavaScript language object would be Date or String; it will remain a Date or a String whether implemented in Safari or Navigator. An instance of an object from the DOM would be the document object, which represents that portion of the browser that holds the web page. How these DOM objects are exposed and manipulated within the browser's respective implementation of JavaScript (or ECMAScript) is what leads to cross-browser incompatibility.

Another area of confusion has to do with what in the web page is managed by JavaScript and what is managed through the use of Cascading Style Sheets (CSS). The most that JavaScript can do with an element in a page is create it, remove it, or alter its attributes. Among such attributes are those defined through the CSS style attribute.

CSS defines the look and even some of the behavior of elements within the web page. It can hide or show elements, change color or font, move, resize, or clip, and so on. How each browser implements CSS can vary, and this can also lead to some issues of cross-browser incompatibility. All JavaScript does, though, is alter an element's CSS style attributes.

ECMAScript compliance asserts that all built-in JavaScript objects be the same, but some small variations can exist between browsers. However, for the most part, cross-browser problems in the past have been based on DOM or CSS differences.