Js编程原则和良好习惯

1、预留退路：在禁止Js或者Js不被支持的情况下，网页还能正常工作。也就是说，虽然某些功能无法使用，但最基本的操作仍能顺利完成。

案例：点击链接，打开一个新窗口。

就如本站的登录(弹出一个模拟窗口)，与其让用户在点击链接的时候被带离当前页面，不如让用户仍停留在当前页面，并用一个弹出窗口来显示相关信息，这无疑是一种更好的解决方法。

一些错误的写法：

伪协议：<a href="javascript:showWindow('login', this.href);" >登录</a>

内嵌事件处理函数：<a href="#" this.href); return false;">登录</a>

javascript:伪协议是人们对非标准化通信机制的统称，伪协议让我们可以通过一个链接来调用Js函数。

这种做法的不好之处在于，如果伪协议不被支持或Js被禁止了，那么这段代码就不能执行，也就没意义了。

好的写法：

<a href="member.php?mod=logging&action=login" this.href); return false;">登录</a>

更好的做法是将Js代码与HTML文档分离开来。

把href属性设置为真实存在的URL地址后，即使Js被禁止或遇到爬虫，这个链接仍是可用的。

2、结构与行为分离:把网页的结构和内容与Js脚本的动作行为分开。

所谓的"循序渐进"就是用一些额外的信息层去包裹原始数据的做法。对于一个网站来说，内容就是一切，但是也不能直接将原始内容发布到网络上，而不加任何描述和修饰。

给内容加上正确的HTML标记是很重要的，也就是语义化，所以说，标记良好的内容就是一切。

还是上个案例：

html代码:

<a href="member.php?mod=logging&action=login" class="login">登录</a>

Js代码:

window.onload=function(){

        var links=document.getElementsByTagName('a');

        for(var i=0,len=links.length;i<len;i++){

               if('login'===links[i].getAttribute('class')){

                     links[i].onclick=function(){

                           showWindow('login', this.href);

                           return false;

3、向后兼容性:确保老版本的浏览器不会因为你的Js脚本而崩溃。

一些浏览器可能无法理解DOM提供的方法和属性，那么就需要在脚本里对浏览器的Js支持程度进行检测。

这有点儿像游乐园里的警告牌:"你必须达到这一身高才能参与这项游乐活动。"换句话说，需要在Js脚本里表达出这样的含义:"你必须理解这个方法或属性，才能执行这些语句"。

一个有效的检测方法就是对象检测(object detection):把某个方法打包在一个if语句里，然后根据条件表达式的结果是true(存在)还是false(不存在)，决定应该采取怎样的行动。

window.onload=function()http://www.huiyi8.com/moban/ 网站模板

     if(!document.getElementsByTagName)  return false;

     var links=document.getElementsByTagName('a');

     for(var i=0,len=links.length;i<len;i++){

           if('login'===links[i].getAttribute('class')){

               links[i].onclick=function(){

                   showWindow('login', this.href);

                   return false;