Question

我正在尝试通过CMS自动应用到该图像的CSS选择图像，然后添加一个类。这是我的剧本：

$(document).ready(function() {
    if ($('.pageBody p img').css('float') === 'right') {
        $('.pageBody p img').addClass('float-right');
    }
});

该脚本适用于已应用float: right的图片。还有另一张已应用float: left的图片。问题是，如果我在脚本中将“右”切换为“左”而不是“不行”。例如，如果我将图像设置为float: left并使用此脚本而不是它不起作用：

$(document).ready(function() {
    if ($('.pageBody p img').css('float') === 'left') {
        $('.pageBody p img').addClass('float-left');
    }
});

Answer 1

您当前的代码仅在您感兴趣的图像是文档中的第一个图像时才有效。您可以使用filter()找到该图像，无论其在DOM中的位置如何：

$(document).ready(function() {
    $(".pageBody p img").filter(function() {
        return $(this).css("float") == "left";
    }).addClass("float-left");
});

或者，您可以使用addClass()形式，该功能可以将float-left或float-right类添加到所有图像，具体取决于float样式的值：

$(document).ready(function() {
    $(".pageBody p img").addClass(function() {
        var direction = $(this).css("float");
        if (direction == "left" || direction == "right") {
            return "float-" + direction;
        } else {
            return "";
        }
    });
});

按CSS属性选择jQuery

1 个答案: