如何根据 .data({key: value}) 选择元素答案

【问题标题】：How to select elements based on .data({key: value})如何根据 .data({key: value}) 选择元素
【发布时间】：2013-05-01 18:26:05
【问题描述】：

在 HTML 中，我有一个在 JSON 对象中设置了各种数据属性属性的 div，例如：

<div data-layout='{
      "type" : "header",
      "minHeight" :  "10%"
   }'>
   Layout
</div>

在代码中，是否可以仅选择具有例如data-layout.type==="header" 不使用.each 或过滤功能？

我正在寻找类似的东西：

$('[data-layout]').find('type="header"')

【问题讨论】：

有点，您可以使用 *= 查看 "type" : "header" 是否出现在属性值中的任何位置，但是如果您只使用 .filter 则不太容易出现问题。
我认为这个链接会对你有所帮助：stackoverflow.com/questions/2891452/jquery-data-selector
如果 data-* 属性设置为简单（“key”，“value”），我可以使用属性选择器，例如 '[key="value"]'。我的问题是我是否可以执行类似的操作来选择 JSON 对象的属性，如示例中所示，或者 .filter 是唯一的方法。数据布局没有设置为单个（字符串）值，而是一个 JSON 对象。我需要选择具有数据布局属性的元素，这些属性将某些属性设置为特定值。
谢谢 uross，在我之后才看到你的评论。这就是我要找的。span>
没问题，我很高兴能帮上忙。我已将其添加到答案中，因此您可以将其标记为已解决。

【解决方案1】：

如果你在 data-layout 属性的其他地方不使用 header，你可以像这样使用 attribute contains 选择器：

$('*[data-layout *="header"]')

【讨论】：

【解决方案2】：

使用this答案中的函数，您可以使用以下描述的模式：

:data( {namespace} [{operator} {check}]  )

“操作员”和“检查”是可选的。所以，如果你只有 :data(a.b.c) 它只会检查 a.b.c 的真实性。

阅读更多关于它的信息here。

【讨论】：

谢谢。只要数据布局属性对象中的其他地方没有使用“标题”，奥斯汀提供的答案也有效，但我特别需要找到具有（例如） someAttrProp===someValue 的元素。