IE 下 href 的 BUG

作者:blank 来源:怿飞blog 时间:2008-11-10 12:32:00 

在浏览器 IE6 、IE7、Firefox2+、Firefpx3+、Opera9.6+、Safari3.1+中测试以下代码:


 

<div id="test">
    <a href="#"> test </a>
</div>
<div id="result"></div>

<script type="text/javascript">
(function(){
    var test = document.getElementById('test');
    alert(test.innerHTML);

    var result =  document.getElementById('result');
    result.innerHTML = test.innerHTML;
    alert(result.innerHTML)
})();
</script>

结果会发现,在 IE6、IE7 浏览器中第二次弹出的 result.innerHTML 中的 A 元素的 href 值成为了绝对路径。

其实先人们早遇到这些问题(感谢 玉伯 提供的资料):

在上面的文章中已提及了处理方案,就是在 IE 下使用 getAttribute( ‘href’ , 2 ) 方法。 Microsoft 给此方法扩展了第二个参数,可设置为 0、1、2,如果设置为 2 ,则返回属性原始值。

脚本修正为:

(function(){
    var test = document.getElementById('test');
    alert(test.innerHTML);

    var result =  document.getElementById('result');
    result.innerHTML = test.innerHTML;

    if(/*@cc_on!@*/0 ) { //if ie
        var links1 = test.getElementsByTagName('a');
        var links2 = result.getElementsByTagName('a');
        for(var i = 0, len = links1.length; i < len; ++i ) {
            links2[i].href = links1[i].getAttribute('href', 2);
        }
    }

    alert(result.innerHTML);

})();

在寻找此问题的过程中还搜索到 Hedger Wang 发现的一个有趣的 BUG 问题:在 IE 中当重新设置新的 href 属性值时,如果链接文字含有 “http://” 或 “@” ,则其 innerHTML 将显示不正确,显示成设置的 href 属性。

解决方法(sHref 为要设置的 href 新值):

sHref = 'http://www.hedgerwow.com';
var isMSIE = /*@cc_on!@*/false;
if( isMSIE ){
    sHref = ' ' + sHref; //add extra space before the new href
};

 

标签:bug,href,ie,浏览器
0
投稿

猜你喜欢

  • MySQL事务与隔离级别的使用基础理论

    2024-01-23 20:14:49
  • python Opencv计算图像相似度过程解析

    2022-02-02 03:56:52
  • 快速了解Python相对导入

    2023-07-29 18:35:30
  • HTTP 错误 500.100 - 内部服务器错误 - ASP 错误

    2008-09-12 13:07:00
  • Python 多线程处理任务实例

    2021-06-25 04:50:05
  • 简单的asp采集代码教程

    2011-04-18 10:39:00
  • Oracle 9i产品文档

    2010-07-16 13:35:00
  • Python生成随机数的方法详解(最全)

    2023-05-04 12:36:08
  • Pytorch框架之one_hot编码函数解读

    2023-02-16 11:34:05
  • Python打包为exe详细教程

    2023-08-23 03:00:21
  • pandas to_excel 添加颜色操作

    2021-07-19 19:49:57
  • 详解MySQL中的数据类型和schema优化

    2024-01-28 04:29:11
  • 让IE6更快的走向灭亡

    2010-02-03 15:05:00
  • educoder之Python数值计算库Numpy图像处理详解

    2023-12-06 03:49:32
  • go swagger生成接口文档使用教程

    2023-10-20 12:31:35
  • Go语言学习之Switch语句的使用

    2024-04-23 09:38:57
  • 使用python tkinter实现各种个样的撩妹鼠标拖尾效果

    2022-03-10 11:32:31
  • python安装及变量名介绍详解

    2023-09-24 19:23:20
  • golang实现unicode转换为字符串string的方法

    2024-05-09 09:30:44
  • 最新解决没有NVSMI文件夹以及nvidia-smi‘ 不是内部或外部命令也不是可运行的程序或批处理文件

    2023-03-26 18:13:34
  • asp之家 网络编程 m.aspxhome.com