一、css基本属性处理

1.css()方法:获取css属性值。$("选择器").css(name);//获取匹配选择器的元素指定css属性值。

2.css()方法:设置css属性值。$("选择器").css(name,value);//设置匹配选择器的元素指定css属性的值。

$("p").css("border","1px solid #f00");

也可以一次设置多属性值

$("p").css({"background-color":"green","color":"white"});

二、css尺寸属性处理

1.height()和width()方法:如果要获取或设置css属性height、width的值,可以使用更为简洁的height()和width()方法,单位是像素。

$("div").width();//获取第一个div的width

$("div").width(30);//设置多有的div的width为30px;

2.innerHeight()和innerWidth()方法。用户获得或者设置元素的实际高度和宽度值。

  --是padding+width的值。

    -$("div").innerWidth();获得实际宽度,包括padding+width不包括border

3.outerHeight()和outerWidth()方法。用户获得或者设置元素的实际高度和宽度。

  $("div").outerWidth(true);//获得实际宽度,包括padding+width+margin

三、css位置属性设置。

1.offset();获取或者设置当前元素相对窗口偏移量。

  --$("p").offset().top;//获取第一个距离窗口向上的偏移距离。

  --$("p").offset({"top":40,"left":15});

2.position();方法:获取当前元素相对父元素的偏移量。

   --$("p").position().top;//获取第一个p距离父元素向上的偏移距离。

3.scrollTop()和scrollLeft()方法:获取或者设置滚动条的位置。

  --$("div:eq(1)").scrollTop();//获得滚动条的距离位置

   --$("div:eq(1)").scrollTop(37);

javascript-jquery对象的css处理的更多相关文章

  1. 使用 jQuery 选择器获取页面元素后,利用 jQuery 对象的 css() 方法设置其样式。

    查看本章节 查看作业目录 需求说明: 使用 jQuery 选择器获取页面元素后,利用 jQuery 对象的 css() 方法设置其样式. 要求如下: 点击页面的"更改样式"按钮后, ...

  2. 使用 jQuery 选择器获取页面元素,然后利用 jQuery 对象的 css() 方法设置其 display 样式属性,从而实现显示和隐藏效果。

    查看本章节 查看作业目录 需求说明: 使用 jQuery 选择器获取页面元素,然后利用 jQuery 对象的 css() 方法设置其 display 样式属性,从而实现显示和隐藏效果. 具体要求如下: ...

  3. 使用 jQuery 基本选择器获取页面元素,然后利用 jQuery 对象的 css() 方法动态设置 <span> 和 <a> 标签的样式

    查看本章节 查看作业目录 需求说明: 使用 jQuery 基本选择器获取页面元素,然后利用 jQuery 对象的 css() 方法动态设置 <span> 和 <a> 标签的样式 ...

  4. jQuery对象和DOM对象的互相转换【 转】

    jQuery对象转换为dom对象 只有jQuery对象才能调用jQuery类库的各种函数,同样有些dom对象的属性和方法在jQuery上也是无法调用的,不过基本上jQuery类库提供的函数包含了所有的 ...

  5. JavaScript jQuery 事件、动画、扩展

    事件 因为JavaScript在浏览器中以单线程模式运行,页面加载后,一旦页面上所有的JavaScript代码被执行完后,就只能依赖触发事件来执行JavaScript代码. 浏览器在接收到用户的鼠标或 ...

  6. JavaScript jQuery 入门回顾

    ​$符号 $是著名的jQuery符号.实际上,jQuery把所有功能全部封装在一个全局变量jQuery中,而$也是一个合法的变量名,它是变量jQuery的别名: window.jQuery; // j ...

  7. jQuery对象转换为DOM对象(转)

    jQuery对象转换为dom对象 只有jQuery对象才能调用jQuery类库的各种函数,同样有些dom对象的属性和方法在jQuery上也是无法调用的,不过基本上jQuery类库提供的函数包含了所有的 ...

  8. 使用 jQuery对象设置页面中 <ul> 元素的标记类型,并使用 DOM 对象设置 <li> 元素的浮动属性和右边距。使用jQuery 对象和 DOM 对象设置页面元素属性

    查看本章节 查看作业目录 需求说明: 使用 jQuery对象设置页面中 <ul> 元素的标记类型,并使用 DOM 对象设置 <li> 元素的浮动属性和右边距.使用jQuery ...

  9. jQuery学习之旅 Item5 $与jQuery对象

    1.$符号的由来 $符号本质就是函数的名字. jquery源码分析 通过分析我们知道,在jquery里边不只可以使用$符号,还可以使用jQuery标志 解决冲突问题 有的项目是中间过渡项目(proto ...

  10. jQuery 对象

    jQuery 对象 版权声明:未经博主授权,严禁转载分享 什么是 jQuery 对象 jQuery 对象是通过 jQuery 包装 DOM 对象后产生的对象. jQuery 对象是一个类数组对象. j ...

随机推荐

  1. 【XSS】XSS修炼之独孤九剑

    题目地址 xcao.vip/test 题目作者给出的解题思路 http://xcao.vip/test/xss/XSS修炼之独孤九剑.pdf 独孤九剑-第一式 题目 过滤了等号 =.小括号 (),要求 ...

  2. el-table回显遇到的坑

    使用element ui 的el-table在做到复选框回显勾中的问题时,整整困惑了我一天,当时百度了一下,好多人都说是  this.$nextTick(() => {})的问提,在组件中监听w ...

  3. Azure 实践(4)- CI/CD .netcore项目Docker构建及部署

    上篇已介绍了.netcore项目构建的相关步骤,本篇继续完善 1.什么是CI/CD CI/CD 中的"CI"始终指持续集成,它属于开发人员的自动化流程.成功的 CI 意味着应用代码 ...

  4. JS预编译过程

    GO和AO 变量的预编译 实例1 console.log(a); var a=1; console.log(a); 实际编译过程: 将a存入预编译对象中,赋值为undefined: 真正的赋值语句当程 ...

  5. (未完)Java集合框架梳理(基于JDK1.8)

    Java集合类主要由两个接口Collection和Map派生出来的,Collection派生出了三个子接口:List.Set.Queue(Java5新增的队列),因此Java集合大致也可分成List. ...

  6. Java大数操作

    Java的Math包中提供了两个类用于对大数进行操作: BigInteger类,用于大整数的操作 BigDecimal类,用于大的小数操作 BigInteger类 Java中的基本类型中,表示整数的有 ...

  7. VS Code + WSL 搭建 RaspberryPi Pico 开发环境

    前面老周写一堆 .NET 与树莓派相关的水文.其实使用的是.net的 IOT 库,并不只是树莓派,其他运行 Linux 的开发板都适用,只要有 GPIO 就行.老周好像在哪看到过,有 USB 转GPI ...

  8. 3gcms导航,实现当前栏目高亮的办法

    <volist name="menu" id="vo" offset="0" length='8' key='k'> <l ...

  9. Kotlin协程入门

    开发环境 IntelliJ IDEA 2021.2.2 (Community Edition) Kotlin: 212-1.5.10-release-IJ5284.40 介绍Kotlin中的协程.用一 ...

  10. spring入门1-IOC和DI

    1.概述 1.1.简介 Spring是分层的 Java SE/EE应用 full-stack 轻量级开源框架,以 IoC(Inverse Of Control:反转控制)和 AOP(Aspect Or ...