JS獲取浮動(dòng)(float)元素的style.left值為空的快速解決辦法
解決辦法:
1.使用行內(nèi)樣式設(shè)置元素的top和left值;
2.or直接獲取元素的offsetLeft得到相關(guān)數(shù)值,還不需要parseInt
問題原因:
如果父div的position定義為relative,子div的position定義為absolute，那么子div的style.left的值是相對(duì)于父div的值，這同offsetLeft是相同的，區(qū)別在于：
style.left 返回的是字符串，如28px，offsetLeft返回的是數(shù)值28，如果需要對(duì)取得的值進(jìn)行計(jì)算，還用offsetLeft比較方便。
style.left是讀寫的，offsetLeft是只讀的，所以要改變div的位置，只能修改style.left。
style.left的值需要事先定義，否則取到的值為空,而且必須是以行內(nèi)樣式的形式定義，如果定義在css里，style.left的值仍然為undefined;而offsetLeft則仍然能夠取到，無需事先定義div的位置。
以上所述是小編給大家介紹的JS獲取浮動(dòng)(float)元素的style.left值為空的快速解決辦法，希望對(duì)大家有所幫助，如果大家有任何疑問歡迎給我留言，小編會(huì)及時(shí)回復(fù)大家的！
相關(guān)文章
uniapp實(shí)現(xiàn)h5、app與微信小程序三端pdf文件下載和預(yù)覽功能
作為使用uni-app的小白來說,嘗試了好幾種方法,終于得到了我想要的效果,下面這篇文章主要給大家介紹了關(guān)于uniapp實(shí)現(xiàn)h5、app與微信小程序三端pdf文件下載和預(yù)覽功能的相關(guān)資料,需要的朋友可以參考下2022-12-12
微信小程序?qū)崿F(xiàn)指定顯示行數(shù)多余文字去掉用省略號(hào)代替
這篇文章主要介紹了微信小程序?qū)崿F(xiàn)指定顯示行數(shù)多余文字去掉用省略號(hào)代替的方法,需要的朋友可以參考下2018-07-07
小程序?qū)崿F(xiàn)按下錄音松開識(shí)別語音
這篇文章主要為大家詳細(xì)介紹了小程序?qū)崿F(xiàn)按下錄音松開識(shí)別語音，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2019-11-11
當(dāng)一串?dāng)?shù)字的時(shí)候，很多瀏覽器不能自動(dòng)換行，所以可以借助js來實(shí)現(xiàn)。2010-08-08
js實(shí)現(xiàn)鼠標(biāo)拖動(dòng)功能
本文主要介紹了js實(shí)現(xiàn)鼠標(biāo)拖動(dòng)功能的實(shí)例代碼。具有很好的參考價(jià)值。下面跟著小編一起來看下吧2017-03-03
利用Promise自定義一個(gè)GET請(qǐng)求的函數(shù)示例代碼
這篇文章主要給大家介紹了關(guān)于如何利用Promise自定義一個(gè)GET請(qǐng)求的函數(shù)的相關(guān)資料，文中通過示例代碼介紹的非常詳細(xì)，對(duì)大家學(xué)習(xí)或者使用Promise具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面來一起學(xué)習(xí)學(xué)習(xí)吧2019-03-03
這篇文章主要介紹了詳解微信小程序開發(fā)之城市選擇器 城市切換，非常具有實(shí)用價(jià)值，需要的朋友可以參考下。2017-01-01
JS判斷鼠標(biāo)從什么方向進(jìn)入一個(gè)容器實(shí)例說明
偶然將想到的一個(gè)如何判斷鼠標(biāo)從哪個(gè)方向進(jìn)入一個(gè)容器的問題,并且做了一系列的設(shè)想，代碼部分不是很多，我直接寫了個(gè)示例， 感興趣的朋友可以了解下，或許本文對(duì)你有所幫助2013-02-02
js通過地址欄給action傳值(中文亂碼全是問號(hào))
我從js代碼中通過地址欄傳值給了action的相應(yīng)變量，但是，如果變量值為中文的時(shí)候，在action中測試輸出則為問號(hào)2013-05-05
JavaScript實(shí)現(xiàn)數(shù)組對(duì)象去重的多種方法
這篇文章主要介紹了JavaScript實(shí)現(xiàn)數(shù)組對(duì)象去重的多種方法，使用set對(duì)象或使用`reduce`方法，本文結(jié)合示例代碼給大家介紹的非常詳細(xì)，需要的朋友參考下吧2023-02-02