使用以选择器结尾的属性添加一个 class

Question

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

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

我正在尝试编写一个函数，表示 "If the background-image of body ends with "-dark.png" 将 class .dark 添加到 nav。

这是我拥有的：

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

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

感谢任何帮助！

Answer 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");
    }
}

Answer 2

您需要使用正则表达式：

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

我在 $ 之前添加了 "\) 因为这就是这个字符串 (url) 的结尾。

Answer 3

我认为您不能使用结尾，因为图像 url 将被包裹在 url() 中，因此您可以检查 indexOf()

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

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

Answer 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");
            }
        }

希望对你有所帮助..

使用以选择器结尾的属性添加一个 class

Using attribute ends with selector to add a class

css

jquery

attributes

jquery-selectors