使用jQuery选择具有特定CSS的所有元素

Question

如何使用jQuery选择所有应用了特定CSS属性的元素？例如:

.Title
{
    color:red;
    rounded:true;
}

.Caption
{
    color:black;
    rounded:true;
}

如何通过名为"圆形"的属性进行选择？

CSS类名非常灵活.

$(".Title").corner();
$(".Caption").corner();

如何将这两个操作替换为一个操作.也许是这样的:

$(".*->rounded").corner();

有没有更好的方法来做到这一点？

Answer 1

这是一个两年前的帖子,但它对我来说仍然有用,所以它可能对其他人有用.这是我最终做的事情:

var x = $('.myselector').filter(function () { 
    return this.style.some_prop == 'whatever' 
});

并不像我想的那样简洁,但除了现在我从来没有需要这样的东西,而且无论如何它对于一般用途都不是很有效,正如我所看到的那样.

Answer 2

谢谢Bijou.我使用了你的解决方案,但使用了jQuery .css而不是纯javascript,如下所示:

var x = $('*').filter(function() {
    return $(this).css('font-family').toLowerCase().indexOf('futura') > -1
})

此示例将选择font-family属性值包含"Futura"的所有元素.

Answer 3

您不能(使用CSS选择器)根据已应用于它们的CSS属性选择元素.

如果你想手动完成这个,你可以选择文档中的每个元素,循环它们,并检查你感兴趣的属性的计算值(这可能只适用于真正的CSS属性,而不是像as rounded).它也会很慢.

更新以响应编辑 - 组选择器:

$(".Title, .Caption").corner();

Answer 4

与Bijou相似.只是一点点增强:

$('[class]').filter(function() {
    return $(this).css('your css property') == 'the expected value';
  }
).corner();

我认为使用$('[class]')更好:

• 无需对选择器进行硬编码
• 不会逐个检查所有HTML元素.

这是一个例子.

Answer 5

这是一个干净，易于理解的解决方案：

// find elements with jQuery with a specific CSS, then execute an action
$('.dom-class').each(function(index, el) {
    if ($(this).css('property') == 'value') {
        $(this).doThingsHere();
    }
});

此解决方案不同，因为它不使用角点、过滤器或返回。它是为更广泛的用户而设计的。

需要更换的东西：

1. 用您的选择器替换“.dom-class”。
2. 用您要查找的内容替换 CSS 属性和值。
3. 将“doThingsHere()”替换为您要在找到的元素上执行的操作。

祝你好运！