转：五段实用的js淫荡技巧

奇技淫巧？其实不能算是什么特别的东西，但有些小技巧还是可以试试的，比如说第一个，我们一般都会是用setInterval，然后每1秒执行一次，10秒后取消，但setTimeout也可以。只是意义不大而已喽
原文来自：http://www.cnblogs.com/nothingbrother/archive/2011/12/19/2293131.html

应用案例:比如你想一个函数循环执行10次,怎么办?以前通常是先setInterval,然后clearInterval,技巧一就是克服这个问题

JavaScript代码

1. (function () {  
2.     var i = 0;  
3.     function job() {  
4.         console.log(i++);  
5.         if (i < 10) {  
6.             setTimeout(job, 1000);  
7.         }  
8.     }  
9.     job();  
10.       
11. })();  

上面这个job函数就只会乖乖的执行10次.然后自动停止

技巧二之高效的for循环 

应用案例:抛弃传统的循环方式

JavaScript代码

1. (function () {  
2.    var arr=[];  
3.    for(var i=arr.length;i--;){  
4.       doStuff();  
5.    }  
6. })();  

这个方式为什么高效?

一:少了一个参数l=arr.length;

二:for语句中间那个玩意少进行了一次计算,以前的话是for(i=0;i

跟true 或者false比较,自然多了次计算

技巧三之高效赋值 

应用案例:抛弃传统的if判断赋值

JavaScript代码

1. var i=1,ret;  
2.   ret=i!==1||true;  
3.   console.log(ret);  

以上代码会很神奇的告诉你ret会是true.高效吧不用if(i!==1)了在赋值了

技巧四之强悍的简短的attr 

应用案例:setAttribute,getAttribute.这个方法不仅可以设置标准的属性,还可以设置任意属性,兼容好

JavaScript代码

1. function attr(elem, name, value) {  
2.     var ret;  
3.     if (value) {  
4.         if (/msie [6-7]\.0/i.test(navigator.userAgent)) {  
5.             ret = elem.getAttributeNode(name);  
6.             if (!ret) {   //ie6 7不合法的属性设置捕鸟,通过这里可以设置  
7.                 ret = document.createAttribute(name);  
8.                 elem.setAttributeNode(ret);  
9.             }  
10.             ret.nodeValue = value + "";  
11.         } else {  
12.             elem.setAttribute(name, value);  
13.         }  
14.         return elem;  
15.     } else {  //ie6 7有得属性获取不鸟  
16.         ret = elem.getAttribute(name);  
17.         fixIe = elem.getAttributeNode(name).nodeValue;  
18.         ret = ret ? ret : fixIe ? fixIe : undefined;  
19.         return ret;  
20.     }  
21. }  

以上方法如何测试呢?

 attr(document.getElementById("test"), "classxx", "xx")
 alert(attr(document.getElementById("test"),"classxx"));

技巧五之getElementsByClassName. 

应用案例 :以前js没什么框架的时候,大家都再模仿这个方法,看看今天我是怎么高效的模仿出它来.这也不愧是js初学者的经典代码

JavaScript代码

1. (function () {  
2.    var getElementsByClassName=function(cls,context){  
3.       var root = context || document;  
4.     return document.querySelectorAll ? root.querySelectorAll("." + cls) : root.getElementsByClassName ?  
5.            root.getElementsByClassName(cls) : help("*", cls, context);  
6.    }  
7.    var help=function(tagName,cls,context){  
8.         var root= context || document,  
9.             ret=[],elems,i,  
10.             rcls=new RegExp("^|\\s+"+cls+"\\s+|$");  
11.         elems = root.getElementsByTagName(tagName || "*");  
12.         for(i=elems.length;i--;){  
13.             if(rcls.test(elem[i].className)){  
14.               ret.push(elems[i]);  
15.             }  
16.         }  
17.         return ret;  
18.    }  
19. })();  

以上几个js淫荡技巧还是蛮实用的,前提是你没用使用别人的js框架,用原生创造效率为前提的代码.

----------

上面的代码其实真要说的话也就这样样了，但如果你以前没有接触过原生代码，还是可以折腾的。比如最后一个函数，在JS的高版本中（或者说FF5以上，Safari5以上，）都在支持了querySelector了。这个玩意可是直接支持.class或者#id之类（就象jQuery的选择器）

多学一点东西还是有好处的。