jquery获取div的高度和宽度(获取div实际宽高度的方法)
程序员文章站
2023-11-27 19:05:58
前端web页面中,js可以很方便的获取div元素的高度和宽度,那么这篇文章就说一说原生js与jq如何快速的获取div元素的高度和宽度的方法。js获取div元素高度与宽度的方法js获取div元素的高度与...
前端web页面中,js可以很方便的获取div元素的高度和宽度,那么这篇文章就说一说原生js与jq如何快速的获取div元素的高度和宽度的方法。
js获取div元素高度与宽度的方法
js获取div元素的高度与宽度要用的 clientheight 与 clientwidth方法
clientheight:返回元素的可视高度
clientwidth:返回元素的可视宽度
示例代码:
<div id="mochu" style="height: 200px;width:150px;color:#fff;background-color: blueviolet;"> 飞鸟慕鱼博客 </div> <script> //获取高度 var h = document.getelementbyid('mochu').clientheight; //获取宽度 var w = document.getelementbyid('mochu').clientwidth; console.log(h); console.log(w); </script>
打印结果:
200
150
jquery获取div元素高度与宽度的方法
相对于原生的 javascript 来说,使用 jquery 来获取 div 元素的高度与宽度要简单的多。
jq获取div元素宽度的方法
$(selector).width()
jq获取div元素高度的方法
$(selector).height()
示例代码:
<div id="mochu" style="height: 100px;width:150px;"> http://www.feiniaomy.com </div> <script> //获取高度 var h = $('#mochu').height(); //获取宽度 var w = $('#mochu').width(); console.log(h); console.log(w); </script>
打印结果:
100
150
上一篇: CAD怎么使用直线工具绘制图形?
下一篇: 干货!如何提高产品推广的“转化率”