jQuery获得包含margin的outerWidth和outerHeight的方法
2015-03-25 16:13
786 查看
<!DOCTYPE html> <html> <head> <script src="js/jquery.min.js"> </script> <script> $(document).ready(function(){ $("button").click(function(){ var txt=""; txt+="Width of div: " + $("#div1").width() + "</br>"; txt+="Height of div: " + $("#div1").height() + "</br>"; txt+="Outer width of div (margin included): " + $("#div1").outerWidth(true) + "</br>"; txt+="Outer height of div (margin included): " + $("#div1").outerHeight(true); $("#div1").html(txt); }); }); </script> </head> <body> <div id="div1" style="height:100px;width:300px;padding:10px;margin:3px;border:1px solid blue;background-color:lightblue;"> </div> <br> <button>Display dimensions of div</button> <p>outerWidth(true) - returns the width of an element (includes padding, border, and margin).</p> <p>outerHeight(true) - returns the height of an element (includes padding, border, and margin).</p> </body> </html>
希望本文所述对大家的jQuery程序设计有所帮助。
您可能感兴趣的文章:
相关文章推荐
- jQuery获得包含margin的outerWidth和outerHeight
- jQuery中的width()、heihgt()、innerWidth()、innerHeight()、outerWidth()和outerHeight()方法的区别
- JQuery 使文本框获得焦点的方法
- Jquery获得服务器控件值的方法
- MVC5 新建项目里不包含jquery.unobtrusive-ajax.js(MVC5异步表单的问题)解决方法
- jQuery中给文本框获得焦点和失去焦点的方法
- JQuery下focus()无法自动获取焦点的处理方法 jquery如何使文本框获得焦点
- Jquery 的outerHeight方法使用介绍
- JQuery 中,使文本框获得焦点的方法
- Jquery获得服务器控件值的方法
- Jquery的html方法里包含特殊字符的处理,类似双引号之类的
- jquery的outerWidth和outerHeight
- jquery中获得元素尺寸和坐标的方法
- JQuery中根据属性或属性值获得元素(6种情况获取方法)
- jquery outerHeight方法 outerWidth方法 获取元素实际宽度高度
- Jquery 获得控件值的方法
- Jquery each方法跳出循环,并获得返回值
- jQuery中outerHeight()方法用法实例
- 在js(jquery)中获得文本框焦点和失去焦点的方法
- JQuery下focus()无法自动获取焦点的处理方法 jquery如何使文本框获得焦点