js中各種位置

nicercode 發布于2019-08-23 14:51 / 3360人閱讀

摘要：中各種位置中有各種與位置相關的屬性每次看到的時候都各種懵逼。內容可視區域的高度。對于的元素，這個屬性一直是，單位，只讀元素。標準事件和事件都定義了這兩個屬性

js中各種位置

js中有各種與位置相關的屬性,每次看到的時候都各種懵逼。索性一次總結一下。
clientHeight

內容可視區域的高度。包括padding不包括border、水平滾動條、margin。對于inline的元素這個屬性一直是0，單位px，只讀元素。

offsetHeight

offsetHeight = clientHeight + border + 滾動條。對于inline的元素，這個屬性一直是0，單位px，只讀元素。

scrollHieght

當子元素的高度比本元素高,且overflow不等于hidden時,scrollHeight就是網頁實際內容的高度。包括可視區域和被滾動條隱藏的區域。

clientWidth
offsetWidth
scrollWidth

同height

clientTop

元素上邊框的厚度,當沒有指定時,一般為0

offsetTop

元素距離父元素頂端的高度

scrollTop

滾動條被隱藏部分的高度,一般用來計算向下滾動多少像素

clientLeft
offsetLeft
scrollLeft

同top

event.clientX
event.clientY

相對于窗口可視區域的X,Y坐標,可視區域不包括工具欄和滾動條。

event.pageX
event.pageY

類似于event.pageX、event.pageY,但他們使用的是文檔坐標而非窗口坐標。這兩個屬性不是標準屬性，但得到廣泛支持。
event.pageX = event.clientX + 橫向滾動條距離。

event.offsetX
event.offsetY

鼠標相對于事件源元素(target)的X,Y坐標，只有IE事件有這兩個屬性，標準事件沒有對應的屬性

screenX
screenY

鼠標相對于用戶顯示器左上角的X,Y坐標。標準事件和IE事件都定義了這兩個屬性

云服務器 GPU云服務器 js 中各種數據類型的比較 js中獲取元素位置 js中變量的存儲位置 java中各種布局

文章版權歸作者所有，未經允許請勿轉載,若此文章存在違規行為，您可以聯系管理員刪除。

轉載請注明本文地址：http://specialneedsforspecialkids.com/yun/101248.html

JavaScript中的各種寬高以及位置總結

摘要：和這一對屬性是用來讀取元素的的寬度和高度的。第二部分對象在中，對于元素的運動的操作通常都會涉及到對象，而對象也存在很多位置屬性，且由于瀏覽器兼容性問題會導致這些屬性間相互混淆，這里一一講解。文章轉自中的各種寬高以及位置總結在javascript中操作dom節點讓其運動的時候，常常會涉及到各種寬高以及位置坐標等概念，如果不能很好地理解這些屬性所代表的意義，就不能理解js的運動原理，同時...

microelec 2019-08-21 10:26 評論0 收藏0
‘純css實現Material Design中的水滴動畫按鈕’的js體驗優化

摘要：前言在上一篇，我們已經實現了用純實現水滴擴散動畫，但是有一些瑕疵，文章結尾處也提到過，一是頁面加載進來就會看到按鈕上的水滴動畫運動一次，二是點擊的時候不能根據鼠標的位置來擴散，今天我們來解決這個問題。前言在上一篇，我們已經實現了用純css實現水滴擴散動畫，但是有一些瑕疵，文章結尾處也提到過，一是頁面加載進來就會看到按鈕上的水滴動畫運動一次，二是點擊的時候不能根據鼠標的位置來擴散，今...

genefy 2019-08-29 17:02 評論0 收藏0
‘純css實現Material Design中的水滴動畫按鈕’的js體驗優化

摘要：前言在上一篇，我們已經實現了用純實現水滴擴散動畫，但是有一些瑕疵，文章結尾處也提到過，一是頁面加載進來就會看到按鈕上的水滴動畫運動一次，二是點擊的時候不能根據鼠標的位置來擴散，今天我們來解決這個問題。前言在上一篇，我們已經實現了用純css實現水滴擴散動畫，但是有一些瑕疵，文章結尾處也提到過，一是頁面加載進來就會看到按鈕上的水滴動畫運動一次，二是點擊的時候不能根據鼠標的位置來擴散，今...

xiaoqibTn 2019-08-23 12:28 評論0 收藏0
HTML元素和事件對象中的各種寬高和位置

摘要：元素和事件對象中的各種寬高和位置標簽經常被一堆的弄混，統一整理一下。元素中的寬高和位置屬性表示元素的內部寬度，以像素計。表示元素實際占用的高度，包括其邊框，內邊距和元素內容。 HTML元素和事件對象中的各種寬高和位置標簽： js [TOC] 經常被一堆的xxxWidth,xxxLeft弄混，統一整理一下。 1. HTML元素中的寬高和位置屬性 clientWidth 表示元素的內...

gggggggbong 2019-08-22 10:40 評論0 收藏0
Node.js學習之路08——fs文件系統之stream流的基本介紹

摘要：中各種用于讀取數據的對象對象描述用于讀取文件代表客戶端請求或服務器端響應代表一個端口對象用于創建子進程的標準輸出流。如果子進程和父進程共享輸入輸出流，則子進程的標準輸出流被廢棄用于創建子進程的標準錯誤輸出流。 9. stream流 fs模塊中集中文件讀寫方法的區別用途使用異步方式使用同步方式將文件完整讀入緩存區 readFile readFileSync 將文件部...

BoYang 2019-08-22 14:47 評論0 收藏0