jquery 操作css样式、位置、尺寸方法汇总

2020-05-22 15:13:07易采站长站整理

*/
var p = $(“p:first”);
$(“p:last”).text(“scrollTop:” + p.scrollTop());

4、scrollTop(val)

传递参数值时,设置滚动条顶部偏移为该值。此方法对可见和隐藏元素均有效。
返回值 jQuery
示例:

$(“div.demo”).scrollTop(300);

5、scrollLeft()

获取匹配元素相对滚动条左侧的偏移。此方法对可见和隐藏元素均有效。
返回值 Integer
示例:


/*
//获取第一段相对滚动条左侧的偏移   
文档片段:<p>Hello</p><p>2nd Paragraph</p>
*/
var p = $(“p:first”);
$(“p:last”).text(“scrollLeft:” + p.scrollLeft());

6、scrollLeft(val)

传递参数值时,设置滚动条左侧偏移为该值。此方法对可见和隐藏元素均有效。
返回值 jQuery
示例:

$(“div.demo”).scrollLeft(300);

三、尺寸

1、height()

取得第一个匹配元素当前计算的高度值(px)。在 jQuery 1.2 以后可以用来获取 window 和 document 的高
返回值 Integer
示例:

/*
//获取第一段的高    
文档片段:<p>Hello</p><p>2nd Paragraph</p>
*/
alert($(“p”).height());
//获取文档的高
alert($(document).height());

2、height(val)

为每个匹配的元素设置CSS高度(hidth)属性的值。如果没有明确指定单位(如:em或%),使用px。如果没有明确指定单位(如:em或%),使用px。
返回值 jQuery
参数
val (String, Number) : 设定CSS中 ‘height’ 的值
示例:


/*
//把所有段落的高设为 20 
文档片段:<p>Hello</p><p>2nd Paragraph</p>
*/
$(“p”).height(20);
alert($(“p”).height());

3、width()

取得第一个匹配元素当前计算的宽度值(px)。在 jQuery 1.2 以后可以用来获取 window 和 document 的宽
返回值 Integer
示例:0

/*
//获取第一段的宽
文档片段:<p>Hello</p><p>2nd Paragraph</p>
*/
alert($(“p”).width());

4、width(val)

为每个匹配的元素设置CSS宽度(width)属性的值。如果没有明确指定单位(如:em或%),使用px。
返回值 jQuery
参数
val (String, Number) : 设定 CSS ‘width’ 的属性值
示例:

/*
//将所有段落的宽设为 20
文档片段:<p>Hello</p><p>2nd Paragraph</p>