选择特定的内联样式答案

【问题标题】：Selection of a specific inline style选择特定的内联样式
【发布时间】：2011-03-09 09:17:11
【问题描述】：

如何在 jquery 中只选择样式为“right:200px”的 div？

例子：

<div class="test" style="position:absolute; right:200px; top:10px;"><p>Hello</p></div>
<div class="test" style="position:absolute; right:300px; top:20px;"><p>Hello</p></div>
<div class="test" style="position:absolute; right:400px; top:70px;"><p>Hello</p></div>
<div class="test" style="position:absolute; right:200px; top:40px;"><p>Hello</p></div>
<div class="test" style="position:absolute; right:400px; top:100px;"><p>Hello</p></div>
<div class="test" style="position:absolute; right:200px; top:140px;"><p>Hello</p></div>


var div200 = $('.test').css('right');

我不知道如何只选择带有“right:200px”的 div。我是 jquery 的新手。我很努力，但没有成功：

阿奇姆

【问题讨论】：

标签： jquery

【解决方案1】：

var div200 = $('.test').filter(function(){
    return $(this).css('right') == "200px";
});

【讨论】：

这比我正在做的所有字符串操作要容易得多...+1，太棒了！ :)
嗨大卫，这真的很短，可读 - 感谢您的解决方案。好吧，我必须对给定的内联样式进行操作，我知道最好使用 css 避免内联样式。但是jquery没问题。

【解决方案2】：

$('.test').filter(function(){
    return $(this).css('right') == "200px";
}).addClass('selected');

See example.

【讨论】：

【解决方案3】：

我不知道如何只选择带有“right:200px”的div。

这在某种程度上可能是可能的，但这有点违背 jQuery 和 CSS 的工作方式。考虑将实际位置信息放入类中：

div.p1 { position:absolute; right:200px; top:10px; }
div.p2 { position:absolute; right:300px; top:20px; }
....
etc.

并具有简化的 div 结构：

<div class="test p1"><p>Hello</p></div> 
<div class="test p2"><p>Hello</p></div>
etc.

然后使用

寻址每个 div

var div1 = $('.test.p1');
var div2 = $('.test.p2');
etc.

这也使您不受 200px 等特定数字的影响 - 您唯一可以更改它的地方是样式表中。

【讨论】：