JavaScript 元素在document文件中位置
在實際應用中,可能需要獲取一個元素再document文件中的位置。
下面就以獲取一個div元素再document中的位置為例做一下介紹。
程式碼例項如下:
[HTML] 純文字檢視 複製程式碼執行程式碼<!DOCTYPE HTML> <html> <head> <meta charset="utf-8"> <meta name="author" content="http://www.softwhy.com/" /> <title>螞蟻部落</title> <style> * { margin:0px; padding:0px; } #antzone { width:200px; height:100px; background:#ccc; margin:0px auto; margin-top:100px; text-align:center; } </style> <script src="http://libs.baidu.com/jquery/1.9.0/jquery.js"></script> <script type="text/javascript"> $(document).ready(function () { var $div = $("#antzone"); var x = $div.offset().left; var y = $div.offset().top; $div.text("橫座標:"+ x + "縱座標:"+y); }) </script> </head> <body> <div id="antzone"></div> </body> </html>
上面的程式碼可以獲取div在document文件中的座標位置。
相關閱讀:
(1).offset方法可以參閱jQuery offset()一章節。
(2).text方法可以參閱jQuery text()一章節。
相關文章
- JavaScript獲取元素在陣列中的位置JavaScript陣列
- JavaScript獲取元素在文件中座標JavaScript
- javascript獲取當前li元素在集合中的位置JavaScript
- jQuery元素在陣列中的索引位置jQuery陣列索引
- JavaScript中document的用法JavaScript
- 設定元素在文件中的座標
- js如何獲取元素在頁面中的位置JS
- JavaScript 陣列 指定索引位置插入元素JavaScript陣列索引
- javascript在iframe子元素中獲取父視窗元素JavaScript
- 【JavaScript】牛客程式設計練習:找出元素 item 在給定陣列 arr 中的位置JavaScript程式設計陣列
- filter在JavaScript中過濾陣列元素FilterJavaScript陣列
- JavaScript陣列指定位置插入新元素JavaScript陣列
- JavaScript方向鍵調整div元素的位置JavaScript
- Javascript刷題 》 查詢陣列元素位置JavaScript陣列
- JavaScript獲取元素相對於document的偏移量JavaScript
- 小程式獲取當前元素在螢幕中的位置
- JavaScript獲取滑鼠在文件中座標JavaScript
- JavaScript獲取滑鼠在元素中的座標JavaScript
- JavaScript document物件JavaScript物件
- JavaScript獲取當前li元素的索引位置JavaScript索引
- 1.找出元素 item 在給定陣列 arr 中的位置陣列
- JavaScript在指定元素後面插入元素JavaScript
- 在JS陣列指定位置插入元素JS陣列
- 獲取棧中任意位置的元素
- 獲取元素在頁面中的座標位置程式碼例項
- getBoundingClientRect方法獲取元素在頁面中的相對位置GCclient
- JavaScript 陣列的指定位置插入多個元素JavaScript陣列
- MongoDB(5)- Document 文件相關MongoDB
- javascript document.allJavaScript
- JavaScript在元素尾部追加字串JavaScript字串
- Search Insert Position 查詢給定元素在陣列中的位置,若沒有則返回應該在的位置陣列
- js練習(一)找出元素item在給定陣列arr中的位置JS陣列
- LEADTOOLS的新功能Document Composer可以讓你在多個檔案中建立文件
- 如果陣列中存在 item,則返回元素在陣列中的位置,否則返回 -1陣列
- javascript獲取滑鼠在網頁文件中的座標JavaScript網頁
- DOM (文件物件模型(Document Object Model))物件模型Object
- 6.6 多文件介面(Multiple Document Interface)
- javascript如何在元素中插入新的元素JavaScript