开发者学堂课程【jQuery 开发教程:jQuery_CSS 属性上】学习笔记,与课程紧密联系,让用户快速学习知识。
课程地址:https://developer.aliyun.com/learning/course/362/detail/4297
jQuery_CSS 属性上
目录
一、Css()
二、height()
三、width()
四、innerHeight()
五、innerWidth()
六、offset()
七、outerHeight( )
八、outerWidth()
九、position()
十、scrollLeft()
十一、scrolTop()
一、Css():
获取匹配元素集合中的第一个元素的样式属性的值设置每个匹配元素的一个或多个CSS 属性。
示例:
创建 html 文件 domcss.html
<! DOCTYPE html><html lang="en"><head>
<meta charset="UTF-8"><title></title>
<script src="jquery-2.2.1.min.js"></script></head>
<body>
<div>我是一个div</div><script>
$
( function()i
$
("div").css( "color" , "red");})
< /script>< / body>< /html>
二、height():
获取匹配元素集合中的第一个元素的当前计算高度值。设置每一个匹配元素的高度值。
示例:
<style>
Div{
width: 100px;height: 200px ;
}
< / style></head>
<body>
<div>我是一个div</ div><script>
$( function(){
var div=$ ( "div" );
var cssobj={color: "red" , "background-color" : "green"3;$ ("div" ).css ( cssobj);
console.log(s ("div" ).css ( "color") ) ;
console.log(div.height() ) ;
})
< /script>< / body>
三、width() :
为匹配的元素集合中获取第一个元素的当前计算宽度值。给每个匹配的元素设置CSS 宽度。
四、innerHeight() :
为匹配的元素集合中获取第一个元素的当前计算高度值包括 padding,但是不包括border.
五、innerWidth() :
为匹配的元素集合中获取第一个元素的当前计算宽度值,包括 padding 但是不包括border.
六、offset() :
在匹配的元素集合中,获取的第一个元素的当前坐标,坐标相对于文档。设置匹配的元素集合中每一个元素的坐标 ,坐标相对于文档。
七、outerHeight( ):
获取元素集合中第一个元素的当前计算高度值,包括 padding ,border 和选择性的margin。返回个整数(不
包含"px" )表示的值或如果在一个空集合 上调用该方法,则会返回 null。
八、outerWidth():
获取元素集合中第一个元素的当前计算宽度值,包括 padding,border 和选择性的margin。(注:返回一个整数(不包含“px”)表示的值,或如果在一个空集合上调用该方法,则会返回 null.)
<! DOCTYPE html >
<html lang ="en”>
<head>
<meta charset ="UTF-8">
<title></title>
<script src=" jquery-2.2.1.min.js"></script>
<style>
div {
width:100px;
height:200px;
padding:100px;
margin:100px;
border:2px solid green;
</style>
<head>
<body>
<div>我是一个div</div>
<script>
$(function () {
Var div=$(“div”);
$(“div”).css (“color ”, “ red”)
$(“div”).css (“color”);
(console一下)
(console.log($(“div”).css(“color”))
Console .log ( div .height());
Console .log ( div .width());[可以接受参数]
//Console .log ( div .innerheight());
//Console .log ( div .innerwidth());[不可以接收参数]
})
</script>
九、position()∶
获取匹配元素中第一个元素的当前坐标,相对于 offset parent 的坐标。(译者注: offset parent 指离该元素最近的而且被定位过的祖先元素)
十、scrollLeft():
获取匹配的元素集合中第一个元素的当前水平滚动条的位置。设置每个匹配元素的水平滚动条位置。
十一、scrolTop()∶
获取匹配的元素集合中第一个元素的当前垂直滚动条的位置或设置每个匹配元素的垂直滚动条位置。设置每个匹配元素的垂直滚动备位置