九、CSS-DOM操作

版权声明：本文为博主原创文章，未经博主允许不得转载。 https://blog.csdn.net/MASORL/article/details/80825570

1、css()方法:获取或设置元素的样式属性

$("p").css("color");//获取color值
$("p").css("color", "red");//设置color值
$("p").css({"color": "red", "backgroundColor": "#fff"});//设置多个值

注：1）如果值是数字，自动转化为像素值

      2）在css()方法中，如果属性带有“-”f符号，可以有两种写法，如font-size

            不带引号写法：使用驼峰式写法

$("p").css({fonSize: "38px"});//必须式{}包围中才可以这样写 css(fonSize, "38px")无效

            带引号写法:两种写法都可以

$("p").css({"font-size": "39px"});
$("p").css({"fontSize": "39px"});

2、height()方法：获取或设置匹配元素当前计算的高度值（px）

$("p").height();//获取高度
$("p").height(100);//设置高度为100px
$("p").height(100em);//设置高度为100em

注：1）jQuery1.2版本后的height可以获取window和document的高度

      2）css("height")的区别：css()方法获取的高度之值与样式设置有关，可能获取到auto，也有可能获取到10px之类的字符串。而height()方法获取的高度值是元素在页面中的实际高度，与样式设置无关，并且不带单位。

3、width()方法：获取和设置元素的宽度值（与height()类似）

4、jQuery元素定位常用方法

    1)offset()方法：获取元素在当前视窗的相对偏移。返回对象包含两个属性，top和left(只对可见元素有效)

var offset = $("p").offset();//获取<p>元素的offset
offset.left;//获取左偏移
offset.top;//获取右偏移

    2)position()方法：获取元素相对于最近的一个position样式属性设置为relative或者absolute的祖先节点的相对偏移。返回的对象包括两个属性。

var position = $("p").position();//获取<p>元素的position()
position.left;//获取左偏移
position.right;//获取右偏移    

    3)scrollTop()方法和scrollLeft()方法:    获取元素的滚动条距顶端的距离和距左侧的距离。

$("p").scrollTop();//获取元素的滚动条距顶端的距离
$("p").scrollLeft();//获取元素的滚动条距左侧的距离
$("p").scrollTop(300);//元素的垂直滚动条滚动到指定位置
$("p").scrollLeft(300);//元素的横向滚动条滚动到指定的位置