让js编程跟上浏览器改朝换代--性能优化

其实让javascript这种发展了很多年的历史的语言，很多代码多让人写了，基本你要的问题在网上都能找到答案！但是浏览器在更新，浏览器对js的支持情况，以及浏览器自身扩展的一些属性的情况下，一些代码将不能用，而也有一些也不那么高性能了！所以很多优秀的Js库也才在不断更新！而这方面也是一个优秀的编程者应该注意到的地方，下面给出几个我在项目过程发现的一些不错的解决兼容性的但比我们之前的方法好的方法：

获取元素的所有子元素，不包含chrome以及firefox下空的textNode

因为chrome跟firefox较新版本的浏览器（而chrome跟firefox大家都会保持比较高地版本）引进了firstElementChild、childElementCount、nextElementSibling等新的属性，而通过这些属性获取将非常高效！所以下面是根据这些新属性写出的获取children的函数！

//getChildren function : because the empty textNodes were distinguished as a childNode but ie not!
//arguments declaration：
//parentNode--the parent of the elements you want to get;
//example:var parent=document.getElementById("par"); var childs=[]; childs=getChildren(parent);
function getChildren(parentNode){
var parentNode=parentNode||document.body;
if(document.all)
return parentNode.child||parentNode.childNodes;
else
{
var childs=[];
var len=parentNode.childElementCount;
var firstElement=parentNode.firstElementChild;
for(var i=len-1;i>=0;i--)
{
childs.push(firstElement);
if(i!=0)
firstElement=firstElement.nextElementSibling;
}
return childs;
}
}

当然大家也会有getFirstChild、getLastChild，getNextSibling的需求吧，其实看上面就知一通百了！

function getFirstChild(parentNode){
var parentNode=parentNode||document.body;
if(br.ie)
return parentNode.firstChild;
else
return parentNode.firstElementChild;

}
function getLastChild(parentNode){
var parentNode=parentNode||document.body;
if(br.ie)
return parentNode.lastChild;
else
return parentNode.lastElementChild;
}
function getNextSibling(node){
if(br.ie)
return node.nextSibling;
else
return node.nextElementSibling;
}

判断浏览器，区别版本（主要是ie9）

总所周知ie是向前兼容做得不是很好的浏览器，ie9出了，解决了很多ie8及以下与别地浏览器不兼容的地方，但同时也抛给我们一个问题，以前在js程序中判断浏览器后就马上执行对应的代码的时代将过去了，你还得再判断一次ie9，将ie9从ie中排除出来。 例如，ie9以下版本new Date(“2011-10-26”).getYear()返回的是2011，但是ie9就学人家chrome了，返回111！

(function(){
br={
ie8:false,//IE
ie9:false,
ff:false,//Firefox
ch:false//Chrome
}
var nav=navigator.userAgent;
if(nav.indexOf("MSIE")){ if(!-[1,]) br.ie8=true; else br.ie9=true;}
else if(nav.indexOf("Firefox")>0) br.ff=true;
else if(nav.indexOf("Chrome")>0) br.ch=true;
}())

轻松通过br.ie8(ie8以下)、br.ie9(ie9)、br.ff(firefox)、br.ch(chrome)判断浏览器！ 最后在附加一个我编程中先加进去的，帮助测试的函数，因为我们经常会传一些对象，而有时这些对象意外为空，而我们却全然不知，还在傻傻的找错，所以只要在有传递对象参数的函数前加上这句判断checkNull(ele)，浏览器就会告诉你，你哪一个函数传递的对象为空了，听方便的！

function checkNull(ele){
try{
var isNull= (ele === undefined || ele == null || ele.length <= 0) ? true : false;
if(isNull)
throw err;
else
return true;
}
catch(err){
if(document.all)//here use br.ie8||br.ie9 if you take the function before</br>
alert("the element you have passed to </br>"+checkNull.caller+"</br>is null")
else
console.log("the element you have passed to </br>"+checkNull.caller+"</br>is null")
}
}