jQuery的CSS操作

.css()——获取匹配元素集合中的第一个元素的样式属性的值设置每一个匹配元素的一个或多个CSS属性。

.hasClass()——确定不论什么一个匹配元素是否有被分配给定的(样式)类;

.addClass()——为每一个匹配的元素加入指定的样式类名。

.removeClass()——移除集合中每一个匹配元素上一个,多个或所有样式;

.toggleClass()——在匹配的元素集合中的每一个元素上加入或删除一个或多个样式类,取决于这个样式类是否存在或值切换属性。即:假设存在(不存在)就删除(加入)一个类。

<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <title>加入元素&删除元素</title>
    <script src="js/jquery-1.11.2.min.js"></script>
    <script src="js/css.js"></script>
    <style>
        .divStyle{
            width:800px;
            height: 25px;
            background-color: #1abc9c;
        }
    </style>
</head>
<body>
<div id="div1">
    获取匹配元素集合中的第一个元素的样式属性的值或设置每一个匹配元素的一个或多个CSS属性。
</div>

</body>
</html>

$(document).ready(function(){
    //$("#div1").css({
    //    width:"700px",height:"25px",backgroundColor:"#01C5FF"
    //});
    //$("#div1").addClass("divStyle");
    //$("#div1").removeClass("divStyle");
    $("#div1").click(function(){
        $(this).toggleClass("divStyle");
    })
})


posted @ 2017-06-25 21:49  yfceshi  阅读(171)  评论(0编辑  收藏  举报