jQuery 其他 尺寸值

2021-08-26 12:38:23 字數 1918 閱讀 9284

包裹元素

用b包裹每乙個a
$(

"div").wrap("

");

用b包裹所有a
$(

"div").wrapall("

");

用b包裹每乙個a的內容
$(

"div").wrapinner("

");

遍歷節點

$("div").each(function

(i,e)

})

寬度

console.log($(

"#one").width());//width

console.log($(

"#one").innerwidth());//width + padding

console.log($(

"#one").outerwidth());//width + padding + border

console.log($(

"#one").outerwidth(true));//width + padding + border + margin

高度

console.log($(

"#one").height());//height

console.log($(

"#one").innerheight());//height + padding

console.log($(

"#one").outerheight());//height + padding + border

console.log($(

"#one").outerheight(true));//height + padding + border + margin

元素到當前頁面頂端和左端的距離

* offset() 方法得到的是乙個物件 該物件存在兩個屬性

* left : 元素到頁面左端的距離

* top : 元素到頁面頂端的距離

獲取

console.log($("#one").offset());

console.log($("#one").offset().left);

console.log($("#one").offset().top);

設定

$("#one").offset();
/*

* 元素到離他最近已定位父級的距離

* * position() 方法得到的是乙個物件 該物件存在兩個屬性

* left : 元素到最近已定位父級左端的距離

* top : 元素到最近已定位父級頂端的距離

* * 注意:該方法是以margin的邊緣位置為起點

*///只能獲取

console.log($(

"#one").position());

console.log($(

"#one").position().left);

console.log($(

"#one").position().top);

//滾動條的位置

console.log($(

":root").scrolltop());//垂直滾動條的位置

console.log($(

":root").scrolltop());//水平滾動條的位置

jQuery尺寸演算法

我們預設都統一是採用offsetwidth或者offsetheight取值了,但我們知道關於這2個尺寸的演算法是這樣的 offsetwidth border left width padding left width padding right border right width offsethe...

JQuery學習之jQuery尺寸

1.width 和height 方法 width 設定或返回元素的寬度 不包括內邊距,邊框或外邊距 height 設定或返回元素的高度 不包括內邊距,邊框或外邊距 button click function var txt txt width div1 width txt height div1 h...

jQuery學習教程十七 jQuery 尺寸

通過 jquery,很容易處理元素和瀏覽器視窗的尺寸。jquery 提供多個處理尺寸的重要方法 width 方法設定或返回元素的寬度 不包括內邊距 邊框或外邊距 height 方法設定或返回元素的高度 不包括內邊距 邊框或外邊距 下面的例子返回指定的 元素的寬度和高度 顯示 div 的尺寸 widt...