Jquery—获取和设置尺寸(width,height)

Jquery处理尺寸的几个方法:

  • width()—设置或返回元素的宽度(不包括内边距、边框或外边距)
  • height()—设置或返回元素的高度(不包括内边距、边框或外边距)。
  • innerWidth()—返回元素的宽度(包括内边距)
  • innerHeight()—返回元素的高度(包括内边距)
  • outerWidth()—返回元素的宽度(包括内边距和边框)
  • outerHeight()—返回元素的高度(包括内边距和边框)
  • 尺寸图解如下:

Jquery—获取和设置尺寸(width,height)_第1张图片

获取尺寸:

 $(function(){
            $("button").click(function(){
                var box= $("#box");
                var text="height="+box.height()+"
" +"width="+box.width()+"
" +"innerWidth="+box.innerWidth()+"
" +"innerHeight="+box.innerHeight()+"
" +"outerWidth="+box.outerWidth()+"
" +"outerHeight="+box.outerHeight()+"
"; $("p").append(text); }) })

设置尺寸:

$(function(){
            $("button").click(function(){
                $("#box").height("500px").width("500px");
        })


本文参考资料来自:http://www.runoob.com/jquery/jquery-dimensions.html

你可能感兴趣的:(Jquery,Jquery学习之路)