Hack 47. Update Browser Detection Scripts
Work out whether your web page is loaded into Firefox. There are all kinds of Mozilla browsers and even different variants of Firefox [Hack #92], although the standard distribution of Firefox is by far the most popular distribution. This hack explains how to detect Firefox. Your web page can also make a display contract with Firefox [Hack #46] . 5.5.1. Detect Firefox by UserAgentEither behind the web server or in the web page, the foremost identifier of Firefox is the browser user agent (UA) string. The UA string is defined in RFC 1945 and RFC 2068. It is sent over the wire from web browser to web server in this header line: User-Agent: string It appears in the Apache server environment as this environment variable: HTTP_USER_AGENT=string It appears in JavaScript as this host object property: window.navigator.userAgent For quick sanity checks, the user agent for Firefox can also be displayed using the HelpAbout Mozilla Firefox menu item. That page can be displayed separately using this URL: chrome://browser/content/aboutDialog.xul Select the text of the user-agent string with the mouse and drag up or down if it looks odd when it first appears. To detect Firefox, chop up the UA string. Useful JavaScript functions include these: userAgent.substring(start, length); // returns a fixed substring userAgent.split(" "); // returns array of whitespace-separated pieces userAgent.match(/.*fox/i); // returns case-insensitive regexp match Here are the meaningful substrings of the user agent:
5.5.2. Detect Firefox via the DOMThe user agent string is exposed to the Document Object Model (DOM) of a given web page as described earlier in this hack. Other detection methods also exist in the DOM. 5.5.2.1 document.allTesting this DOM property like this is a common way of detecting Internet Explorer (IE): if (document.all ) { ... } Some web pages are built in ignorance of the constraints of the global Web. Such pages use document.all without first checking to see if it exists. These cases, such as the following example, cause pages displayed in non-IE web browsers to fail: if ( document.all("id") == null ) { ... } Firefox has special support for document.all, as follows:
This support only exists when a web page is displayed in Quirks mode. Quirks mode is for old, legacy HTML documents. One easy way to ensure that Quirks mode is operating is to leave out an HTML document's <!DOCTYPE> declaration. You can see if a page uses Quirks mode or not using ToolsPage InfoGeneral. Look at the Render Mode line item for the current mode. 5.5.2.2 document.implementation.hasFeature(type,version)This method is defined in the W3C's DOM 2 Core standard. It allows a script to test for UA support for specific standards. For example, this test can be used to test for CSS2 support: document.implementation.hasFeature("CSS2","2.0"); In particular, this method can be used to test whether the Firefox UA is built so that it includes SVG: document.implementation.hasFeature("org.w3c.svg","dummy string"); It can also be used to report whether specific SVG features (a term specific to SVG) are implemented. To do so, provide an SVG 1.1 feature URL as the first argument, like this: "http://www.w3.org/TR/SVG11/feature#Structure" 5.5.2.3 document.layersThis DOM 0 collection, present in Netscape 4.x, is not present in Firefox at all. It's unusable as a positive test of Firefox, so it no longer stands for "Netscape 4.x or higher." Now it stands for "Netscape 4.x only." 5.5.3. Detect JavaScript Version SupportAll Firefox browsers support at least JavaScript Version 1.5. That version fully supports ECMAScript Version 1, Edition 3. Firefox also supports earlier versions of JavaScript, but you should never use them. Include external scripts within HTML and XHTML with this tag: <script type="text/javascript" src="..."></script> Similarly, include embedded scripts with this tag: <script type="text/javascript"> ... content ... </script> Support all scripts used strictly in XUL with this tag: <script type="application/x-javascript" src="..." /> See also [Hack #74] for some fancy new features. |