使用属性以选择器结尾添加类答案

【问题标题】：Using attribute ends with selector to add a class使用属性以选择器结尾添加类
【发布时间】：2026-01-03 05:55:01
【问题描述】：

我正在尝试根据页面的background-image 更改字体颜色。

我已经查看了我能找到的所有关于此的帖子，但我无法为我的特定应用程序找出正确的语法。

我正在尝试编写一个函数，上面写着“如果body 的background-image 以“-dark.png”结尾，则将.dark 类添加到nav。

这是我所拥有的：

function colorChange(){
    var b = $('body').css('background-image');

    if (b $==='-dark.png'){
        $("nav").addClass("dark");
    }
}

感谢您的帮助！

【问题讨论】：

标签： jquery css jquery-selectors attributes

【解决方案1】：

$== 运算符在 JS 中无效。要确定字符串是否以特定字符集结尾，您可以使用正则表达式：

function colorChange(){
    var b = $('body').css('background-image');
    if (b.test(/-dark.png$/i)) {
        $("nav").addClass("dark");
    }
}

或者也可以substr():

function colorChange(){
    var b = $('body').css('background-image');
    var match = '-dark.png';
    if (b.length > match.length && b.substr(-match.length) == match) {
        $("nav").addClass("dark");
    }
}

【讨论】：

【解决方案2】：

我不认为你可以使用结尾，因为图片 url 将被包裹在 url() 中，所以你可以检查 indexOf()

function colorChange() {
    var b = $('body').css('background-image');

    if (b.indexOf('-dark.png') > -1) {
        $("nav").addClass("dark");
    }
}

【讨论】：

【解决方案3】：

你需要使用正则表达式：

function colorChange(){
    var b = $('body').css('background-image');
    if(b.match(/-dark.png"\)$/)){
        $("nav").addClass("dark");
    }
}

我在$ 之前添加了"\)，因为这就是这个字符串（url）的结束方式。

【讨论】：

【解决方案4】：

你好马克·普法夫，根据我对您的问题的理解，这是您的答案，它可能会解决您的目的

      function colorChange(){
            var b = $('body').css('background-image');
            b = b.replace('url("','').replace('")','');
            b = b.substr(b.lastIndexOf('/') + 1);
            if (b === 'dark.png'){
                $('nav').addClass("dark");
            }
        }

希望对你有所帮助..

【讨论】：