Question

如何匹配具有在运行时添加的特定属性的所有元素？

例如，代码：

$('[onkeydown]')

将成功匹配：

<div onkeydown="foo();">

但不符合以下div：

<div id="mydiv">
// ....
<script type="text/javascript">
var element = document.getElementById('mydiv');
element.onkeydown = foo;
</script>

注意：ID属性用作示例。我不知道我想要匹配的所有元素的ID的属性值，因此请提供一个匹配所有具有指定属性的元素的解决方案。

为了澄清，在第二个示例中，以下代码正确返回使用的函数：

$('#mydiv').attr('onkeydown') // == foo

注意：如果我上面做了同样的事情，但是我没有使用事件（onkeydown），而是使用不是事件的不同属性（例如title），它会成功匹配动态添加的属性。因此，它似乎只是事件的一个问题。

Answer 1

<强> [Working demo]

/**
* Returns all the elements with the specified attribute.
* @param base is optional (root element)
*/
function getElementsByAttr( attr, base ) {
  base = base || document;
  var all = base.getElementsByTagName('*'),
      len = all.length,
      res = [];
  for ( var i = 0; i < len; i++ )
    if ( all[i][attr] != null )
      res.push( all[i] )
  return res;
}

请注意，该函数会检查DOM中的所有元素（如果没有给出根元素），因此在重布局时使用它会变慢。

使用jQuery匹配动态添加的事件（作为属性）

1 个答案: