Original author: Peter-Paul Koch
The following is the translation of the original text:
Methods to judge the existence of an object
You will soon notice that some of the JavaScript functions are not valid in some browsers. If you want to use some advanced features of scripts, you must first check whether the browser supports the object you want to use. This article specifically explains the correct way to judge.
By judging the browser version: No!
If you want to know whether the browser supports those objects used in the code, remember that you should never judge by the browser version. I'm sure you know that some browsers support your code, while some browsers don't support your code, but have you considered other browsers? Those unknown small browsers?
Even if you can detect the browser and version used by 90% of users, there are still some unknown browsers that cannot run your code correctly. The result is either a lot of exception information or some scripts are not executed correctly. In either case, you are using vulnerable code to deceive the final user who browses the website.
Case Study: mouseovers
An ancient case can confirm the above statement. Although this situation no longer exists now, examples of the same principle still exist.
A recognized fact is that IE 3 does not support this array, but this array is extremely important for mouseover scripts. So we should prohibit mouseover scripts from being executed in IE 3 browser. One of the solutions is to judge the browser. When it is determined that the browser used by the user is IE 3, this function will not be executed.
However, in most operating systems, the Netscape 2 browser also does not support arrays. If you only determine whether the browser is IE 3, users using Netscape 2 will see a lot of exception information.
Then why not detect it together with Netscape 2? Because even doing this will make no difference.
Running inOS/2OnNetscape 2Yes andNetscape 3Fully compatible，And it can be handled very wellmouseoverEffect。 Despite this, why do people often fail to see this effect? Because web developers used browser detection methods, they blocked the Netscape 2 browser in mouseover scripts. Therefore, developers deprive users of the right to have a good interactive experience without sufficient reason. A suitable object detection method can prevent this from happening.
Finally, more and more browsers allow users to modify the browser's authentication string to their favorite content, which has a great possibility. If the browser and version that the user is actually using cannot be detected, it will naturally not guarantee that the code will be run without trouble. As a result, web developers once again deprive users of the right to have additional interaction effects. To make matters worse, such code is usually written terrible.
Since the browser version is unreliable, is the JavaScript version more reliable?
By judging the version of JavaScript: No!
In the initial planning, Netscape fully realized that future browsers would support much more objects than they are now, and web developers must be able to distinguish new and old browsers.
The initial plan was to let developers judge the browser version. For example, a certain browser can only support JavaScript, etc. Add version attribute to the script tag, so that if the browser does not support the corresponding version of JavaScript, the script will naturally not be executed.
However, when Microsoft entered the browser market, the idea could not continue. Although both Netscape 4 and IE 4 supported JavaScript 1.2 as early as the time of Netscape 4 and IE 4, even those with imagination would not believe that they supported the same JavaScript 1.2. Because this version number is outdated and must have nothing to do with object detection.
So don't use JavaScript version number to do anything, they have no practical effect.
Correct method: Object judgment
Instead, we just need to use a simple method to determine whether the browser supports the object (or method, array, or property) to use. Let's use mouseover as an example. This script depends on this array, so the most important thing is of course to determine whether the browser supports it. Here are the specific methods:
if ()
{
do something with the images array
}
Now you have a complete guarantee that the browser running this code will definitely support this script. Conditional statements determine whether this array exists. If true is returned, then the script will be executed. Otherwise, if this array does not exist, false will be returned, and this script will definitely not be executed.
There is another commonly used detection targeting. This is a method (a command that you tell JavaScript what to do). If we want to use this method, we must first detect whether the browser supports this method.
The correct way to detect whether a function exists is as follows: Remember not to add brackets after the function:
if ()
The meaning of the above code is: "Does the browser support this function?", while the following code has different meanings:
if (())
This code judges the result of focus, and it is assumed that the browser supports the focus method, and if it does not support it, an exception will be reported. After adding brackets, the function is actually executed, and this is not the situation we want. Therefore, do not add brackets when testing, but only add brackets after the detection is passed to execute this function. For example, the following example:
if () ()
Focus
All the focus of the above discussion is: In JavaScript, if you want to use it, first determine whether it is supported. If you want to use the method, first determine whether the browser supports this method.
If you always detect before using objects, your script will not produce exceptions with similar problems. The code you pay for is just some functions blocked in some browsers.
Translator's note:
Any war will bring many side effects. The situation introduced in this article mainly occurs during the browser war, just like the Cold War, causing many legacy problems. However, the implementation of the ecma-262 standard later eased this situation. However, the third edition of ecma-262 clearly stipulates that each company is allowed to expand it by itself. The result of the expansion is naturally incompatible, so naturally the method of this article must be used to judge. So, we just don’t have to judge all objects now. If a browser announces that it supports the ecma-262 standard, at least we know which objects do not need to be judged, which is also a comfort.