JavaScript: execute 'element.hasAttribute' if undefined [for IE7]

Question

I need to make exisitng web application compatible with IE7.

The code is used element.hasAttributeextensively, and IE7 has problems with this method.

The object does not support the property or method 'hasattribute'

I am trying to check the code if an element inputhas a method hasAttribute, and if not, I am trying to add it to all elements 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.
}

This article describes how to define a single function for this. However, I would like to add a method hasAttributeto the elements if it is not defined. (this way I do not need to change all the code that is currently written)

: > 1000 , "hasattribute" .

, , . !

Answer 1

Element.prototype IE < 8, polyfill hasAttribute. ( shimming) - ( ):

<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>

Answer 2

, , , , 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.getElementsByTagName document.getElementById.

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

Answer 3

:

//if  po is object then for IE:
if (!po.hasAttribute) po.hasAttribute=function(attr) {
  return this.getAttribute(attr)!=null
};