Jquery - 通过它的样式属性值捕获元素然后更改值

Question

我有一个div，我需要根据它的“顶部”值“614px”捕获，然后使用jQuery将该值更改为“300px”。有什么想法吗？

<div class="small-12  large-3  columns " style="left: 443px; top: 614px; position: absolute;">

Answer 1

您需要找到div 具有唯一ID 的DIV的第6个孩子。您可以使用该选择器轻松选择它：#uniqueID > :nth-child(6)

在那里，您可以直接使用CSS !important修改您的值（IE8及以下版本不支持）：

#uniqueID > :nth-child(6){
    top : 300px!important;
}

或者使用jQuery：

$('#uniqueID > :nth-child(6)').css('top', 300);

Answer 2

您应该将内联css移动到一个类，然后将该类添加到div中。这样你就可以轻松地定位div并使用jquery进行控制。

Answer 3

这是我在其他答案中找到的一个例子

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

以下是他为示例提供的fiddle

Answer 4

您可以使用jquery的attributeContainsWord选择器来执行此操作。 docs

我做了一个jsbin演示了这个here

在你的情况下，它会是这样的：

var el = $('[style~="top:"][style~="614px;"]');
var style = el.attr('style');
el.attr('style', style.replace('top: 614px', 'top: 300px'));

Answer 5

在jquery中尝试这个：

var top = $(".columns").css("top");
if(top=="614px")
{
$(".columns").css("top", "300px");
}

希望这有帮助。