⽤JQuery操作元素的style属性
可以直接利⽤css()⽅法获取元素的样式属性，JQuery代码如下：
1$("p").css("color");  //获取p元素的样式颜⾊
⽆论color属性是外部CSS导⼊，还是直接拼接在HTML元素⾥（内联），css()⽅法都可以获取到属性style⾥的其他属性的值。
也可以直接利⽤css()⽅法设置某个元素的单个样式，例如：
1$("p").css("color","red");  //设置p元素的样式颜⾊为红⾊
与attr()⽅法⼀样，css()⽅法也可以同时设置多个样式属性，代码如下：
1//同时设置字体⼤⼩和背景⾊
2$("p").css({"fontSize":"30px","backgroundColor":"#ccc"})；
如果值是数字，将会被⾃动转化为像素值。在css()⽅法中，如果属性中带有“-”符号，例如font-size和background-color属性，如果在设置这些属性的值的时候不带引号，那么就要⽤驼峰式写法，⽐如上⾯
的代码，如果带上了引号，既可以写成“font-size”，也可以写成“fontSize”。总之建议⼤家加上引号，养成良好的习惯。
对透明度的设置，可以直接使⽤opacity属性，jQuery已经处理好了兼容性的问题，如下代码所⽰，将p元素的透明度设置为半透明：
1$("p").css("opacity","0.5");
如果需要获取某个元素的height属性，则可以通过如下JQuery代码实现：
1$(element).css("height");
在jQuery中还有另外⼀种⽅法也可以获取元素的⾼度，即height()。它的作⽤是取得匹配元素当前计算的⾼度值(px)：
1$("p").height();    //获取p元素的⾼度值
height()⽅法也能⽤来设置元素的⾼度，如果传递的值是⼀个数字，则默认单位为px。如果要⽤其他单位（例如em），则必须传递⼀个字符串，JQuery代码如下：
1$("p").height("100px"); //设置p元素的⾼度值为l00px
2$("p").height("2em");  //设置p元素的⾼度值为2em
1. 在jQuery l.2版本以后的height()⽅法可以⽤来获取window和document的⾼度。
2. 两者的区别是：css()⽅法获取的⾼度值与样式的设置有关，可能会得到“auto”，也可能得到”10px”之类的字符串；⽽height()⽅法获取
的⾼度值则是元素在页⾯中的实际⾼度，与样式的设置⽆关，并且不带单位。
与height()⽅法对应的还有⼀个width()⽅法，它可以取得匹配元素的宽度值(px)。
1$("p").width()； //获取p元素的宽度值
同样，width()⽅法也能⽤来设置元素的宽度。
1$("p").width("400px");  //设置p元素的宽度值为400px
jquery在一个元素后追加标签offset()⽅法
它的作⽤是获取元素在当前视窗的相对偏移，其中返回的对象包含两个属性，即top和left，它只对可见元素有效。例如⽤它⽶获取p元素的的偏移量：
1var offset = $("p").offset();  //获取p元素的offset()
2var left = offset.left;  //获取左偏移
3var top =  p;    //获取右偏移
position()⽅法
它的作⽤是获取元素相对于最近的⼀个position样式属性设置为relative或者absolute的祖⽗节点的相对偏移，与offset()⼀样，它返回的对象也包括两个属性，即top和left。JQuery代码如下：
1var position = $("p").position();    //获取p元素的position()
2var left = position.left;    //获取左偏移
3var top = p;    //获取右偏移
scrollTop()⽅法和scrollLeft()⽅法
这两个⽅法的作⽤分别是获取元素的滚动条距顶端的距离和距左侧的距离。例如使⽤下⾯的代码获取p元素的滚动条距离：
1var$p =  $("p");
2var scrollTop = $p.scrollTop();    //获取元素的滚动条距顶端的距离
3var scrollLeft = $p.scrollLeft()；    //获取元素的滚动条距左侧的距离
另外，可以为这两个⽅法指定⼀个参数，控制元素的滚动条滚动到指定位置。例如使⽤如下代码控制元素内的滚动条滚动到距顶端300和距左侧300的位置：
1$("textarea").scrollTop (300);    //元素的垂直滚动条滚动到指定的位置
2$("textarea").scrollLeft (300); //元素的横向滚动条滚动到指定的位置
⾄此，已经将jQuery中常⽤的DOM操作（包括DOM Core，HTML-DOM和CSS-DOM）都已经介绍完毕。

版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。