上一篇随笔中记录了用JavaScript建一个基础图片库，但实际上还有很多地方可以改进。第五章将逐步进行改进，这一章里需要明白的道理是达到目标的过程和达到目标同样重要~
第五章：最佳实践
5.1 过去的错误
如果要使用JavaScript，就要确认，这么做对于用户的浏览体验产生怎样的影响，如果用户的浏览器不支持JavaScript怎么办？
5.2 平稳退化
平稳退化：如果正确使用JavaScript脚本，就可以让访问者在他们的浏览器不支持JavaScript的情况下仍能顺利访问你的网站。即，虽然某些功能无法使用，但最基本的操作仍然能顺利完成。
例子：在新窗口里打开一个链接。（点击某个链接时弹出一个新窗口）
ps：应该旨在绝对必要的情况下才使用弹出窗口，因为这将牵涉到网页的可访问性问题。
window.open(URL,name,features);
//三个参数都是可选
//第一个参数代表想在新窗口中打开的URL地址，如果省略，将打开空白的窗口。
//第二个参数是新窗口的名字。可以通过这个名字与新窗口通信。
//第三个参数是以逗号分隔的字符串，其内容是新窗口的各种属性。原则：新窗口的浏览功能要少而精。
一个典型应用：
function popUp(winURL){//将打开一个320像素宽，480像素高的新窗口“popup”
window.open(winURL,"popup","width=320,height=480");
}
1. 在 HTML中调用此函数的一个方法就是使用“javascript: ”伪协议，让我们通过一个链接来调用JavaScript函数。
<a href="javascript:popUp('https://www.baidu.com')">example</a>
在较老的浏览器中尝试打开链接但失败，支持这种伪协议但禁用JavaScript的浏览器会什么也不做。总之这种方式不好。
2. 用onclick事件处理函数来调用popUp函数。
<a href="#" onclick="popUp('https://www.baidu.com');return false;">example</a>
也不能平稳退化。
3. 第2种的改进，满足平稳退化
<a href="https://www.baidu.com" onclick="popUp(this.getAttribute("href"));return false;" >example</a>
5.3 向CSS学习
CSS 层叠样式表，能够帮助你将web文档的内容结构（标记）和版面设计（样式）分离开来，这样能保证页面的平稳退化。
渐进增强：用一些额外的信息层去包裹原始数据。按“渐进增强”原则创建出来的页面几乎都符合平稳退化。
“标记良好的内容就是一切”，即使去掉CSS，文档的内容也可以访问。
5.4 分离JavaScript
之前的JavaScript已经和HTML分开了，问题出在内嵌的事件处理函数中。
<a href="https://www.baidu.com" class="popup">example</a>
window.onload=function(){ //在HTML加载完毕后会触发onload事件
var links=document.getAttributeByTagName("a");//将文档里的所有连接发至到一个数组里。
for (var i=0;i<links.length ;i++ )//遍历数组
{
//如果某个classs属性等于popup，就在这个链接被点击时调用popUp函数。
if (links[i].getAttribute("class")=="popup")
{
links[i].onclick=function(){
popUp(this.getAttribute("href"));
return false;
}
}
}
}
5.5 向后兼容
对象检测：检测浏览器对于JavaScript的支持程度。
window.onload=function(){
if (!document.getAttributeByTagName)//检测 浏览器是否支持getAttributeByTagName这个方法
{
return false;
}
var links=document.getAttributeByTagName("a");
for (var i=0;i<links.length ;i++ )
{
if (links[i].getAttribute("class")=="popup")
{
links[i].onclick=function(){
popUp(this.getAttribute("href"));
return false
}
}
}
}
5.6 性能考虑
尽量减访问DOM，尽量减少标记。
合并和放置脚本。
压缩脚本。
5.7 小结
平稳退化。
分离JavaScript。
向后兼容。
性能考虑。