當(dāng)前位置：首頁(yè) > 编程资源 > 编程问答 >内容正文

编程问答

2020-3-29

發(fā)布時(shí)間：2023/12/19 编程问答 26 豆豆

生活随笔收集整理的這篇文章主要介紹了 2020-3-29 小編覺(jué)得挺不錯(cuò)的,現(xiàn)在分享給大家,幫大家做個(gè)參考.

題目一：
JavaScript 獲取div在頁(yè)面中坐標(biāo)
以div為例，獲取一個(gè)元素在頁(yè)面中的位置。
代碼和

<!DOCTYPE html> <html> <head> <meta charset=" utf-8"> <style type="text/css"> *{padding:0px;margin:0px; } #thediv{width:100px;height:125px;margin:200px;background:green;text-align:center;font-size:12px;line-height:125px; } </style> <script type="text/javascript"> function getIE(e,show){//此函數(shù)可以獲取響應(yīng)對(duì)象在頁(yè)面的位置，并將位置顯示在指定元素中，第一個(gè)參數(shù)是要獲取位置的元素對(duì)象，第二個(gè)參數(shù)是顯示位置的元素對(duì)象。var t=e.offsetTop;//返回元素距離最近定位父級(jí)元素頂部的距離，如果父級(jí)中沒(méi)有定位元素，則返回距離body頂端的距離var l=e.offsetLeft;//返回元素距離最近定位父級(jí)元素左部的距離，如果父級(jí)中沒(méi)有定位元素，則返回距離body左端的距離。while(e=e.offsetParent){t+=e.offsetTop;l+=e.offsetLeft;}//因?yàn)橛锌赡茉厥潜欢鄬忧短椎?#xff0c;所以相關(guān)距離需要進(jìn)行疊加。show.innerHTML="top="+t+"/nleft="+l;//將位置數(shù)據(jù)寫(xiě)入指定對(duì)象。} window.onload=function(){var odiv=document.getElementById("thediv");var oshow=document.getElementById("show");getIE(odiv,oshow) } </script> </head> <body> <div id="show">測(cè)試</div> <div id="thediv">測(cè)試</div> </body> </html>

相關(guān)知識(shí)：
（1）.offsetTop屬性參閱JavaScript offsetTop。
（2）.offsetParent屬性參閱JavaScript offsetParent。

總結(jié)

以上是生活随笔為你收集整理的2020-3-29的全部?jī)?nèi)容，希望文章能夠幫你解決所遇到的問(wèn)題。

如果覺(jué)得生活随笔網(wǎng)站內(nèi)容還不錯(cuò)，歡迎將生活随笔推薦給好友。