打印

BT9030: 只有 IE 的 HTMLElement 有 mergeAttributes 与 clearAttributes 方法

作者:王军

标准参考

无。

问题描述

只有 IE 的 HTMLElement 有 mergeAttributes 与 clearAttributes 方法,其他浏览器则不支持。

造成的影响

该问题将造成某些使用本特性设计的功能在非 IE 浏览器中不能实现。

受影响的浏览器

IE6 IE7 IE8

问题分析

Element.mergeAttributes 与 Element.clearAttributes 是 IE 浏览器的特性,简介如下:

mergeAttributes
用于复制一个元素的所有附加属性到另一个元素。可以选择是否也复制 id 属性(attributes)以防止 id 冲突。
clearAttributes
用于清除一个元素的所有附加属性(attributes),但 id、style 和脚本特性(properties)除外。

关于 mergeAttributes 的更多信息,请参考 MSDN mergeAttributes Method
关于 clearAttributes 的更多信息,请参考 MSDN clearAttributes Method

解决方案

尽量避免使用 IE 独有的这两个方法编写代码,改用标准方法 setAttribute 和 removeAttribute 单独设置和删除属性来实现需求。

若有必要在非 IE 浏览器中使用这两个方法,请参考以下实现:

if(window.Element){
  !Element.prototype.clearAttribute && (Element.prototype.clearAttributes = function(){
    var attrs = this.attributes,
      i = attrs.length - 1;
    for(;i>=0;i--){
      var name = attrs[i].name.toLowerCase();
      if(/id|style/.test(name) || (/on[a-zA-Z]+/.test(name) && typeof this[name] === 'function'))
        continue;
      this.removeAttribute(name);
    }
  })
  
  !Element.prototype.mergeAttribute && (Element.prototype.mergeAttributes = function(src){
    var bPreserve = arguments[1] === undefined ? true : arguments[1],
      attrs = src.attributes,
      i = attrs.length - 1;
    for(;i>=0;i--){
      var name = attrs[i].name;
      if(bPreserve && name.toLowerCase() === 'id')
        continue;
      this.setAttribute(name, attrs[i].value);
    }
  })
}    

参见

知识库

相关问题

测试环境

操作系统版本: Windows 7 Ultimate build 7600
浏览器版本: IE6
IE7
IE8
Firefox 3.6
Chrome 4.0.302.3 dev
Safari 4.0.4
Opera 10.51
测试页面: clearAttributes.html
mergeAttributes.html
本文更新时间: 2010-07-02

关键字

mergeAttributes clearAttributes addAttribute removeAttribute