我可以使用什么 jQuery 选择器来匹配这些 HTML 元素(需要“:contains()”)?
我试图找到一个 jQuery 选择器,它仅匹配以下两个示例中直接包含文本“PDT”的元素(为简洁起见,已截断):
<div>
<p>
<strong>(07-27) 21:28 PDT SAN FRANCISCO</strong> -- San Francisco
supervisors ended more than a decade...
</p>
<p>The 10-1 vote, with only Supervisor Chris Daly dissenting</p>
</div>
并且
<div>
<p>(07-28) 08:59 PDT WASHINGTON --</p>
<p>Orders to U.S. factories for big-ticket manufactured goods fell...</p>
</div>
在第一种情况下,这将是 ;
,在第二种情况下,第一个 。我正在寻找一个与两者匹配的单个选择器,或多个不会发现任何误报的选择器。
通过我的分析,我知道有关匹配元素的以下信息:
- 它们可以是
或
元素,
- 它们是他们的父母的第一个孩子
- 他们包含文本“PDT”
- 他们没有孩子
考虑到所有这些属性,我认为应该有一个 jQuery 选择器能够高精度地找到这些元素,并且几乎没有误报。但是,我在将其组合在一起时遇到了一些麻烦,因为我不再使用如此复杂的选择器。
我知道的工具是(每个都链接到文档):
我不确定最后一个是否有用 - 我只是更仔细地阅读了文档并注意到文本节点被考虑:empty 选择器,因此我尝试定位的 HTML 元素实际上并不是空的。然而,我可以相信它们只包含一个文本节点,而没有其他内容。
我的第一枪是:
*:contains(PDT):first-child:empty
但这没有用。我尝试过其他几种变体,但我有点困惑。有人可以提供一些指导吗?
需要注意的是:我实际上并没有在我的脚本中使用 jQuery,而是使用它的 Sizzle 选择器引擎。因此,我需要尝试在一个选择器中完成这一切,并且我不能使用 .find() 和 .filter() 等 jQuery 方法。
预先感谢您的任何帮助!
I'm trying to find a jQuery selector that will match only the element that directly contains the text "PDT" in the following two examples (truncated for brevity):
<div>
<p>
<strong>(07-27) 21:28 PDT SAN FRANCISCO</strong> -- San Francisco
supervisors ended more than a decade...
</p>
<p>The 10-1 vote, with only Supervisor Chris Daly dissenting</p>
</div>
and
<div>
<p>(07-28) 08:59 PDT WASHINGTON --</p>
<p>Orders to U.S. factories for big-ticket manufactured goods fell...</p>
</div>
In the first case, this would be the <strong>
, and in the second case, the first <p>
. I'm looking for a single selector that would match both, or multiple selectors that wouldn't find any false positives.
By my analysis, I know the following things about the elements that would match:
- they can either be a
<p>
or a<strong>
element - they're the first child of their parent
- they contain the text "PDT"
- they have no children
Given all of these attributes, I think there should be a jQuery selector that will find these elements with high accuracy, and few to no false positives. However, I'm having some trouble putting one together, as I haven't used a selector this complex anymore.
The tools I'm aware of are (each linked to documentation):
I'm not sure if the last one will be useful - I just read the documentation more carefully and noticed that text nodes are considered by the :empty selector, so HTML elements that I'm trying to target aren't actually empty. However, I can rely on the fact that they'll only contain one text node, and nothing else.
My first shot was:
*:contains(PDT):first-child:empty
but that didn't work. I've tried several other variations, but I'm kind of stumped. Can anyone offer some guidance?
One caveat: I'm not actually using jQuery in my script, but rather its Sizzle selector engine. Therefore, I need to try to do this all in one selector, and I can't use jQuery methods like .find() and .filter().
Thanks in advance for any help!
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(2)
使用您的所有标准,您可以执行以下操作:
尝试一下: http://jsfiddle.net/ CKUYD/
注意“ PDT ”周围的空格。
如果它们包含文本、是第一个子标签并且没有任何其他子标签,则这将返回。
Using all your criteria, you could do:
Try it out: http://jsfiddle.net/CKuYD/
Note the spaces around " PDT ".
This will return if they contain the text, are a first-child, and don't have any other child tags.
这显然可以根据 ids 和上下文进行优化。
This can obviously be optimized based on ids and context.