displayAccesskeys function


/ Published in: JavaScript
Save to your folder(s)

JS function that takes the accesskey attribute of the links of the document and display them at the end of the document. Takes no arguments.

From book Dom Scripting by Jeremy Keith.


Copy this code and paste it in your HTML
  1. function displayAccesskeys() {
  2. if (!document.getElementsByTagName || !document.createElement || !document.createTextNode) return false;
  3. // get all the links in the document
  4. var links = document.getElementsByTagName("a");
  5. // create an array to store the accesskeys
  6. var akeys = new Array();
  7. // loop through the links
  8. for (var i=0; i<links.length; i++) {
  9. var current_link = links[i];
  10. // if there is no accesskey attribute, continue the loop
  11. if (current_link.getAttribute("accesskey") == null) continue;
  12. // get the value of the accesskey
  13. var key = current_link.getAttribute("accesskey");
  14. // get the value of the link text
  15. var text = current_link.lastChild.nodeValue;
  16. // add them to the array
  17. akeys[key] = text;
  18. }
  19. // create the list
  20. var list = document.createElement("ul");
  21. // loop through the accesskeys
  22. for (key in akeys) {
  23. var text = akeys[key];
  24. // create the string to put in the list item
  25. var str = key + " : "+text;
  26. // create the list item
  27. var item = document.createElement("li");
  28. var item_text = document.createTextNode(str);
  29. item.appendChild(item_text);
  30. // add the list item to the list
  31. list.appendChild(item);
  32. }
  33. // create a headline
  34. var header = document.createElement("h3");
  35. var header_text = document.createTextNode("Accesskeys");
  36. header.appendChild(header_text);
  37. // add the headline to the body
  38. document.body.appendChild(header);
  39. // add the list to the body
  40. document.body.appendChild(list);
  41. }

Report this snippet


Comments

RSS Icon Subscribe to comments

You need to login to post a comment.