<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>Title</title>

    <script src="node_modules/jquery/dist/jquery.min.js"></script>

    <style>

        #box{

            height: 100px;

            background: yellow;

        }

    </style>

</head>

<body>

    <div id="box" style="width: 100px"></div>

    <ul>

        <li>11111</li>

        <li>11111</li>

        <li>11111</li>

        <li>11111</li>

        <li>11111</li>

        <li>11111</li>

    </ul>

</body>

</html>

<script>

    // css()    行内和非行内的都可以获取

    console.log($('#box').css('width'))

    console.log($('#box').css('height'))

    console.log($('#box').css('background-color'))

    // css() 设置样式

    $('#box').css('width','200px')

    $('#box').css('height',200)

    $('#box').css('background-color','red')

    $('ul li').css('color','blue')  //隐式迭代（不用主动遍历）

    // css({}) 批量设置样式

    $('ul li:eq(3)').css({width:200,height:200,backgroundColor:'yellow'})

</script>

　　

jquery 操作样式的更多相关文章

  1. 测开之路一百零四：jquery操作样式

    jquery操作样式 添加样式.删除样式 切换样式 css("属性","值") css("属性","值"), 修改多个 ...

  2. JQuery操作样式以及JQuery事件机制

    1.操作样式     1.1 css的操作     功能:设置或者修改样式,操作的是style属性 操作单个样式 // name:需要设置的样式名称 // value:对应的样式值 // $obj.c ...

  3. Jquery操作样式

    1.CSS(name,value) 修改单个样式 $(function(){ $(".divcontent").css("background","r ...

  4. jQuery操作样式知识总结

    css操作 功能:设置或者修改样式,操作的是style属性. 设置单个样式 //name:需要设置的样式名称 //value:对应的样式值 css(name, value); //使用案例 $(&qu ...

  5. jquery 与javascript关系 ①取元素 ②操作内容 ③操作属性 ④操作 样式 ⑤ 事件 点击变色

    jQuery的min版本和原版功能是一样的,min版主要应用于已经开发成的网页中,而非min版 的文件比较大,里面有整洁的代码书写规范和注释,主要应用于脚本开发过程当中. JQuery是继protot ...

  6. 2016/4/1 jquery 与javascript关系 ①取元素 ②操作内容 ③操作属性 ④操作 样式 ⑤ 事件 点击变色

    jQuery的min版本和原版功能是一样的,min版主要应用于已经开发成的网页中,而非min版 的文件比较大,里面有整洁的代码书写规范和注释,主要应用于脚本开发过程当中. JQuery是继protot ...

  7. jquery 操作

    Jquery使用时要引用,引用时放在最前. Jquery: $代表选择器, $(document) ready(function(e){}):找到页面,页面加载完成后执行. JS选取元素操作内容操作属 ...

  8. JQuery操作DOM(8)

    一.jQuery操作样式 1.设置和获取样式 /* 单个样式 */ $(selector).css(属性,值): /* 多个样式 */ $(selector).css({属性:值,属性:值}); /* ...

  9. 从零开始学习jQuery (四) 使用jQuery操作元素的属性与样式

    本系列文章导航 从零开始学习jQuery (四) 使用jQuery操作元素的属性与样式 一.摘要 本篇文章讲解如何使用jQuery获取和操作元素的属性和CSS样式. 其中DOM属性和元素属性的区分值得 ...

  10. jQuery入门（2）使用jQuery操作元素的属性与样式

    jQuery入门(1)jQuery中万能的选择器 jQuery入门(2)使用jQuery操作元素的属性与样式 jQuery入门(3)事件与事件对象 jQuery入门(4)jQuery中的Ajax()应 ...

随机推荐

  1. uniapp｜微信小程序获取当前城市名称--逆地址解析

    六年代码两茫茫,不思量,自难忘 6年资深前端主管一枚,只分享技术干货,项目实战经验 关注博主不迷路~ 问题 uniapp开发的小程序需要获取当前城市名称 解决步骤 看文档 当然是看uniapp文档,我 ...

  2. 日志收集工具 Fluentd 使用教程

    转载自:https://mp.weixin.qq.com/s?__biz=MzU4MjQ0MTU4Ng==&mid=2247499829&idx=1&sn=1f92daa88d ...

  3. Elasticsearch: rollover API

    rollover使您可以根据索引大小,文档数或使用期限自动过渡到新索引. 当rollover触发后,将创建新索引,写别名(write alias)将更新为指向新索引,所有后续更新都将写入新索引. 对于 ...

  4. 如何在 Docker 之上使用 Elastic Stack 和 Kafka 可视化公共交通

    文章转载自:https://blog.csdn.net/UbuntuTouch/article/details/106498568 需要掌握的知识点: 1.使用docker-compose方式部署一套 ...

  5. 了解如何配置Nginx日志

    设置access_log 访问日志主要记录客户端的请求.客户端向Nginx服务器发起的每一次请求都记录在这里.客户端IP,浏览器信息,referer,请求处理时间,请求URL等都可以在访问日志中得到. ...

  6. typescript中对象属性可选属性与只读属性与索引签名

    可选属性 type类型别名 type 会给一个类型起个新名字. type 有时和 interface 很像,但是可以作用于原始值(基本类型),联合类型,元组以及其它任何你需要手写的类型. interf ...

  7. 洛谷P4630 [APIO2018] Duathlon 铁人两项 （圆方树）

    圆方树大致理解:将每个点双看做一个新建的点(方点),该点双内的所有点(圆点)都向新建的点连边,最后形成一棵树,可以给点赋予点权,用以解决相关路径问题. 在本题中,方点点权赋值为该点双的大小,因为两个点 ...

  8. 干货|什么是特性团队/功能团队（FeatureTeam）

    最近一直在思考如何做团队组织能力建设和如何进行决策.执行产品研发策略.因为自己一直在研发效能领域,所以来谈谈什么是特性团队(FeatureTeam), 怎么创建特性团队以及在日常工作中如何结合 Scr ...

  9. Pycharm安装使用

    目录 使用pycharm软件 配置调整 下载链接地址:https://www.jetbrains.com/pycharm/download/#section=windows 根据自己的系统需要安装对应 ...

  10. java.util.Arrays----操作数组的工具类

    java.util.Arrays操作数组的工具类,里面定义了很多操作数组的方法 1.boolean equals(int[] a,int[] b):判断两个数组是否相等. 2.String toStr ...