一些实用的js高级技巧

技巧一之setTimeout. 

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

(function () { 
var i = 0; 
function job() { 
console.log(i++); 
if (i < 10) { 
setTimeout(job, 1000); 
} 
} 
job(); 
})(); 

　　

上面这个job函数就只会乖乖的执行10次.然后自动停止 
技巧二之高效的for循环 
应用案例:抛弃传统的循环方式 

(function () { 
var arr=[]; 
for(var i=arr.length;i--;){ 
doStuff(); 
} 
})(); 

　　

这个方式为什么高效? 
一:少了一个参数l=arr.length; 
二:for语句中间那个玩意少进行了一次计算,以前的话是for(i=0;i<l;i++)这样的话中间的语句会先比较i<l 然后比较出来的结果在 
跟true 或者false比较,自然多了次计算 
技巧三之高效赋值 
应用案例:抛弃传统的if判断赋值 

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

　　

以上代码会很神奇的告诉你ret会是true.高效吧不用if(i!==1)了在赋值了 
技巧四之强悍的简短的attr 
应用案例:setAttribute,getAttribute.这个方法不仅可以设置标准的属性,还可以设置任意属性,兼容好 

function attr(elem, name, value) { 
var ret; 
if (value) { 
if (/msie [6-7]\.0/i.test(navigator.userAgent)) { 
ret = elem.getAttributeNode(name); 
if (!ret) { //ie6 7不合法的属性设置捕鸟,通过这里可以设置 
ret = document.createAttribute(name); 
elem.setAttributeNode(ret); 
} 
ret.nodeValue = value + ""; 
} else { 
elem.setAttribute(name, value); 
} 
return elem; 
} else { //ie6 7有得属性获取不鸟 
ret = elem.getAttribute(name); 
fixIe = elem.getAttributeNode(name).nodeValue; 
ret = ret ? ret : fixIe ? fixIe : undefined; 
return ret; 
} 
} 

　　

以上方法如何测试呢? 
attr(document.getElementById("test"), "classxx", "xx") 
alert(attr(document.getElementById("test"),"classxx")); 
技巧五之getElementsByClassName. 
应用案例 :

(function () { 
var getElementsByClassName=function(cls,context){ 
var root = context || document; 
return document.querySelectorAll ? root.querySelectorAll("." + cls) : root.getElementsByClassName ? 
root.getElementsByClassName(cls) : help("*", cls, context); 
} 
var help=function(tagName,cls,context){ 
var root= context || document, 
ret=[],elems,i, 
rcls=new RegExp("^|\\s+"+cls+"\\s+|$"); 
elems = root.getElementsByTagName(tagName || "*"); 
for(i=elems.length;i--;){ 
if(rcls.test(elem[i].className)){ 
ret.push(elems[i]); 
} 
} 
return ret; 
} 
})();