Question

我正在尝试让jQuery向所有外部链接添加一个类，但仅当链接包含在文本而不是图像时。我使用了：not选择器，代码看起来对我来说正确，但由于某种原因，它具有相反的效果并将类添加到图像而不是文本链接。

任何想法我做错了什么？

谢谢，这是我的代码......

jQuery( document ).ready(function($) {
    // Add a css class to all external text links
    $('#main a:not(:has(img)').filter(function() {
        return this.hostname && this.hostname !== location.hostname;
    }).addClass("externalLink");
});

Answer 1

您似乎错过了选择器中的结束)，并且嵌套伪选择器的顺序很重要，请尝试将它们反转：:not(:has(img))而不是:has(:not(img))

修改后的代码如下：

jQuery( document ).ready(function($) {
    // Add a css class to all external text links
    $('#main a:not(:has(img))').filter(function() {
        return this.hostname && this.hostname !== location.hostname;
    }).addClass("externalLink");
});

http://jsfiddle.net/y5e8kxz5/

Answer 2

我认为你发了一个语法错误（not括号正在打开但没有关闭），据我所知你不需要包围：has（img）带括号。

jQuery( document ).ready(function($) {
    // Add a css class to all external text links
    $('#main a:not:has(img)').filter(function() {
        return this.hostname && this.hostname !== location.hostname;
    }).addClass("externalLink");
});

Answer 3

现场演示：http://jsfiddle.net/don/0h56bjae/4/

您可以使用each()检查链接是否包含图片，如果是，则添加课程。并使用RegExp检查网址是否为外部。

var cp = new RegExp(location.host);

$('a').each(function() {
    if($(this).find("img").length > 0 && cp.test($(this).find('img').attr('src')) == false) {
        $(this).addClass('external-img');
    }
});

当链接不包含图像时，jQuery添加类

3 个答案: