jquery或者js獲取到元素寬高精確到小數

2022-04-09 05:32:40 字數 818 閱讀 4314

首先我們應該知道用jquery的width()方法獲取元素的寬高及樣式屬性數值時,如果元素的屬性是浮點數,會自動四捨五入成整數。

而如果我們就是想獲取實際的帶小數的屬性數值時該用什麼方法。

在使用獲取到的寬度時,為了保證與原來元素的寬度一致,我在工作中處理時有兩種解決方案:

第一種js原生方法getboundingclientrect()

$(obj)[0].getboundingclientrect().width.tofixed(2);  //獲取寬度 保留兩位小數

這種方法的width和height相容性比較差:ie9以上支援width/height屬性。

附上相容ie6~ie8的width/height的寫法:

var rectwidth = rectobject.right - rectobject.left;

rectheight = rectobject.bottom - rectobject.top;

第一種方如果取left和top,它並不是在position下得left和top值,它是指元素上邊或左邊到視窗上邊或左邊的距離;

相容性用ie11的document mode模式測試,ie5以上都能支援。在ie7及ie7以下left和top會多出兩個畫素。

第二種js原生最終樣式方法,即 currentstyle 和 getcomputedstyle 的相容寫法

var oabc = $('.element')[0];

if(oabc.currentstyle) else

建議用第二種,相容性好,且能同時取到width、height、left、top準確的數值。

JQuery元素獲取

前言 這是本類別博文jquery 即用即查開篇。因為查手冊太麻煩,而且有時候需要深入命令所在詳細頁面才能了解此命令的具體作用是什麼。寫這幾篇文章就是為了,工作遇到問題時,一看這幾篇文章就可以查到哪個命令的作用正好符合,然後自己再深入手冊進行具體學習用法。寫的都是常用的一些,前提是你對jquery命令...

jquery元素獲取

一 獲取父級元素 1 parent expr 獲取指定元素的所有父級元素 href fir href sec href thr href fiv document ready function firebug檢視jquery parent效果 二 獲取同級元素 1 next expr 獲取指定元素的...

JQuery元素獲取

前言 這是本類別博文jquery即用即查開篇。因為查手冊太麻煩,而且有時候需要深入命令所在詳細頁面才能了解此命令的具體作用是什麼。寫這幾篇文章就是為了,工作遇到問題時,一看這幾篇文章就可以查到哪個命令的作用正好符合,然後自己再深入手冊進行具體學習用法。寫的都是常用的一些,前提是你對jquery命令有...