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

编程问答

jquery获取元素宽高

發(fā)布時(shí)間：2024/9/19 编程问答 33 豆豆

生活随笔收集整理的這篇文章主要介紹了 jquery获取元素宽高小編覺得挺不錯(cuò)的,現(xiàn)在分享給大家,幫大家做個(gè)參考.

前言

jquery獲取元素寬高

<!DOCTYPE html> <html lang="zh" > <head><meta charset="utf-8"><style>li {margin: 10px;padding: 5px;border: 2px solid #666;width: 800px;height: 100px;display: block;}li:first-child {background-color:#0fc;}li:nth-child(2) {background-color:#cf0;}li:nth-child(3) {background-color:#cfc;}li:last-child {background-color:#3f0;}li:nth-last-child(2) {background-color:#333;}</style> </head> <body class="white-bg"><ul><li></li><li></li><li></li><li></li><li></li></ul><script src="https://lib.baomitu.com/jquery/3.5.1/jquery.min.js"></script> <script type="text/javascript"> $(function(){$("li:eq(0)").text("width:" + $("li:eq(0)").width() + "，innerWidth:" + $("li:eq(0)").innerWidth() + "，outerWidth:" + $("li:eq(0)").outerWidth() + "，outerWidth(true):" + $("li:eq(0)").outerWidth(true));$("li:eq(1)").text("width:" + $("li:eq(1)").height() + "，innerHeight:" + $("li:eq(1)").innerHeight() + "，outerHeight:" + $("li:eq(1)").outerHeight() + "，outerHeight(true):" + $("li:eq(1)").outerHeight(true)); }); </script> </body> </html>

參考

https://www.cnblogs.com/goloving/p/7113567.html
https://api.jquery.com/width/
https://api.jquery.com/innerWidth/
https://api.jquery.com/outerWidth/
https://api.jquery.com/

總結(jié)

以上是生活随笔為你收集整理的jquery获取元素宽高的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。

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