javascript-jquery对象的css处理
一、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处理的更多相关文章
- 使用 jQuery 选择器获取页面元素后,利用 jQuery 对象的 css() 方法设置其样式。
查看本章节 查看作业目录 需求说明: 使用 jQuery 选择器获取页面元素后,利用 jQuery 对象的 css() 方法设置其样式. 要求如下: 点击页面的"更改样式"按钮后, ...
- 使用 jQuery 选择器获取页面元素,然后利用 jQuery 对象的 css() 方法设置其 display 样式属性,从而实现显示和隐藏效果。
查看本章节 查看作业目录 需求说明: 使用 jQuery 选择器获取页面元素,然后利用 jQuery 对象的 css() 方法设置其 display 样式属性,从而实现显示和隐藏效果. 具体要求如下: ...
- 使用 jQuery 基本选择器获取页面元素,然后利用 jQuery 对象的 css() 方法动态设置 <span> 和 <a> 标签的样式
查看本章节 查看作业目录 需求说明: 使用 jQuery 基本选择器获取页面元素,然后利用 jQuery 对象的 css() 方法动态设置 <span> 和 <a> 标签的样式 ...
- jQuery对象和DOM对象的互相转换【 转】
jQuery对象转换为dom对象 只有jQuery对象才能调用jQuery类库的各种函数,同样有些dom对象的属性和方法在jQuery上也是无法调用的,不过基本上jQuery类库提供的函数包含了所有的 ...
- JavaScript jQuery 事件、动画、扩展
事件 因为JavaScript在浏览器中以单线程模式运行,页面加载后,一旦页面上所有的JavaScript代码被执行完后,就只能依赖触发事件来执行JavaScript代码. 浏览器在接收到用户的鼠标或 ...
- JavaScript jQuery 入门回顾
$符号 $是著名的jQuery符号.实际上,jQuery把所有功能全部封装在一个全局变量jQuery中,而$也是一个合法的变量名,它是变量jQuery的别名: window.jQuery; // j ...
- jQuery对象转换为DOM对象(转)
jQuery对象转换为dom对象 只有jQuery对象才能调用jQuery类库的各种函数,同样有些dom对象的属性和方法在jQuery上也是无法调用的,不过基本上jQuery类库提供的函数包含了所有的 ...
- 使用 jQuery对象设置页面中 <ul> 元素的标记类型,并使用 DOM 对象设置 <li> 元素的浮动属性和右边距。使用jQuery 对象和 DOM 对象设置页面元素属性
查看本章节 查看作业目录 需求说明: 使用 jQuery对象设置页面中 <ul> 元素的标记类型,并使用 DOM 对象设置 <li> 元素的浮动属性和右边距.使用jQuery ...
- jQuery学习之旅 Item5 $与jQuery对象
1.$符号的由来 $符号本质就是函数的名字. jquery源码分析 通过分析我们知道,在jquery里边不只可以使用$符号,还可以使用jQuery标志 解决冲突问题 有的项目是中间过渡项目(proto ...
- jQuery 对象
jQuery 对象 版权声明:未经博主授权,严禁转载分享 什么是 jQuery 对象 jQuery 对象是通过 jQuery 包装 DOM 对象后产生的对象. jQuery 对象是一个类数组对象. j ...
随机推荐
- 【XSS】XSS修炼之独孤九剑
题目地址 xcao.vip/test 题目作者给出的解题思路 http://xcao.vip/test/xss/XSS修炼之独孤九剑.pdf 独孤九剑-第一式 题目 过滤了等号 =.小括号 (),要求 ...
- el-table回显遇到的坑
使用element ui 的el-table在做到复选框回显勾中的问题时,整整困惑了我一天,当时百度了一下,好多人都说是 this.$nextTick(() => {})的问提,在组件中监听w ...
- Azure 实践(4)- CI/CD .netcore项目Docker构建及部署
上篇已介绍了.netcore项目构建的相关步骤,本篇继续完善 1.什么是CI/CD CI/CD 中的"CI"始终指持续集成,它属于开发人员的自动化流程.成功的 CI 意味着应用代码 ...
- JS预编译过程
GO和AO 变量的预编译 实例1 console.log(a); var a=1; console.log(a); 实际编译过程: 将a存入预编译对象中,赋值为undefined: 真正的赋值语句当程 ...
- (未完)Java集合框架梳理(基于JDK1.8)
Java集合类主要由两个接口Collection和Map派生出来的,Collection派生出了三个子接口:List.Set.Queue(Java5新增的队列),因此Java集合大致也可分成List. ...
- Java大数操作
Java的Math包中提供了两个类用于对大数进行操作: BigInteger类,用于大整数的操作 BigDecimal类,用于大的小数操作 BigInteger类 Java中的基本类型中,表示整数的有 ...
- VS Code + WSL 搭建 RaspberryPi Pico 开发环境
前面老周写一堆 .NET 与树莓派相关的水文.其实使用的是.net的 IOT 库,并不只是树莓派,其他运行 Linux 的开发板都适用,只要有 GPIO 就行.老周好像在哪看到过,有 USB 转GPI ...
- 3gcms导航,实现当前栏目高亮的办法
<volist name="menu" id="vo" offset="0" length='8' key='k'> <l ...
- Kotlin协程入门
开发环境 IntelliJ IDEA 2021.2.2 (Community Edition) Kotlin: 212-1.5.10-release-IJ5284.40 介绍Kotlin中的协程.用一 ...
- spring入门1-IOC和DI
1.概述 1.1.简介 Spring是分层的 Java SE/EE应用 full-stack 轻量级开源框架,以 IoC(Inverse Of Control:反转控制)和 AOP(Aspect Or ...