使用jQueryselect具有特定CSS的所有元素

如何使用jQueryselect所有具有特定CSS属性的元素？ 例如：

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

如何select名为“四舍五入”的属性？

CSS类名非常灵活。

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

如何将这两个操作replace为一个操作。 也许这样的事情：

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

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

Answer 1

您不能（使用CSSselect器）根据已应用到它们的CSS属性select元素。

如果你想手动这样做，你可以select文档中的每一个元素，循环它们，并检查你感兴趣的属性的计算值（这可能只适用于真正的CSS属性，但不是这样的如rounded ）。 这也将是缓慢的。

更新以响应编辑 – 组select器 ：

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

Answer 2

这是一个两岁的线程，但它对我仍然有用，所以也许对其他人有用。 这就是我最终做的事情：

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

并不像我想的那么简洁，但是现在除了现在，我从来不需要这样的东西，反正它也不是很有效。

Answer 3

谢谢你，比茹 我用你的解决scheme，但使用jQuery .css而不是纯JavaScript，如下所示：

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

此示例将selectfont-family属性值包含“Futura”的所有元素。

Answer 4

类似于Bijou's。 只是一点点增强：

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

我认为使用$（'[class]'）更好：

• 不需要对select器进行硬编码
• 将不会逐个检查所有HTML元素。

这是一个例子 。

Answer 5

自定义CSS属性不会被inheritance，因此必须直接应用到每个元素（即使您使用js来dynamic添加属性，您应该通过添加一个类来实现），所以…

CSS

 .Title { color:red; } .Caption { color:black; } 

HTML

你根本不需要定义一个四舍五入的true属性。 只需使用“Rounded”类的存在：

 <div class='Title Rounded'><h1>Title</h1></div> <div class='Caption Rounded'>Caption</div> 

JS

 jQuery( '.Rounded' ).corner(); 

Answer 6

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

 // 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(); } }); 

这个解决scheme是不同的，因为它不使用angular落，filter或返回。 这是故意为更广泛的用户。

要取代的东西：

1. 用你的select器replace“.dom-class”。
2. 将CSS属性和值replace为您正在查找的内容。
3. 将“doThingsHere（）”replace为您要在find的元素上执行的操作。