Question

我想知道是否有办法用jQuery获取属性的hashmap，如下所示：

HTML：

<img id="site-logo" src="logo.jgp" alt="The Logo" class="ui-logo">

JAVASCRIPT：

// Something along these lines
$('#site-logo').getAttr();

结果：

{
   id: 'site-logo',
   src: 'logo.jpg',
   alt: 'The Logo',
   class: 'ui-logo'
}

我对任何插件都不感兴趣，只是想知道jQuery人是否想到这个，我一直在google上搜索并尝试.attr()方法没有任何参数，但它抛出了错误。

Answer 1

jQuery没有，但DOM有效地执行：attributes，这是NamedNodeMap。琐碎地接受并创建一个JS对象：

var attrs = {};
$.each($("selector")[0].attributes, function(index, node) {
    attrs[node.nodeName] = node.nodeValue;
});

Live example | Source

因此，如果这是您经常需要的东西，您可以自己制作一个插件：

// Attributes map plugin
(function($) {
  /**
   * attrMap builds a map of the attributes of the first matched
   * element in the set.
   *
   * @returns the object, or undefined if there are no elements in
   *          the set
   */
  $.fn.attrMap = attrMap;
  function attrMap() {
    var attrs;
    if (this[0]) {
      attrs = {};
      $.each(this[0].attributes, function(index, node) {
          attrs[node.nodeName] = node.nodeValue;
      });
    }
    return attrs;
  }
})(jQuery);

用法：

var attrs = $("selector").attrMap();

Live example | Source

Answer 2

不，没有jQuery本机内置解决方案可以从节点属性创建一个hashmap。

您可以轻松创建一个可以完成工作的小方法，如提到的@TJCrowder，使用.attributes值，如：

var hashMap = { };

Array.prototype.forEach.call( document.getElementById('site-logo').attributes, function( elem ) {
   hashMap[ elem.nodeName ] = elem.nodeValue;
});

console.dir( hashMap );

^{以上代码需要启用ES5的浏览器或Javascript ES5垫片}

jQuery：有没有通用的方法来获取元素属性的映射？

2 个答案: