4

我需要使现有的 Web 应用程序与 IE7 兼容。

该代码element.hasAttribute广泛使用，IE7 使用此方法存在问题。

对象不支持属性或方法“hasattribute”

input如果元素定义了方法，我正在尝试检查代码hasAttribute，如果没有，我正在尝试将其添加到所有input元素。

//create an input element variable << works fine
var myInput = document.createElement("input");

//see if it has the 'hasAttribute' method << condition works fine
if (('hasAttribute' in myInput)==false)
{

    //get all input elements into objInputElements <<works fine
    var objInputElements=document.getElementsByTagName("input");

    // MORE CODE NEEDED - To implement a hasAttribute function for all 
    // elements in the array probably using something
    // like: !!element[attributeName] which works in IE7. See link and notes below.
}

本文介绍如何定义一个单独的函数来执行此操作。但是，我想添加hasattribute但是，如果未定义（这样我不需要更改当前编写的所有代码）

重要提示：表单中有超过 1000 个隐藏输入字段，因此需要以非常有效的方式将“hasattribute”方法添加到元素中。

请让我知道如何实现这一目标。谢谢！

4

3 回答 3

6

由于Element.prototype不支持 IE < 8，因此没有有效的 polyfill 方法hasAttribute。低效的方法（如果你想避免匀场）将是这样的（在所有输入加载后放置）：

<input data-abc="" />
<script>

if (!window.Element || !window.Element.prototype || !window.Element.prototype.hasAttribute) {

(function () {
    function hasAttribute (attrName) {
        return typeof this[attrName] !== 'undefined'; // You may also be able to check getAttribute() against null, though it is possible this could cause problems for any older browsers (if any) which followed the old DOM3 way of returning the empty string for an empty string (yet did not possess hasAttribute as per our checks above). See https://developer.mozilla.org/en-US/docs/Web/API/Element.getAttribute
    }
    var inputs = document.getElementsByTagName('input');
    for (var i = 0; i < inputs.length; i++) {
        inputs[i].hasAttribute = hasAttribute;
    }
}());

}

var inputs = document.getElementsByTagName('input');
document.write(
    'has?' + inputs[0].hasAttribute('abc') // false
);
document.write(
    'has?' + inputs[0].hasAttribute('data-abc') // true
);

</script>
于 2013-10-11T20:00:08.947 回答
0

我知道这是一篇旧文章，也许没有其他人使用 IE7，但如果你像我一样需要它（并且需要使用 ajax 或类似的东西），这是我的建议。

也许我们可以通过创建代理来提高性能， getElementsByTagName或者getElementById这样做，这增加了对在运行时创建的动态元素的支持。

也许是这样的：

if (!window.Element || !window.Element.prototype || !window.Element.prototype.hasAttribute) {
   (function (document) {
      var originalGetElementById = document.getElementById;
      var originalGetElementsByTagName = document.getElementsByTagName;

      // The HasAttribute function.
      function hasAttribute (attrName) {
         return typeof this[attrName] !== 'undefined';
      }

      // Add the HasAttribute to the element if is not present yet.
      function attachFunction (element) {
         if (element && !element.hasAttribute) {
            element.hasAttribute = hasAttribute;
         }
         return element;
      }

      // Proxy of the document.getElementById
      document.getElementById = function (elementId) {
         var element = originalGetElementById(elementId);
         return attachFunction(element);
      }

      // Proxy of the document.getElementsByTagName
      document.originalGetElementsByTagName = function (tagName) {
         var elements = originalGetElementsByTagName(tagName);
         for(var i = 0, len = elements.length; i < len; i++) {
            attachFunction(element[i]);
         }
         return elements;
      }
   }(document));
}

这个功能可以在一个单独的 javascript 文件中，该文件包含在 IE 中的条件标记中：

<!--[if lt IE 8]>
<script src="ie7fixs.js" type="text/javascript" ></script>
<![endif]-->

然后只需使用document.getElementsByTagNameor document.getElementById。

var inputs = document.getElementsByTagName('input');
document.write(
    'has?' + inputs[0].hasAttribute('abc') // false
);
document.write(
    'has?' + inputs[0].hasAttribute('data-abc') // true
);
于 2015-04-09T21:19:33.153 回答
0

试试看：

//if  po is object then for IE:
if (!po.hasAttribute) po.hasAttribute=function(attr) {
  return this.getAttribute(attr)!=null
};
于 2017-08-27T17:10:58.387 回答