为什么 `h3:nth-child(1):contains(\'a\')` 不选择第一个包含 \'a\' 的？

为什么 h3:nth-child(1):contains('a') 失败？

尝试选择第一个h3 元素包含文本“a”，正在使用选择器 h3:nth-child(1):contains('a')。但是，此选择器不会产生所需的结果。

说明：

CSS3 选择器 :contains() 从未作为标准实现，因此在主要浏览器。此选择器旨在匹配包含特定文本的元素，但其实现会由于匹配该元素的所有祖先而导致性能问题。

替代解决方案：

由于 :contains() 不可用，另一种方法是必需：

• 修改 HTML： 重新排列 HTML 结构，将所需的 h3 元素放置在不同的位置。
• 使用 jQuery： jQuery 提供了自己的 :contains() 选择器，可以用作如下：

$("h3:first").filter(function() {
  return $(this).text().indexOf("a") >= 0;
});

注意事项：

• 对于 jQuery 和 Selenium RC，支持 :contains() 但可能会导致意外选择，因为匹配祖先。
• 可以使用 CSS2 选择器 h3:first-child h3:nth-child(1) 以获得更好的浏览器支持。

以上是为什么 `h3:nth-child(1):contains(\'a\')` 不选择第一个包含 \'a\' 的？的详细内容。更多信息请关注PHP中文网其他相关文章！