<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<script>
//思路代码实现
function displayAccesskey(){
if (!document.getElementsByTagName || !document.createElement || !document.createTextNode) returen false;
//取得文档中所有链接
var links = document.getElementsByTagName('a');
//创建一个数组,保存访问键
var akeys = new Array();
//遍历链接
for(var i=0;i<links.length;i++){
var current_link = links[i];
if(!current_link.getAttribute('accesskey') continue;
//取得accesskey值
var key = current_link.getAttribute('accesskey');
//取得链接本文
var text = current_link.lastChild.nodeValue;
//添加到数组
akeys[key] = text;
} //创建列表
var list = document.createElement('ul');
for(key in akeys){ var text = akeys[key];
//创建放到列表项中的字符串
var str = key+":"+text;
//创建列表项
var item = document.createElement('li');
var item_text = document.createTextNode(str);
item.appendChild(item_text);
//把列表项添加到列表中
list.appendChild(item);
} //创建标题
var header = document.createElement('h3');
var header_text = document.createTextNode('accesskeys');
header.appendChild(header_text);
//把标题添加到页面主体
document.body.appendChild(header);
//把列表添加到页面主体
document.body.appendChild(list); }
</script>
<a href="index.html" accesskey="1">HOME</a>
<p>快捷键网站:www.clagnut.com/blog/193/</p>
<p> accesskey='1' 返回本网站主页
accesskey='2' 后退到前一个页面
accesskey='4' 打开本网站的搜索表单/页面
accesskey='9' 本网站联系方法
accesskey='0' 查看本网站的快捷键清单
</p>
<ul>
<li><a href="index.html" accesskey="1">home</a></li>
<li><a href="search.html" accesskey="4">search</a></li>
<li><a href="Contact.html" accesskey="9">Contact</a></li>
</ul> 注:利用DOM技术 动态创建一份快捷键清单 (思路) 1,把文档里所有链接全部提取打一个节点集合里面
2,遍历这个节点集合里面的所有链接
3,如果某个链接带有acesskey属性,就把它的值保存起来
4,把这个链接在浏览器窗口里的屏显标识文字也保存起来
5,创建一个清单
6,为拥有快捷键的各个链接分别创建一个列表项 li元素
7,把列表项添加到 ‘快捷键清单’。
8,把 ’快捷键清单‘添加到文档里 </body>
</html>
05-08 08:11