Javascript-форум - Показать сообщение отдельно - Как обмануть jQ при помощи jQ? (CamelCase в атрибутах)

devote · #16 (**permalink**) 07.08.2014, 18:01

Все что нужно сделать для jQuery, что бы он не тупил с SVG

jQuery.extend({
  _originalAttr: jQuery.attr,
  attr: function(elem, name, value) {
    if (typeof SVGElement !== 'undefined' && elem instanceof SVGElement) {
      if (typeof value === 'undefined') {
        value = elem.getAttribute(name);
      } else if (value === null) {
        elem.removeAttribute(name);
      } else {
        elem.setAttribute(name, value + "");
      }
      return value;
    }
    return jQuery._originalAttr(elem, name, value);
  }
});

тест:

<!DOCTYPE html>
<html lang="en">
<head>
    <title>…</title>
    <meta charset="UTF-8">
    <script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
</head>
<body>
    <script>
jQuery.extend({
  _originalAttr: jQuery.attr,
  attr: function(elem, name, value) {
    if (typeof SVGElement !== 'undefined' && elem instanceof SVGElement) {
      if (typeof value === 'undefined') {
        value = elem.getAttribute(name);
      } else if (value === null) {
        elem.removeAttribute(name);
      } else {
        elem.setAttribute(name, value + "");
      }
      return value;
    }
    return jQuery._originalAttr(elem, name, value);
  }
});



        var inlineSVG = '<svg baseProfile="full" WIDTH="300"  HEIGHT="200"><polygon points="100,10 40,198 190,78 10,78 160,198" style="fill:lime;stroke:purple;stroke-width:5;fill-rule:evenodd;" /></svg>',
            tmpContainer = document.createElement('div'),
            svgElement;

        tmpContainer.innerHTML = inlineSVG;
        document.body.appendChild(tmpContainer.firstChild);
        tmpContainer = null;
        svgElement = jQuery('svg');
 
        alert([
            'baseprofile: ' + svgElement.attr('baseprofile'),
            'baseProfile: ' + svgElement.attr('baseProfile'),
            'width: ' + svgElement.attr('width'),
            'height: ' + svgElement.attr('height')
        ].join('\n'));
    </script>
 
</body>
</html>