Summary: An experimental approach to discovering degree of support for Standards
Obsolete
This feature is obsolete. Although it may still work in some browsers, its use is discouraged since it could be removed at any time. Try to avoid using it.
Among the methods of browser detection, many people recommend using the existence of specific properties or methods in a browser's DOM to detect the browser type and whether it supports a given operation. This test takes that idea to the extreme and tests a large number of properties and methods to determine the level of support a browser has for particular standards and reports a rating as the percentage of names the browser defines.
This article has generally never been more than a way to show off Firefox Web compatibility, rather than something truly informative in a broader sense. Therefore, given that it's also badly out of date, it's been archived. You should not rely on any information here.
Browser Sniffing via API Name Detection
The following tables list the API names defined for specific W3C DOM APIs and lists the percentage of names that your browser actually defines followed by a list of each of the API names tested along with an indication of whether the name was defined for your browser.
It is clear from these test results that Netscape 7.0x and Mozilla Firefox have the greatest DOM support although Internet Explorer, Safari, and Opera have sufficient DOM CSS 1 and DOM Level 1 & 2 document property and method support to enable cross browser web development.
Test Summary
| Standard | Netscape 7.0x | Firefox 1.5 | Safari 2 | Opera 7 / 8.5-9.0 | Internet Explorer 6 / 7 |
|---|---|---|---|---|---|
| DOM Core 1 | 100% | 100% | 100% | 75% / 91% | 75% / 75% |
| DOM Core 2 | 100% | 100% | 100% | 70% / 94% | 58% / 58% |
| DOM 1 HTML | 100% | 100% | 100% | 100% / 100% | 100% / 100% |
| DOM CSS 1 | 100% | 100% | 100% | 100% / 100% | 96% / 96% |
| DOM CSS 2 | 100% | 98% | 67% | 71% / 83% | 38% / 42% |
Test Results Cross Reference
DOM Core Level 1
Support for properties/methods in document
| name | Firefox 1.5 | IE 6 & 7 | Opera 8.54 - 9.01 |
|---|---|---|---|
| doctype | true | true | true |
| implementation | true | true | true |
| documentElement | true | true | true |
| createElement | true | true | true |
| createDocumentFragment | true | true | true |
| createTextNode | true | true | true |
| createComment | true | true | true |
| createCDATASection | true | false | true |
| createProcessingInstruction | true | false | true |
| createAttribute | true | true | true |
| createEntityReference | (method present but only returns null: bug 9850) | false | false |
| getElementsByTagName | true | true | true |
DOM Core Level 2
Support for properties/methods in document
| name | Firefox 1.5 | IE 6 & 7 | Opera 8.54 - 9.01 |
|---|---|---|---|
| doctype | true | true | true |
| implementation | true | true | true |
| documentElement | true | true | true |
| createElement | true | true | true |
| createDocumentFragment | true | true | true |
| createTextNode | true | true | true |
| createComment | true | true | true |
| createCDATASection | true | false | true |
| createProcessingInstruction | true | false | true |
| createAttribute | true | true | true |
| createEntityReference | true | false | false |
| getElementsByTagName | true | true | true |
| importNode | true | false | true |
| createElementNS | true | false | true |
| createAttributeNS | true | false | true |
| getElementsByTagNameNS | true | false | true |
| getElementById | true | true | true |
DOM Level 1 HTML
Support for properties/methods in document
| name | Firefox 1.5 | IE 6 & 7 | Opera 8.54 - 9.01 |
|---|---|---|---|
| documentElement | true | true | true |
| createElement | true | true | true |
| createDocumentFragment | true | true | true |
| createTextNode | true | true | true |
| createComment | true | true | true |
| createAttribute | true | true | true |
| getElementsByTagName | true | true | true |
| title | true | true | true |
| referrer | true | true | true |
| domain | true | true | true |
| URL | true | true | true |
| body | true | true | true |
| images | true | true | true |
| applets | true | true | true |
| links | true | true | true |
| forms | true | true | true |
| anchors | true | true | true |
| cookie | true | true | true |
| open | true | true | true |
| close | true | true | true |
| write | true | true | true |
| writeln | true | true | true |
| getElementById | true | true | true |
| getElementsByName | true | true | true |
DOM CSS 1
Support for properties/methods in document.body.style
| name | Firefox 1.5 | IE 6 & 7 | Opera 8.54 - 9.01 |
|---|---|---|---|
| background | true | true | true |
| backgroundAttachment | true | true | true |
| backgroundColor | true | true | true |
| backgroundImage | true | true | true |
| backgroundRepeat | true | true | true |
| border | true | true | true |
| borderSpacing | true | false | true |
| borderStyle | true | true | true |
| borderTop | true | true | true |
| borderRight | true | true | true |
| borderBottom | true | true | true |
| borderLeft | true | true | true |
| borderTopWidth | true | true | true |
| borderRightWidth | true | true | true |
| borderBottomWidth | true | true | true |
| borderLeftWidth | true | true | true |
| borderWidth | true | true | true |
| clear | true | true | true |
| color | true | true | true |
| display | true | true | true |
| cssFloat | true | false | true |
| font | true | true | true |
| fontFamily | true | true | true |
| fontSize | true | true | true |
| fontStyle | true | true | true |
| fontVariant | true | true | true |
| fontWeight | true | true | true |
| height | true | true | true |
| letterSpacing | true | true | true |
| lineHeight | true | true | true |
| listStyle | true | true | true |
| listStyleImage | true | true | true |
| listStylePosition | true | true | true |
| listStyleType | true | true | true |
| margin | true | true | true |
| marginTop | true | true | true |
| marginRight | true | true | true |
| marginBottom | true | true | true |
| marginLeft | true | true | true |
| padding | true | true | true |
| paddingTop | true | true | true |
| paddingRight | true | true | true |
| paddingBottom | true | true | true |
| paddingLeft | true | true | true |
| textAlign | true | true | true |
| textDecoration | true | true | true |
| textIndent | true | true | true |
| textTransform | true | true | true |
| verticalAlign | true | true | true |
| whiteSpace | true | true | true |
| width | true | true | true |
| wordSpacing | true | true | true |
DOM CSS 2
Support for properties/methods in document.body.style</caption>
| name | Firefox 1.5 | IE 6 & 7 | Opera 8.54 - 9.01 |
|---|---|---|---|
| azimuth | true | false | false |
| backgroundPosition | true | true | true |
| borderCollapse | true | true | true |
| borderSpacing | true | false | true |
| borderTopColor | true | true | true |
| borderRightColor | true | true | true |
| borderBottomColor | true | true | true |
| borderLeftColor | true | true | true |
| borderTopStyle | true | true | true |
| borderRightStyle | true | true | true |
| borderBottomStyle | true | true | true |
| borderLeftStyle | true | true | true |
| bottom | true | true | true |
| captionSide | true | false | true |
| clear | true | true | true |
| clip | true | true | true |
| content | true | false | true |
| counterIncrement | true | false | true |
| counterReset | true | false | true |
| cue | true | false | false |
| cueAfter | true | false | false |
| cueBefore | true | false | false |
| cursor | true | true | true |
| direction | true | true | true |
| elevation | true | false | false |
| emptyCells | true | false | true |
| fontSizeAdjust | true | false | true |
| fontStretch | true | false | true |
| left | true | true | true |
| markerOffset | true | false | true |
| marks | true | false | true |
| maxHeight | true | ie7 only | true |
| maxWidth | true | ie7 only | true |
| minHeight | true | true | true |
| minWidth | true | ie7 only | true |
| orphans | true | false | true |
| outline | true | false | true |
| outlineColor | true | false | true |
| outlineStyle | true | false | true |
| outlineWidth | true | false | true |
| overflow | true | true | true |
| page | true | false | true |
| pageBreakAfter | true | true | true |
| pageBreakBefore | true | true | true |
| pageBreakInside | true | false | true |
| pause | true | false | true |
| pauseAfter | true | false | true |
| pauseBefore | true | false | true |
| pitch | true | false | false |
| pitchRange | true | false | true |
| playDuring | false | false | false |
| position | true | true | true |
| quotes | true | false | true |
| richness | true | false | false |
| right | true | true | true |
| size | true | false | true |
| speak | true | false | true |
| speakHeader | true | false | false |
| speakNumeral | true | false | false |
| speakPunctuation | true | false | false |
| speechRate | true | false | true |
| stress | true | false | false |
| tableLayout | true | true | true |
| textShadow | true | false | true |
| top | true | true | true |
| unicodeBidi | true | true | true |
| visibility | true | true | true |
| voiceFamily | true | false | true |
| volume | true | false | true |
| widows | true | false | true |
| zIndex | true | true | true |
Test Code
<script type="text/javascript">
<!--
// document properties that are used to determine
// support levels
var _FEATURES =
{
'DOMCORE1': [
{name: 'doctype', 'supported': false},
{name: 'implementation', 'supported': false},
{name: 'documentElement', 'supported': false},
{name: 'createElement', 'supported': false},
{name: 'createDocumentFragment', 'supported': false},
{name: 'createTextNode', 'supported': false},
{name: 'createComment', 'supported': false},
{name: 'createCDATASection', 'supported': false},
{name: 'createProcessingInstruction', 'supported': false},
{name: 'createAttribute', 'supported': false},
{name: 'createEntityReference', 'supported': false},
{name: 'getElementsByTagName', 'supported': false}
],
'DOMHTML': [
{name: 'documentElement', 'supported': false},
{name: 'createElement', 'supported': false},
{name: 'createDocumentFragment', 'supported': false},
{name: 'createTextNode', 'supported': false},
{name: 'createComment', 'supported': false},
{name: 'createAttribute', 'supported': false},
{name: 'getElementsByTagName', 'supported': false},
{name: 'title', 'supported': false},
{name: 'referrer', 'supported': false},
{name: 'domain', 'supported': false},
{name: 'URL', 'supported': false},
{name: 'body', 'supported': false},
{name: 'images', 'supported': false},
{name: 'applets', 'supported': false},
{name: 'links', 'supported': false},
{name: 'forms', 'supported': false},
{name: 'anchors', 'supported': false},
{name: 'cookie', 'supported': false},
{name: 'open', 'supported': false},
{name: 'close', 'supported': false},
{name: 'write', 'supported': false},
{name: 'writeln', 'supported': false},
{name: 'getElementById', 'supported': false},
{name: 'getElementsByName', 'supported': false}
],
'DOMCORE2': [
{name: 'doctype', 'supported': false},
{name: 'implementation', 'supported': false},
{name: 'documentElement', 'supported': false},
{name: 'createElement', 'supported': false},
{name: 'createDocumentFragment', 'supported': false},
{name: 'createTextNode', 'supported': false},
{name: 'createComment', 'supported': false},
{name: 'createCDATASection', 'supported': false},
{name: 'createProcessingInstruction', 'supported': false},
{name: 'createAttribute', 'supported': false},
{name: 'createEntityReference', 'supported': false},
{name: 'getElementsByTagName', 'supported': false},
{name: 'importNode', 'supported': false},
{name: 'createElementNS', 'supported': false},
{name: 'createAttributeNS', 'supported': false},
{name: 'getElementsByTagNameNS', 'supported': false},
{name: 'getElementById', 'supported': false}
],
'DOMCSS1': [
{name: 'background', 'supported': false},
{name: 'backgroundAttachment', 'supported': false},
{name: 'backgroundColor', 'supported': false},
{name: 'backgroundImage', 'supported': false},
{name: 'backgroundRepeat', 'supported': false},
{name: 'border', 'supported': false},
{name: 'borderSpacing', 'supported': false},
{name: 'borderStyle', 'supported': false},
{name: 'borderTop', 'supported': false},
{name: 'borderRight', 'supported': false},
{name: 'borderBottom', 'supported': false},
{name: 'borderLeft', 'supported': false},
{name: 'borderTopWidth', 'supported': false},
{name: 'borderRightWidth', 'supported': false},
{name: 'borderBottomWidth', 'supported': false},
{name: 'borderLeftWidth', 'supported': false},
{name: 'borderWidth', 'supported': false},
{name: 'clear', 'supported': false},
{name: 'color', 'supported': false},
{name: 'display', 'supported': false},
{name: 'cssFloat', 'supported': false},
{name: 'font', 'supported': false},
{name: 'fontFamily', 'supported': false},
{name: 'fontSize', 'supported': false},
{name: 'fontStyle', 'supported': false},
{name: 'fontVariant', 'supported': false},
{name: 'fontWeight', 'supported': false},
{name: 'height', 'supported': false},
{name: 'letterSpacing', 'supported': false},
{name: 'lineHeight', 'supported': false},
{name: 'listStyle', 'supported': false},
{name: 'listStyleImage', 'supported': false},
{name: 'listStylePosition', 'supported': false},
{name: 'listStyleType', 'supported': false},
{name: 'margin', 'supported': false},
{name: 'marginTop', 'supported': false},
{name: 'marginRight', 'supported': false},
{name: 'marginBottom', 'supported': false},
{name: 'marginLeft', 'supported': false},
{name: 'padding', 'supported': false},
{name: 'paddingTop', 'supported': false},
{name: 'paddingRight', 'supported': false},
{name: 'paddingBottom', 'supported': false},
{name: 'paddingLeft', 'supported': false},
{name: 'textAlign', 'supported': false},
{name: 'textDecoration', 'supported': false},
{name: 'textIndent', 'supported': false},
{name: 'textTransform', 'supported': false},
{name: 'verticalAlign', 'supported': false},
{name: 'whiteSpace', 'supported': false},
{name: 'width', 'supported': false},
{name: 'wordSpacing', 'supported': false}
],
'DOMCSS2': [
{name: 'azimuth', 'supported': false},
{name: 'backgroundPosition', 'supported': false},
{name: 'borderCollapse', 'supported': false},
{name: 'borderSpacing', 'supported': false},
{name: 'borderTopColor', 'supported': false},
{name: 'borderRightColor', 'supported': false},
{name: 'borderBottomColor', 'supported': false},
{name: 'borderLeftColor', 'supported': false},
{name: 'borderTopStyle', 'supported': false},
{name: 'borderRightStyle', 'supported': false},
{name: 'borderBottomStyle', 'supported': false},
{name: 'borderLeftStyle', 'supported': false},
{name: 'bottom', 'supported': false},
{name: 'captionSide', 'supported': false},
{name: 'clear', 'supported': false},
{name: 'clip', 'supported': false},
{name: 'content', 'supported': false},
{name: 'counterIncrement', 'supported': false},
{name: 'counterReset', 'supported': false},
{name: 'cue', 'supported': false},
{name: 'cueAfter', 'supported': false},
{name: 'cueBefore', 'supported': false},
{name: 'cursor', 'supported': false},
{name: 'direction', 'supported': false},
{name: 'elevation', 'supported': false},
{name: 'emptyCells', 'supported': false},
{name: 'fontSizeAdjust', 'supported': false},
{name: 'fontStretch', 'supported': false},
{name: 'left', 'supported': false},
{name: 'markerOffset', 'supported': false},
{name: 'marks', 'supported': false},
{name: 'maxHeight', 'supported': false},
{name: 'maxWidth', 'supported': false},
{name: 'minHeight', 'supported': false},
{name: 'minWidth', 'supported': false},
{name: 'orphans', 'supported': false},
{name: 'outline', 'supported': false},
{name: 'outlineColor', 'supported': false},
{name: 'outlineStyle', 'supported': false},
{name: 'outlineWidth', 'supported': false},
{name: 'overflow', 'supported': false},
{name: 'page', 'supported': false},
{name: 'pageBreakAfter', 'supported': false},
{name: 'pageBreakBefore', 'supported': false},
{name: 'pageBreakInside', 'supported': false},
{name: 'pause', 'supported': false},
{name: 'pauseAfter', 'supported': false},
{name: 'pauseBefore', 'supported': false},
{name: 'pitch', 'supported': false},
{name: 'pitchRange', 'supported': false},
{name: 'playDuring', 'supported': false},
{name: 'position', 'supported': false},
{name: 'quotes', 'supported': false},
{name: 'richness', 'supported': false},
{name: 'right', 'supported': false},
{name: 'size', 'supported': false},
{name: 'speak', 'supported': false},
{name: 'speakHeader', 'supported': false},
{name: 'speakNumeral', 'supported': false},
{name: 'speakPunctuation', 'supported': false},
{name: 'speechRate', 'supported': false},
{name: 'stress', 'supported': false},
{name: 'tableLayout', 'supported': false},
{name: 'textShadow', 'supported': false},
{name: 'top', 'supported': false},
{name: 'unicodeBidi', 'supported': false},
{name: 'visibility', 'supported': false},
{name: 'voiceFamily', 'supported': false},
{name: 'volume', 'supported': false},
{name: 'widows', 'supported': false},
{name: 'zIndex', 'supported': false}
]
};
function supports(object, featureSet)
{
var i;
var features = _FEATURES[featureSet];
var level = 0;
if (!features)
return level;
for (i = 0; i < features.length; i++)
if (typeof(object[features[i].name]) != 'undefined')
{
features[i].supported = true;
++level;
}
return Math.floor( (100 * level) / features.length );
}
function generateReport(object, featureSet, description)
{
var i;
var features = _FEATURES[featureSet];
document.write('<p><b>' + featureSet + ' support for properties/methods in ' + description + ', percentage of names defined = ' + supports(object, featureSet) + '%<\/b><\/p>');
document.write('<table cellspacing="0">');
for (i = 0; i < features.length; i++)
{
if (features[i].supported)
document.write('<tr><td>' + features[i].name + '<\/td><td>' + features[i].supported + '<\/td><\/tr>');
else
document.write('<tr><td>' + features[i].name + '<\/td><td style="background-color:red">' + features[i].supported + '<\/td><\/tr>');
}
document.write('<\/table>');
}
var oldonerror = window.onerror; // suppress error messages...
window.onerror = null;
document.write('<p><b> Your browser ' + navigator.userAgent + '<\/b><\/p>');
generateReport(document, 'DOMCORE1', 'document');
generateReport(document, 'DOMCORE2', 'document');
generateReport(document, 'DOMHTML', 'document');
generateReport(document.body.style, 'DOMCSS1', 'document.body.style');
generateReport(document.body.style, 'DOMCSS2', 'document.body.style');
window.onerror = oldonerror;
//-->
</script>
See also
- Browser Detection and Cross Browser Support
- Comparison of layout engines
- Web Specifications Supported in Opera 9
- What's New in Internet Explorer 7 (Script)
Original Document Information
- Author(s): (Unknown)
- Last Updated Date: Updated March 16, 2003
- Copyright Information: Copyright © 2001-2003 Netscape.
- Note: This reprinted article was originally part of the DevEdge site.
Document Tags and Contributors
Tags:
Contributors to this page:
Sheppy,
kohei.yoshino,
George3,
Brettz9,
PkpQ6u,
Dria,
Mathieu Deaudelin,
CitizenK
Last updated by:
Sheppy,