jQuery - 使用要点 - CSS, Styling, & Dimensions

CSS, Styling, & Dimensions

取得CSS属性：

// 驼峰模式 fontSize 等同连字符连接形式 font-size
$( "h1" ).css( "fontSize" ); // 返回如： "19px" 的字符串
 
$( "h1" ).css( "font-size" );

设置CSS属性：

$( "h1" ).css( "fontSize", "100px" ); // 设置单个属性
 
// 设置多个属性
$( "h1" ).css({
    fontSize: "100px",
    color: "red"
});

使用CSS class设置样式：

var h1 = $( "h1" );
 
h1.addClass( "big" );
h1.removeClass( "big" );
h1.toggleClass( "big" );
 
if ( h1.hasClass( "big" ) ) {
    ...
}

Dimensions (尺寸)：

完整文档：Dimensions Documentation

// 基本方法
// 设置所有 <h1> 元素的宽度
$( "h1" ).width( "50px" );
 
// 取得第一个 <h1> 元素的宽度
$( "h1" ).width();
 
// 设置所有 <h1> 元素的高度
$( "h1" ).height( "50px" );
 
// 取得第一个 <h1> 元素的高度
$( "h1" ).height();

// 返回一个对象
// 该对象包含第一个 <h1> 元素相对于"offset (positioned) parent"的位置信息
$( "h1" ).position();