Question

目前我正在尝试使用jQuery :contains选择器选择一个link元素。当链接的内容只是文本时，这种方法有效。但似乎当元素包含其他HTML元素时：contains contains选择子元素。实施例

HTML：

<a href="#"><b> two</b> this not bold <b>This</b> is a bold Link</a>

从那个html，我正在尝试使用这个选择器选择链接 jQuery的：

var selector = "a:contains('<b> two</b> this not bold <b>This</b> is a bold Link')";

var returnObj = $(selector);

jQuery不返回一个返回的对象（链接），而是返回三个对象：

第一个粗体元素
文字this is not bold
第二个粗体元素

问题不在于contains()中的单引号，因为我尝试使用和不使用它们。

这只是我正在尝试做的一个简化示例。实际上，我是基于用户点击的链接对象动态创建选择器。然后，我将该选择器存储在数据库中以供以后使用（我的应用程序显示与该链接相关的内容）。由于我可以获取链接的内容，因此我认为如果链接没有a:contents()，我只会使用id。

基于这些页面，我似乎有正确的语法：
http://docs.jquery.com/Tutorials:How_to_Get_Anything_You_Want_2
http://api.jquery.com/contains-selector/

关于如何获取链接对象的想法？谢谢！

希望这不是一个愚蠢的问题，我是JS和jQuery的新手。

Answer 1

首先，您的选择器文本与html中的实际文本不匹配选择器包含html中不存在的this not bold。

最重要的是，:contains仅适用于文字..因此您应该检查

$("a:contains('two this not bold This is a bold Link')");

这是一种非常低效的方式，您应该更好地为要定位的元素添加一个类，并将其用于定位..

Answer 2

如上所述，:contains()仅用文本内容选择，而不是内部HTML。

如果您必须根据该文字匹配a元素，请删除<b>代码：

var selector = "a:contains(' two this not bold This is a bold Link')";

否则，看看你是否可以通过使用上下文选择器来简化这种选择（例如，根据其周围的元素，父母，兄弟姐妹等进行选择），或者为其分配一个类，然后由该类选择。

另外，我会考虑另一个jQuery错误（可能是Sizzle中的解析错误）。在您的情况下，:contains()不应该返回或创建任何元素;因为选择器与a元素不匹配，所以不应返回任何匹配项。我怀疑它正在做什么而是将<b></b>标签视为新元素，并随着你的a元素一起创建它们，这是错误的，因为标签在参数字符串中并且意味着是字面意思......

：包含错误地选择子元素

2 个答案: