使用jquery自定义attr选择器

Question

<div id="placeholdSlots">
    <div sort-helper="1"></div>
</div>

如何使用sort-helper custom attr选择div？我知道attr（'sort-helper'）只能得到这个值。

Answer 1

$('div[sort-helper]');

或在vanillaJS

document.querySelectorAll('div[sort-helper]');

无论如何，我建议使用data-*属性，例如

<div data-sort-helper="1"></div>

Answer 2

使用jQuery attribute 选择器

alert($('div[sort-helper="1"]').html());

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<div id="placeholdSlots">
    <div sort-helper="1">abc</div>
</div>

Answer 3

jQuery不是唯一的方法。您可以使用直接的Javascript，如下所示：

• 使用名为sort-helper

  的属性检索firt div

  var elem = document.querySelector("[sort-helper]");

• 使用名为sort-helper

  的属性检索所有div

  var list = document.querySelectorAll("[sort-helper]");

这比jQuery更快，因为它是本机代码。它现在是cross-browser（对于现代浏览器; - ））。