21-jQuery操作CSS样式的方法

iWarming

于 2018-12-02 16:36:10 发布

阅读量117

点赞数

分类专栏： jQuery 文章标签：学习笔记

本文链接：https://blog.youkuaiyun.com/csdn9228/article/details/84719401

版权

jQuery 专栏收录该内容

23 篇文章

订阅专栏

本文介绍使用jQuery进行CSS样式操作的三种方法：逐个设置、链式设置和批量设置，并演示了如何通过jQuery获取元素的背景颜色。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>21-jQuery操作CSS样式的方法</title>
    <script type="text/javascript" src ="https://code.jquery.com/jquery-1.12.4.js"></script>
    <script>
        $(function () {
            //1.逐个设置
            $("div").css("width","300px");
            $("div").css("height","300px");
            $("div").css("background","blue");
            //2.链式设置
            //链式操作大于3步，建议分开
          $("div").css("width","300px").css("height","300px").css("background","blue");
          //3.批量设置
            $("div").css({
              width: "400px",
              height: "400px",
              background: "yellow"
          });
          //获取CSS样式值
          //传入属性参数
          var val = $("div").css("background");
          console.log(val);
          });
    </script>
</head>
<body>
<div></div>
</body>
</html>