关于jQuery通过ID获取元素时在IE7与IE其他版本以及其他浏览器的区别

最近做了一个需求，发现一个现象，跟大伙分享一下，如果有说得不对之处请大伙指正，需求大致如下：

界面展示一个Json列表，每一行都要根据Json中的数据做一些样式上面的特殊处理。

起初也没有考虑太多，直接就是在ajax完成的回调函数中添加如下代码：

for(var i=0;i<json.rows.length;i++){
if(json.rows[i].maxOvdTerms!="0"||json.rows[i].maxOvdDays!="0"){
jQuery("#drawndnTable tr").eq(i).addClass("fontOrange");
}
}

但代码上线后发现，IE7下面就永远只有第一条满足条件的数据样式被改变了，IE的其他版本和其他浏览器均正常。

这就郁闷了，有想过会不会是回调函数中的JS代码阻碍了Json数据的渲染，Json数据没有没有全部渲染出来而导致

jQuery无法正确获取到对象，有了这个想法就立马验证了一把，虽然发现IE与chrome和firefox对Json的渲染有所不同，

验证结果为：

IE下面，是待得回调函数走完时才会将Json数据渲染到界面，而chrome和firefox则是先渲染完再执行回调函数。

但这并不是问题所在。

之后无意之中在html源码中看到有多个ID=drawndnTable的元素，而这正是我要找的元素，为什么会产生多个ID一样的

元素在这里不多说了，是UI产生的，而且这个drawndnTable标识是我必须需要的。

之后通过慢慢验证发现，虽然html元素中的ID属性是唯一的；

但jQuery通过ID属性元素时，IE7和IE8、IE9、chrome、firefox有一定的区别

如：

当html界面的多个元素ID都为A时；

在IE7下面通过jQuery("#A")的形式永远只会获取到众多ID相同中第一个html元素；

而在其他版本和浏览器中，会将所有元素ID都等于A的了元素组装成一个Array，就像下面这样：

Html界面中有3个table元素，ID都为B，每个表都有一行row，通过jQuery("#B tr")的形式就能

获得3行，而如果是IE7下面则只能获取到一行。

知道这一点后，我就将ID=drawndnTable改成name=drawndnTable，代码改成如下方式

for(var i=0;i<json.rows.length;i++){
if(json.rows[i].maxOvdTerms!="0"||json.rows[i].maxOvdDays!="0"){
jQuery("table[name='drawndnTable']").eq(i).addClass("fontOrange");
}
}