The correct way to determine whether a JavaScript object is available

Original: http://www.quirksmode.org/js/support.html

Original Author: Peter-paul Koch

The following is the translation of the original text:

Methods of judging the existence of objects

You'll soon notice that some of the JavaScript features are not valid in some browsers. If you want to use some of the advanced features of the script, you first need to check whether the browser supports the object to use, this article explains the correct way to judge.

By judging the browser version: No!

If you want to know if your browser supports those objects used in your code, remember, never judge by the version of your browser. I'm sure you know that some browsers support your code, and some browsers don't support your code, but have you considered other browsers? The little browsers that are not known?

Even if you can detect 90% of users using the browser and version, or some unknown browsers do not correctly run your code, the result is either a lot of exception information, or some scripts are not properly executed. In either case, you are using faulty code to deceive the users who end up browsing the site.

Case study: Mouseovers

An old case can attest to the above statement. Although this situation does not exist now, the same principle is still the case.

An accepted fact is that IE 3 does not support document.images this array, but this array is extremely important for mouseover scripts. So we should prevent mouseover scripts from being executed in IE 3 browsers. One solution is to judge the browser, and when the user is judged to use the browser is IE 3, do not perform this function.

However, in most operating systems, Netscape 2 browsers also do not support document.images arrays. If you only determine if the browser is IE 3, then a user with Netscape 2 will see a lot of exception information.

So why not test it with Netscape 21? For even this is nothing to mend.

Netscape 2, which runs on OS/2, is fully compatible with Netscape 3 and can handle mouseover effects well. However, why do people often do not see this effect? Because Web developers use browser detection, they block Netscape 2 browsers in mouseover scripts. So developers, without sufficient justification, deprive users of the right to a good interactive experience. The appropriate object detection method can prevent this from happening.

Finally, more and more browsers allow users to modify the browser's authentication string for their favorite content, so there is a great possibility, the user can not detect the actual use of the browser and version, nature will not be able to guarantee the operation of the code without fault. As a result, web developers once again deprive users of the right to additional interactive effects. To make things worse, such code is often poorly written.

Since the browser version is unreliable, is the JavaScript version more believable?

By judging the version of javascript: No!

At the time of the initial planning, Netscape was fully aware that future browsers would support far more objects than they do today, and web developers must be able to differentiate between old and new browsers.

The original plan was to get developers to judge the version of the browser. For example, a certain browser can only support JavaScript 1.x and so on. Add the Version property to the Script tab so that if the browser does not support the corresponding version of JavaScript, the script will not be executed naturally.

However, when Microsoft is involved in the browser market, the idea cannot go on. Although JavaScript 1.2 was supported early in Netscape 4 and IE 4, even imaginative people would not believe that they supported the same JavaScript 1.2. Because this version number is outdated and certainly irrelevant to object detection.

So do not use JavaScript version numbers to do anything, they have no practical effect.

The right approach: object judgment

Instead, we simply use a simple method to determine whether the browser supports the object (or method, array, or property) to be used. We still use the example of mouseover. This script relies on document.images this array, so the most important thing is of course to determine whether the browser supports him, as follows:

if (document.images)

{

Do something with the images array

}

Now that you have a complete guarantee, the browser running this code will definitely support this script. Conditional statements determine whether the array exists, and if true, the script will be executed, or false if the array does not exist, and the script will certainly not be executed. document.image

There is also a common test for window.focus. This is a method (a command that tells JavaScript what to do). If we want to use this method, we must first detect if the browser supports this method.

The correct way to detect whether a function exists is to keep in mind that you do not put parentheses behind the function:

if (Window.focus)

The meaning of the above code is: "Does the browser support Window.focus this function", and the following code has different meanings:

if (Window.focus ())

This code is the result of the focus of judgment, and has assumed that the browser is the focus method, and if not supported, this time will be reported an exception. The parentheses actually execute the function, and that's not what we want. Therefore, do not use parentheses when testing, and only after the test pass the parentheses to execute this function. For example, the following example:

if (Window.focus) Window.focus ()

Focus

All the highlights of the above discussion are: in JavaScript, if you want to use Document.images, first determine whether to support document.images. If you want to use the Window.focus method, first determine whether the browser supports this method.

If you are always testing before using objects, your script will not create a problem-like exception, and the code that pays is only partially blocked in some browsers.

Translator Note:

Any war will bring a lot of side effects, this article describes the situation is mainly in the browser war, like the Cold War, caused a lot of legacy problems. But later, the implementation of ecma-262 standards, let this situation get a little eased, but in the ecma-262 third edition of the clear provisions, allow the family to expand their own, the result of the expansion of nature is incompatible, naturally to use this method to judge. Simply, we just don't have to judge all the objects, and if a browser announces support for the ecma-262 standard, at least we know which objects are not judged, which is a consolation.