IE6的getElementById bug
作为DOM最核心的选择器竟然在IE6中有bug，这是何等令人汗颜的事。此bug会在返回第一个id或name等于我们传入id的元素。
因此，我们取得元素后判定一下它是用name取得的还是用id取得。方法很简单，看看此元素是否显示为id赋值，并且此id值是否等于我们传入的id。如果没有我们就用document.all["XXX"]返回页面上所有id或name等于XXX的元素，逐个比较它的id是否等于我们的传入id。
var getElementById = function(id){
var el = document.getElementById(id);
if(!+"\v1"){
if(el && el.id === id){
return el
}else{
var els = document.all[id],n = els.length;
for(var i=0;i<n;i++){
if(els[i].id === id){
return els[i]
}
}
}
}
return el;
}
方法很完美是不是，但此判定方法在IE6，IE7中我们遭遇另一个bug的狙击。IE的bug总是官官相卫。表单元素的id值不能为"id"。另，如果是直接用.id的方式来取值，无论是在IE还是标准浏览器，都无法取得正确值，而是返回元素本身的toString()。
在标准浏览器中，它会弹出：myForm1,myForm2,myForm1,[object HTMLInputElement]。
在IE8的IE7兼容模式中，它会弹出：myForm1,[object HTMLInputElement],myForm1,[object HTMLInputElement]。
在IE6中，它则弹出myForm1,object,myForm2,object。
看来.id与getAttribute("id")都不保险，我们还可以用attributes["id"]与getAttributeNode("id")，它们都返回一个节点，我们再调用它的value就可以正确取得id值了。
var getElementById = function(id){
var el = document.getElementById(id);
if(!+"\v1"){
if(el && el.attributes['id'].value === id){
return el
}else{
var els = document.all[id],n = els.length;
for(var i=0;i<n;i++){
if(els[i].attributes['id'].value === id){
return els[i]
}
}
}
}
return el;
}
好了，我们测试一下这个修改版getElementById的效果吧。
PS：最后提一提另一个重要的原生查找API，getElementsByName，IE6与Opera7.5在这个方法上存在更多的Bug,首先它们会返回id等于给定值的元素，其次它们仅仅返回input元素与img元素。由于我基本不用它，修正方法就交由那些对它感兴趣的人吧。