切换jquery offsetParent()方法

时间:2016-07-09 17:01:41

标签: javascript jquery html css

$(document).ready(function(){
    $("button").click(function(){
        $("p").offsetParent().css("background-color", "red");
    });
});
<button>Set background-color</button>
<div style="border:1px solid black;width:70%;position:absolute;left:10px;top:50px">
    <div style="border:1px solid black;margin:50px;background-color:yellow">
        <p>Click button to set the background color of the first positioned parent element of this paragraph.</p>
    </div>
</div>

这里我将背景颜色应用于偏移父级,但我也希望它也可以切换,当我点击按钮背景颜色红色即将到来但是当我再次点击时应该通过使用切换方法更改背景颜色

1 个答案:

答案 0 :(得分:0)

实现此目的的最简单方法是将要添加/删除的样式放入其自己的CSS类中,然后调用toggleClass()。以这种方式将样式规则排除在HTML和JS代码之外(即在单独的样式表中)也是更好的做法。试试这个:

.on {
    background-color: red;
}
$("button").click(function() {
    $("p").offsetParent().toggleClass('on')
});

Working example