JavascriptDOM编程艺术学习笔记2

平稳退化：正确的使用JS脚本，可以让访问者在他们的浏览器不支持JS的 轻快下仍然顺利的浏览网站。
<a href ="http://www.example.com/" onclick="popUp(this.href;return false;)">example</a>
href属性设置成了真实存在的URL地址后。既是JS被禁用，这个链接也是可以用的，它并没有彻底失效。这是一个经典的“平稳退化“的例子。

结构与样式分离：作为CSS技术的突出优点，文档结构与文档样式的分离可以确保网页都能平稳退化。可以按照这种原则使用JS。
1，把文档里所有链接全放到一个数组里，
2，遍历数组
3，如果某个链接的class属性等于popUp,就表示这个链接在被点击时应调用popUp()函数。
于是，A.把这个恶恶链接的href属性值传递个popUp函数；B.取消这个链接的默认行为，不让这个链接把访问者带离当前窗口。

var links=document.getElementsByTagName("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;
            }
        }
    }

以上代码将把调用popUp（）函数的onclick事件添加到有关的链接上。只要把他们存入一个外部JS文件，就等于把这些操作从HTML文档里分离出来了。这就是分离JS的含义。
必须让这些代码在HTML文档全部加载到浏览器之后马上开始执行。
把JS代码打包在prepareLinks函数里，并把这个函数添加到window对象的onload 事件上去：

window.onload=prepareLinks;
function prepareLinks(){
for (var i=0;i<links.length;i++){
    if(links[i].getAttribute("class")=="popUp"){
        links[i].onclick=function(){
            popUp(this.getAttribute("href"));
            return false;
            }
        }
    }
}

避免使用document.write方法

性能考虑
1.尽量少访问DOM和尽量减少标记
不管什么时候，只要查询DOM中的某些元素，浏览器就会搜索整颗树。
2.合并脚本，放置脚本
把所有的<script>都放到文档的末尾，</body>标记之前，就可以让页面变得更快。
3.压缩脚本
几个代表性的压缩代码工具：
DouglasCrockford的JSMin
雅虎的YUICompressor
谷歌的ClosureComplier