去掉网页上链接或按钮的虚线框
经常用鼠标在链接或按钮上点击时会出现虚线框，很多朋友常常想去掉这个不雅的虚线框，但是我个人还是觉得去掉虚线框还是要谨慎为好，为什么呢，因为当你去掉虚线框后表面上确实美观了很多，用鼠标点击链接或按钮时顿觉清爽，但是这同时还带来了可访问性和易用性的下降，为什么这么说呢，因为有些童鞋习惯上用键盘快速的定位并访问相关的链接或按钮，当你去掉虚线框后，就意味着这些对象可能无法获得焦点（focus），或者浏览者可能无法感知到焦点的存在，当然也就不能被定位了。我们不能单纯的去做网站，做网页要考虑的问题很多，特别是做到无障碍浏览往往比较困难，如果真的要去掉虚线框而不失去可访问性的话，解决的方案可以考虑加上accesskey属性，当然旁边可以做些注解或者提示，让访问者能够使用快捷键方式访问这些不能被焦点定位的对象。
下面简单介绍下去掉虚线框的几种方式。
1.CSS样式表的outline属性（IE9、FF等浏览器推荐）
对于最新的IE9浏览器以及FireFox里可以使用outline:none，去掉虚线框，当然FF下还可以写成-moz-outline:none。
遍历class的办法有getElementsByClassName，不过可惜的是IE9以下不支持这个方法，当然有人写过全兼容版本的getElementsByClassName，大家可以看看我这里找到的一个getElementsByClassName
版本。然后在引入getElementsByClassName方法后HTML代码可以这样插入一段脚本了。
123456789101112
<!--[if lt IE 9]><script type="text/javascript">addDOMLoadEvent( function() { var anchors = getElementsByClassName('hidefocus');for (var i=0; i<anchors.length; i++) {anchors[i].hideFocus = true;} });</script><![endif]-->这里的addDOMLoadEvent可以参考《使用DOMContentLoaded取代部分window.onload》，关于if lt IE 9条件注释可以参考《CSS设置样式时区分不同版本IE的办法》。这样这段脚本就专门针对IE9及以下浏览器的class为hidefocus设置.hideFocus = true的属性，然后配合CSS的outline:none，基本就完美了。
您可能对这些也感兴趣