jQuery innerWidth() 方法
-
定义和用法
innerWidth() 方法返回第一个匹配元素的内部宽度。如下面的图像所示，该方法包含 padding，但不包含 border 和 margin。
-
语法
$(selector).innerWidth() -
实例
下例演示了返回指定 <div>元素的内部宽度/高度：
尝试一下<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>欢迎来到菜鸟教程</title> //此版本是百度cdn 1.11.1，当然你可以使用更高的版本，从2.0版本以上的是不支持ie6-8的 <script type="text/javascript" src="http://libs.baidu.com/jquery/1.11.1/jquery.min.js"></script> <script> $(document).ready(function () { $("button").click(function(){ var txt = ""; txt += "div 宽度，包含内边距:" + $("#div1").innerWidth() + "<br/>"; txt += "div 高度，包含内边距:" + $("#div1").innerHeight(); $("#div1").html(txt); }); }); </script> </head> <body> <div id="div1" style="height:100px;width:300px;padding:10px;margin:3px;background-color:#ddd;">这是一个段落</div> <button>点击显示div元素的尺寸</button> </body> </html> -
相关方法
- width() - 设置或返回元素的宽度
- height() - 设置或返回元素的高度
- innerHeight() - 返回元素的高度（包含 padding）
- outerWidth() - 返回元素的宽度（包含 padding 和 border）
- outerHeight() - 返回元素的高度（包含 padding 和 border）
-
相关页面