root/collected/trunk/html-test-cases/getting-tabindex.xhtml

Revision 45, 5.1 kB (checked in by simon, 3 years ago)

made an XHTML version of the getting-tabindex test file

Line 
1<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
2"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
3
4<html xmlns="http://www.w3.org/1999/xhtml">
5
6<head>
7<title>Getting the tabindex value of an element with JavaScript</title>
8<script type="text/javascript">
9function Logger(){
10        this._rows = "";
11}
12Logger.prototype.log = function(desc, mechanism, value){
13        value = (value === null) ? "null" : value;
14        this._rows += "&lt;tr>&lt;td>" + desc + "&lt;\/td>&lt;td>"
15                + mechanism + "&lt;\/td>&lt;td>" + value + "&lt;\/td>&lt;\/tr>\n";
16};
17Logger.prototype.getHTML = function(){
18        return "&lt;table>&lt;thead>"
19                + "&lt;tr>&lt;th>Element&lt;\/th>&lt;th>Mechanism&lt;\/th>&lt;th>Value&lt;\/th>&lt;\/tr>"
20                + "&lt;\/thead>&lt;tbody>\n"
21                + this._rows
22                + "&lt;\/tbody>&lt;\/table>\n";
23};
24Logger.prototype.logGetAttribute = function(id, desc, attr, iFlags){
25        var elem = document.getElementById(id);
26        if(arguments.length == 4){
27                this.log(desc, 'elem.getAttribute("' + attr + '", ' + iFlags + ")",
28                        elem.getAttribute(attr, iFlags));
29        }else{
30                this.log(desc, 'elem.getAttribute("' + attr + '")',
31                        elem.getAttribute(attr));
32        }
33};
34Logger.prototype.logTabindexProperty = function(id, desc){
35        var elem = document.getElementById(id);
36        this.log(desc, "elem.tabindex", elem.tabindex);
37};
38Logger.prototype.logTabIndexProperty = function(id, desc){
39        var elem = document.getElementById(id);
40        this.log(desc, "elem.tabIndex", elem.tabIndex);
41};
42Logger.prototype.logAttributes = function(id, desc, attr){
43        var node = document.getElementById(id).attributes[attr];
44        if(node){
45                this.log(desc, 'elem.attributes["' + attr + '"].nodeValue',
46                        node.nodeValue);
47                this.log(desc, 'elem.attributes["' + attr + '"].specified',
48                        node.specified);
49        }else{
50                this.log(desc, 'elem.attributes["' + attr + '"]', node);
51        }
52};
53Logger.prototype.logGetAttributeNode = function(id, desc, attr){
54        var node = document.getElementById(id).getAttributeNode(attr);
55        if(node){
56                this.log(desc, 'elem.getAttributeNode("' + attr + '").nodeValue',
57                        node.nodeValue);
58                this.log(desc, 'elem.getAttributeNode("' + attr + '").specified',
59                        node.specified);
60        }else{
61                this.log(desc, 'elem.getAttributeNode("' + attr + '")', node);
62        }
63};
64Logger.prototype.logTabindex = function(id, desc){
65        this.logGetAttribute(id, desc, "tabindex");
66        if(isIE()){
67                this.logGetAttribute(id, desc, "tabindex", 0);
68                this.logGetAttribute(id, desc, "tabindex", 1);
69                this.logGetAttribute(id, desc, "tabindex", 2);
70        }
71        this.logGetAttribute(id, desc, "tabIndex");
72        if(isIE()){
73                this.logGetAttribute(id, desc, "tabIndex", 0);
74                this.logGetAttribute(id, desc, "tabIndex", 1);
75                this.logGetAttribute(id, desc, "tabIndex", 2);
76        }
77        this.logTabindexProperty(id, desc);
78        this.logTabIndexProperty(id, desc);
79        this.logAttributes(id, desc, "tabindex");
80        this.logAttributes(id, desc, "tabIndex");
81        this.logGetAttributeNode(id, desc, "tabindex");
82        this.logGetAttributeNode(id, desc, "tabIndex");
83};
84function isIE(){
85        return navigator.userAgent.indexOf("MSIE") != -1;
86}
87function showTableSource(){
88        document.getElementById("source").style.display = "block";
89}
90function removeTabindex(id){
91        var elem = document.getElementById(id);
92        if(isIE){
93                elem.removeAttribute("tabIndex");
94        }else{
95                elem.removeAttribute("tabindex");
96        }
97}
98function run(){
99        var userAgentTextNode = document.createTextNode(navigator.userAgent);
100        document.getElementById("userAgent").appendChild(userAgentTextNode);
101        removeTabindex("div-tabindex-removed");
102        removeTabindex("input-tabindex-removed");
103        logger = new Logger();
104        logger.logTabindex("div-no-tabindex", "div with no tabindex");
105        logger.logTabindex("div-tabindex-1", 'div with tabindex="1"');
106        logger.logTabindex("div-tabindex-minus-1", 'div with tabindex="-1"');
107        logger.logTabindex("div-tabindex-removed", "div with tabindex removed");
108        logger.logTabindex("input-no-tabindex", "input with no tabindex");
109        logger.logTabindex("input-tabindex-1", 'input with tabindex="1"');
110        logger.logTabindex("input-tabindex-minus-1", 'input with tabindex="-1"');
111        logger.logTabindex("input-tabindex-removed", "input with tabindex removed");
112        document.getElementById("log").innerHTML = logger.getHTML();
113        var sourceTextNode = document.createTextNode(logger.getHTML());
114        document.getElementById("source").appendChild(sourceTextNode);
115}
116</script>
117</head>
118
119<body onload="run()">
120<h2>User agent</h2>
121<div id="userAgent"></div>
122<h2>Results</h2>
123<div id="log"></div>
124<hr/>
125<div><button onclick="showTableSource()">Show table source</button></div>
126<pre id="source" style="display:none"></pre>
127<hr/>
128<div id="div-no-tabindex">div with no tabindex</div>
129<div id="div-tabindex-1" tabindex="1">div with tabindex="1"</div>
130<div id="div-tabindex-minus-1" tabindex="-1">div with tabindex="-1"</div>
131<div id="div-tabindex-removed" tabindex="1">div with tabindex removed</div>
132<div>
133<input id="input-no-tabindex" value="input with no tabindex"/>
134<input id="input-tabindex-1" tabindex="1" value='input with tabindex="1"'/>
135<input id="input-tabindex-minus-1" tabindex="-1" value='input with tabindex="-1"'/>
136<input id="input-tabindex-removed" tabindex="1" value="input with tabindex removed"/>
137</div>
138</body>
139
140</html>
Note: See TracBrowser for help on using the browser.