刘新修

CSS-DOM技术简单来书就是读取和设置style对象的各种属性。style属性很有用，但最大不足是无法通过它来提取到通过外部CSS设置的样式信息，然而在jQuery中，这些都是非常的简单。

可以直接利用css()方法获取元素的样式属性，jQuery代码如下；

无论color属性是外部CSS导入，还是直接拼接在HTML元素里，css()方法都可以获取到属性style里的其它属性的值。

也可以直接利用css()方法设置某个元素的单个样式，例如：

与attr()方法一样，css()方法也可以同时设置多个样式属性，代码如下：

对透明度的设置，可以直接使用opacity属性，则可以通过如下jQuery代码实现：

如果获取某个元素的height属性，则可以通过如下jQuery代码实现；

在jQuery中还有另外一种方法也可以获取元素的高度，即height().他的左右是取得匹配元素当前计算的高度（px）。jQuery代码如下：

height()方法也能用来设置元素的高度，如果传递的值是一个数字，则默认单位为px.如果要用其他单位（例如em），则必须传递一个字符串。jQuery代码如下：

与height()方法对应的还有一个width()方法，它可以取得匹配元素的宽度值（px）。

同样，width()方法也能用来设置元素的宽度

此外，在CSS-DOM中，还有以下几个经常使用的方法。

1.offset()方法

它的作用是获取元素在当前视窗的相对偏移，其中返回的对象包含两个属性，即top和left,它只对可见元素有效。例如用它来获取<p>元素的偏移量，jQuery代码如下：

2.position()方法

它的作用是获取元素相对于最近的一个postion样式属性设置为relative或者absolute的祖父节点的相对偏移，与offset()一样，它返回的对象也包括两个属性，即top和left。jQuery代码如下：

3.scrollTop方法和scrollLeft()方法

这两个方法的作用分别是获取元素的滚动条距顶端的距离和距左侧的距离。例如使用下面的代码获取<p>元素的滚动条距离：

另外，可以为这两个方法指定一个参数，控制元素的滚动条到指定位置。例如使用如下代码控制元素内的滚动条滚动到距顶端300和距左侧300的位置；