• <noscript id="ecgc0"><kbd id="ecgc0"></kbd></noscript>
    <menu id="ecgc0"></menu>
  • <tt id="ecgc0"></tt>

    用jquery獲取div在頁面上的位置

    html+jquery

    代碼編纂器:Dreamweaver CS5

    方式/步調

    1. 1

      新建一個html文件,定名為test.html,用于講解用jquery獲取div在頁面上的位置。

      03087bf40ad162d9e5b7a87c1edfa9ec8a13cd71.jpg
    2. 2

      在test.html文件內,引入jquery.min.js庫文件,當作功加載該文件,才能利用jquery中的方式。

      a6efce1b9d16fdfa2e220c8ebb8f8c5494ee7b00.jpg
    3. 3

      在test.html文件內,利用div建立一個模塊,并設置div的id屬性為pos,本家兒要用于下面經由過程該id獲得div對象。

      c995d143ad4bd113ac397d5255afa40f4afb05de.jpg
    4. 4

      在test.html文件內,利用button標簽建立一個按鈕,按鈕名稱為“獲取XY坐標”。

      5366d0160924ab1846e22b573afae6cd7a890bde.jpg
    5. 5

      在test.html文件內,給button按鈕綁心猿意馬onclick點擊事務,當按鈕被點擊時,執行getxy()函數。

      728da9773912b31b4b9807498918367adbb4e1df.jpg
    6. 6

      在js標簽中,建立getxy()函數,在函數內,利用$符號經由過程id(pos)獲得div對象,利用offset().top獲得div的X坐標,利用offset().left獲得div的Y坐標,最后,利用alert()方式輸出div的位置。

      c995d143ad4bd113adfd825355afa40f4bfb059a.jpg
    7. 7

      在瀏覽器打開test.html文件,點擊按鈕,查看獲得的X、Y坐標。

      c8177f3e6709c93dc0bbc497903df8dcd1005401.jpg
    • 發表于 2019-12-07 17:28
    • 閱讀 ( 764 )
    • 分類:其他類型

    0 條評論

    請先 登錄 后評論
    admin
    admin

    0 篇文章

    作家榜 ?

    1. xiaonan123 189 文章
    2. 湯依妹兒 97 文章
    3. luogf229 46 文章
    4. jy02406749 45 文章
    5. 小凡 34 文章
    6. Daisy萌 32 文章
    7. 我的QQ3117863681 24 文章
    8. 華志健 23 文章

    聯系我們:uytrv@hotmail.com 問答工具
  • <noscript id="ecgc0"><kbd id="ecgc0"></kbd></noscript>
    <menu id="ecgc0"></menu>
  • <tt id="ecgc0"></tt>
    久久久久精品国产麻豆