Javascript jQuery-选择具有自定义属性的第一个元素

我有一个网页。此网页有一个区域，其中包含一些动态生成的HTML。我想获取此区域中具有特定名称的自定义属性的第一个元素（不是所有元素）。然后我想得到那个属性值。我已经安装了一个。代码如下所示：

<div id="myElement">
  <div>
    <div>
      <ul>
        <li></li>
        <li><div data-custom-property="12345">
          <p>
            Some details
          </p>
          <div>
            <div>
              <div data-custom-property="xyzwt">
               Stuff
              </div>
            </div>
          </div>
        </div></li>
        <li></li>
      </ul>
    </div>
  </div>
</div>

<button onclick="return getFirstElementWithProperty('data-custom-property');">
  Get Element
</button>

一些细节

东西



获取元素

基本上，我正在尝试获取

myElement

中具有

数据自定义属性的第一个元素。我所看到的一切（，）都涉及到寻找属性的值。我想按名字搜索

如何找到它？
如果它始终是一个div，并且您知道元素的ID：

$("#myElement div[data-custom-property]:first")

否则，这也会起作用，尽管最好尽可能具体：

$("[data-custom-property]:first")

使用
document.querySelector
而不是jQuery，这样您就不必为了获得第一个元素而对整个DOM进行昂贵的搜索<代码>文档.querySelector（“[数据自定义属性]”）

…如果您碰巧知道它是一个

div

，那么在选择器中使用它也会提高性能

div[data custom property]

此外，如果您知道元素将位于

正文

中，则可以从

document.body

而不是

document

进行搜索。