innerHTML 和 getElementsByName 在IE下面的bug 的解决
更新时间：2010年04月09日 13:04:21 作者：
innerHTML 真的一个麻烦的东西。IE 和 firefox 对dom 处理的方式不是很一样。IE 对动态加载的很多dom 不支持动态更新。
比如有这样一个问题。
<div id="playlist">
</div>
在这div 中，加入一个播放吗列表。这列表用innerHTML 加入。
var plst = null;
plst = player.getPlaylist();
if (plst) {
var txt = '';
for(var i in plst) {
txt += '<a name="fv_item_a_' + i + '"></a><div class="fv_item" id="fv_item_'+ i +'"><div class="playing_bg" name="playing_bg"></div>';
txt += '<div class="playing" name="playing">正在播放...</div>';
txt += '<img src="' + plst[i].image + '" width="80" height="50" class="fv_playlist_img" />';
txt += '<p class="fv_playlist_title"> ' + plst[i].title + ' </p>';
txt += "</div>";
}
var obj= document.getElementById("playlist");
if (obj) {
obj.innerHTML = txt;
}
}
中间的复杂代码不用去管了，现在我要把name 为 playing 的 div 取出来。很容易想到用
getElementsByName
但是，非常奇怪的是，在ie 下面 就是 取不到。getElementById 完全可以用。
下面是一个不错的解决方案：
function GetElementsByName(tag, name) {
var elem = document.getElementsByTagName(tag);
var arr = [];
var index = 0;
var l = elem.length;
for(var i = 0; i < l; i++)
{
var att = elem[i].getAttribute("name");
if(att == name) {
arr[index++] = elem[i];
}
}
return arr;
}
改成这个函数，就可以取了。只是要多一个参数了。
不知道博友们还有没有其他的解决方案，这个解决方案不是很完美。一定要在评论里面留言一下。
复制代码 代码如下:
<div id="playlist">
</div>
在这div 中，加入一个播放吗列表。这列表用innerHTML 加入。
复制代码 代码如下:
var plst = null;
plst = player.getPlaylist();
if (plst) {
var txt = '';
for(var i in plst) {
txt += '<a name="fv_item_a_' + i + '"></a><div class="fv_item" id="fv_item_'+ i +'"><div class="playing_bg" name="playing_bg"></div>';
txt += '<div class="playing" name="playing">正在播放...</div>';
txt += '<img src="' + plst[i].image + '" width="80" height="50" class="fv_playlist_img" />';
txt += '<p class="fv_playlist_title"> ' + plst[i].title + ' </p>';
txt += "</div>";
}
var obj= document.getElementById("playlist");
if (obj) {
obj.innerHTML = txt;
}
}
中间的复杂代码不用去管了，现在我要把name 为 playing 的 div 取出来。很容易想到用
getElementsByName
但是，非常奇怪的是，在ie 下面 就是 取不到。getElementById 完全可以用。
下面是一个不错的解决方案：
复制代码 代码如下:
function GetElementsByName(tag, name) {
var elem = document.getElementsByTagName(tag);
var arr = [];
var index = 0;
var l = elem.length;
for(var i = 0; i < l; i++)
{
var att = elem[i].getAttribute("name");
if(att == name) {
arr[index++] = elem[i];
}
}
return arr;
}
改成这个函数，就可以取了。只是要多一个参数了。
不知道博友们还有没有其他的解决方案，这个解决方案不是很完美。一定要在评论里面留言一下。
您可能感兴趣的文章:
- js的.innerHTML = ""IE9下显示有错误的解决方法
- IE6-IE9不支持table.innerHTML的解决方法分享
- IE6/7/8/9中Table/Select的innerHTML不能赋值的解决方法
- 仅IE6/7/8中innerHTML返回值忽略英文空格的问题
- Javascript在IE下设置innerHTML时出现未知的运行时错误的解决方法
- 解决IE下select标签innerHTML插入option的BUG（兼容IE,FF,Opera,Chrome,Safari)
- IE bug table元素的innerHTML
- JS 动态获取节点代码innerHTML分析 [IE,FF]
- IE 下的只读 innerHTML
- IE innerHTML,outerHTML所引起的问题
- IE6与IE7中，innerHTML获取param的区别
- IE6/IE7/IE8/IE9中tbody的innerHTML不能赋值的完美解决方案
相关文章
这篇文章主要介绍了javascript实现的一个带下拉框功能的文本框,需要的朋友可以参考下2014-05-05
这篇文章主要为大家详细介绍了javascript实现列表切换效果的相关资料,需要的朋友可以参考下2016-05-05
坐标轴刻度作为直角坐标系中重要的组成部分,我们需要学会合理的设置坐标轴的刻度,下面这篇文章主要给大家介绍了关于坐标轴刻度取值算法之源于echarts的y轴刻度计算需求的相关资料,需要的朋友可以参考下2022-06-06
下面小编就为大家带来一篇JS当前页面登录注册框,固定DIV,底层阴影的实例代码。小编觉得挺不错的，现在就分享给大家，也给大家做个参考。一起跟随小编过来看看吧2016-09-09
这篇文章主要介绍了JavaScript检测浏览器是否支持CSS变量代码实例,文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下2020-04-04
今天小编就为大家分享一篇原生js检测页面加载完毕的实例，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧2018-09-09
FF IE兼容性的修改小结，大家以后在javascript的编写过程中需要注意下。2009-09-09
生命周期是指一个对象从创建→>运行>销毁的整个阶段，强调的是一个时间段，文中介绍了小程序中组件的生命周期，需要的朋友可以参考下2023-03-03
这篇文章主要介绍了JavaScript数组去重算法,结合实例形式总结分析了JavaScript数组去重相关的读写、遍历、比较、排序等操作及算法改进相关实现技巧,需要的朋友可以参考下2018-05-05
这篇文章主要介绍了小程序横屏方案对比，实现横屏的方案也有多种，但是每种方案都有一定的缺陷，恰巧最近也在横屏方案上踩了不少坑，本文就一起来介绍一下吧2020-06-06
最新评论