The most correct method for determining whether JavaScript objects are available

Original article: http://www.quirksmode.org/js/support.html
Author: Peter-Paul Koch

The original text is translated as follows:

Method for determining the existence of an object

Soon you will notice that some JavaScript Functions are invalid in Some browsers. If you want to use some advanced features of the script, you must first check whether the browser supports the objects to be used. This article describes the correct method for determining.

Determine the browser version: No!

If you want to know whether the browser supportsCodeRemember, never use the browser version to determine the objects used in. I'm sure you know that some browsers support your code, while some Browsers Do not support your code, but have you considered other browsers? What small unknown browsers?

Even if you can detect the browsers and versions used by users of version 90%, some unnamed browsers still cannot run your code correctly, and the result is either a lot of exception information, or some scripts are not correctly executed. In either case, you are using the code that is full of loopholes to spoof users who finally browse the website.

Case study: mouseovers

An old case can prove the above statement. Although this situation does not exist, examples of the same principle still exist.

It is recognized that IE 3 does not support the array document. images, but this array is extremely important for the Mouseover script. Therefore, we should disable executing the Mouseover script in the IE 3 browser. One solution is to judge the browser. If the browser used by the user is ie 3, this function will not be executed.

However, the Netscape 2 browser does not support the document. Images array in most operating systems. If you only determine whether the browser is Internet Explorer 3, users using Netscape 2 will see a lot of exception information.

So why not check it together with Netscape 2? Because even this is done, there is nothing to do.

Netscape 2 running on OS/2 is fully compatible with Netscape 3 and can handle the Mouseover effect well. Even so, why do we still often see this effect? Because Web developers use browser detection, Netscape 2 is blocked in the Mouseover script. Therefore, developers are deprived of the right to have a good interactive experience without adequate reasons. Appropriate object detection methods can avoid this situation.

Finally, more and more browsers allow users to change the authentication string of the browser to the content they like. This makes it very likely that users cannot detect the browsers and versions they actually use, naturally, you cannot guarantee that the code runs without any faults. As a result, Web developers once again deprive users of the right to perform additional interactions. Worse, such code is usually poorly written.

Since the browser version is not reliable, is the Javascript version more credible?

Determine the Javascript version: No!

In the initial planning, Netscape was fully aware that browsers in the future would support more objects than they do now, and Web developers must be able to distinguish between new and old browsers.

The initial plan was to allow developers to determine the browser version. For example, a browser can only support JavaScript 1.x. Add the version attribute to the script tag. If the browser does not support the Javascript of the corresponding version, the script will not be executed.

However, when Microsoft entered the browser market, this idea could not proceed. Although both Netscape 4 and IE 4 support JavaScript 1.2, even imaginative people will not believe that they support the same JavaScript 1.2. Because the version number is outdated, and it must be irrelevant to object detection.

Therefore, do not use the Javascript version number to do anything. They have no practical effect.

Correct Method: Object judgment

On the contrary, we only need to use a simple method to determine whether the browser supports the objects to be used (or methods, arrays, or attributes ). We still use the Mouseover example. This script depends on the document. Images array, So the most important thing is to determine whether the browser supports it. The following is a specific practice:

If (document. Images)
{
Do something with the images Array
}

Now you have a complete guarantee that the browser running this code must support this script. Condition Statement to judge document. whether the Image array exists. If true is returned, the script will be executed. If the array does not exist, false will be returned, and the script will not be executed.

Another common detection is 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 check whether the browser supports this method.

The correct method to check whether a function exists is as follows. Do not enclose the function with parentheses:

If (window. Focus)

The above code indicates: "Does the browser support the window. Focus function?", and the following code has different meanings:

If (window. Focus ())

This code is used to determine the result of the focus, and assumes that the browser supports the focus method. If not, an exception is reported. After parentheses are added, the function is actually executed, which is not what we want. Therefore, do not add parentheses when detecting the function, but only add parentheses after the detection is passed to execute this function. For example:

If (window. Focus) window. Focus ()

Key Points

All the points discussed above are: In JavaScript, if you want to use document. images, first determine whether document. images is supported. If you want to use the window. Focus method, first determine whether the browser supports this method.

If you always detect objects before they are used, your script will not generate exceptions similar to the problem. The code you pay is only blocked by some functions in Some browsers.

Note:

Any war will bring many side effects. The situation described in this article mainly occurs in the browser war, just like the cold war, which has caused many legacy problems. But later the Implementation of The ECMA-262 standard, so that this situation has been somewhat relaxed, but in the third edition of the ecma-262 clearly stipulates that, to allow each of their own expansion of its results is naturally not compatible, naturally, we need to use the method described in this article for judgment. Simply, now we just don't need to judge all objects, if a browser announces support for ecma-262 standards, at least we know what objects don't need to be judged, It is a comfort.