一、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. MongoDB(3)- Database 数据库相关

    Database MongoDB 将数据记录存储为文档(特别是 BSON 文档) 这些文档在集合中聚集在一起 数据库存储一个或多个文档集合. 在 MongoDB 里面存在数据库的概念,但没有模式 Sh ...

  2. 依赖注入Bean属性——手动装配Bean

    一.构造方法注入 其中,可以根据不同的参数列表调用不同的重载的构造方法: 其中,基本数据类型没有包,引用类型都有包路径,基本类型对应封装类: 二.通过property标签调用类的set方法注入 三.通 ...

  3. PHP中的国际化日历类

    在 PHP 的国际化组件中,还有一个我们并不是很常用的跟日期相关的操作类,它就是日历操作类.说是日历,其实大部分还是对日期时间的操作,一般也是主要用于日期的格式化和比较之类的.但是通常我们直接使用 d ...

  4. PHP设计模式之备忘录模式

    备忘录,这个名字其实就已经很形象的解释了它的作用.典型的例子就是我们原来玩硬盘游戏时的存档功能.当你对即将面对的大BOSS有所顾虑时,一般都会先保存一次进度存档.如果挑战失败了,直接读取存档就可以恢复 ...

  5. jquery动态生成dom(比如append)导致js事件无效

    如果无效用这个方法: on() 方法在被选元素及子元素上添加一个或多个事件处理程序. <div id="zkdiv">  <input type="bu ...

  6. PHP文件包含漏洞小结

    参考链接:https://chybeta.github.io/2017/10/08/php文件包含漏洞/ 四大漏洞函数 PHP文件包含漏洞主要由于四个函数引起的: include() include_ ...

  7. Shell系列(32)- 双分支if语句判断Apache服务是否启动

    #!/bin/bash #截取httped进程,并把结果赋予变量test test=$(ps -aux | grep "httpd" | grep -v "grep&qu ...

  8. wordpress 搭建

    wordpress 搭建: 公司要使用自建地图.选用了国外的Mapplic .但是Mapplic不支持直接编辑地图,需要用json的格式定义.但是wordpress版本的就有这个鬼东西,所以搞了一个这 ...

  9. 鸿蒙内核源码分析(文件系统篇) | 用图书管理说文件系统 | 百篇博客分析OpenHarmony源码 | v63.01

    百篇博客系列篇.本篇为: v63.xx 鸿蒙内核源码分析(文件系统篇) | 用图书管理说文件系统 | 51.c.h.o 文件系统相关篇为: v62.xx 鸿蒙内核源码分析(文件概念篇) | 为什么说一 ...

  10. P4929-[模板]舞蹈链(DLX)

    正题 题目链接:https://www.luogu.com.cn/problem/P4929 题目大意 \(n*m\)的矩形有\(0/1\),要求选出若干行使得每一列有且仅有一个\(1\). 解题思路 ...