mozilla
Your Search Results

    Browser Feature Detection

    Summary: An experimental approach to discovering degree of support for Standards 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.

    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

    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

    Last updated by: kohei.yoshino,