width() 方法设置或返回元素的宽度(不包括内边距、边框或外边距)。

  height() 方法设置或返回元素的高度(不包括内边距、边框或外边距)。

  innerWidth() 方法返回元素的宽度(包括内边距)。

  innerHeight() 方法返回元素的高度(包括内边距)。  

  outerWidth() 方法返回元素的宽度(包括内边距和边框)。

  outerHeight() 方法返回元素的高度(包括内边距和边框)。

  outerWidth(true) 方法返回元素的宽度(包括内边距、边框和外边距)。

  outerHeight(true) 方法返回元素的高度(包括内边距、边框和外边距)。

  $(document).width()与$(window).width()返回文档(HTML 文档)和窗口(浏览器视口)的宽度和高度。

 <!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title></title>
<link rel="stylesheet" href="css/all.css" />
<style type="text/css">
div { margin: 10px; padding: 10px; width: 300px; height: 200px; border: 10px solid #ccc; }
</style>
<script type="text/javascript" src="js/jquery-1.7.2.min.js"></script>
<script type="text/javascript" src="js/all.js"></script>
</head> <body>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
</body>
</html>
<script type="text/javascript">
var s1 ='width()是' + $('div').width() +'px,因为width()不包含margin,padding,border';
var s2 ='innerWidth()是' + $('div').innerWidth() +'px,因为包含了padding,左右各10px';
var s3 ='outerWidth()是' + $('div').outerWidth() +'px,因为包含了padding(左右名10px)与border(左右名10px)';
var s4 ='outerWidth(true)是' + $('div').outerWidth(true) +'px,包含了padding,margin,border,左右名10px';
var s5 ='document文档的width()是' + $(document).width() +'px';
var s6 ='window窗口的width()是' + $(window).width() +'px';
alert(s1);
alert(s2);
alert(s3);
alert(s4);
alert(s5);
alert(s6);
alert('当没有垂直滚动条的时候,$(document).width()与$(window).width()在我的电脑上的宽度是1366,而在有垂直滚动条的时候,在我的电脑上的宽度是1349。并且当调整浏览器窗口的大小的时候,这两个值也会相应的发生变化。');
</script>

jquery尺寸:宽度与高度的更多相关文章

  1. 基于jQuery自适应宽度跟高度可自定义焦点图

    基于jQuery自适应宽度跟高度可自定义焦点图.这是一款带左右箭头,缩略小图切换的jQuery相册代码.效果图如下: 在线预览   源码下载 实现的代码. html代码: <section cl ...

  2. 关于JQuery获取宽度和高度在chrome和IE下的不同

    之前写了一个关于滚动条的东西,可是在写的时候发现JQuery在获取宽度和高度时在不同浏览器中是不一样的,下面发一下代码给给位看官先展示一下: $(function(){ $("#main&q ...

  3. js和jquery如何获取图片真实的宽度和高度

    按照插入的图片的尺寸来判断图片是横图还是竖图.然后判断过后给予不同的展示方式,下面为大家介绍下js和jquery如何获取图片真实的宽度和高度   1.什么时候需要获取图片真实的宽度和高度 在做pc网页 ...

  4. js和jquery获取图片真实的宽度和高度

    1.什么时候需要获取图片真实的宽度和高度 在做pc网页的时候,有时候会考虑按照插入的图片的尺寸来判断图片是横图还是竖图.然后判断过后给予不同的展示方式! 另外一种就是在手机页面上,在新闻页插入的图片往 ...

  5. 如何通过js和jquery获取图片真实的宽度和高度

    什么时候需要获取图片真实的宽度和高度 在做pc网页的时候,有时候会考虑按照插入的图片的尺寸来判断图片是横图还是竖图.然后判断过后给予不同的展示方式! 另外一种就是在手机页面上,在新闻页插入的图片往往都 ...

  6. 《Javascript、jQuery获取各种屏幕的宽度和高度方法》

    Javascript获取屏幕宽度和高度方法: document.body.clientWidth; //网页可见区域宽 document.body.clientHeight; //网页可见区域高 do ...

  7. jquery动态改变div宽度和高度

    效果体验:http://keleyi.com/keleyi/phtml/jquery/23.htm 完整代码: <!DOCTYPE html PUBLIC "-//W3C//DTD X ...

  8. jQuery获取或设置元素的宽度和高度

    jQuery获取或设置元素的宽度和高度: 可使用以下3种方法: 1,jQuery width() 和 height() 方法: 2,innerWidth() 和 innerHeight() 方法: 3 ...

  9. 使用jQuery获取元素的宽度或高度的几种情况

    今天说说使用jQuery获取元素大小的遇到几种情况 使用jQuery获取元素的宽度或高度的有几种情况: 1.使用width(),它只能获取当前元素的内容的宽度: 2.使用innerWidth(),它只 ...

随机推荐

  1. 【python】多进程学习

    来源:廖雪峰 讲解看来源吧 把例子记一下 1.用fork创建进程 import os print "Process (%s) start..." % os.getpid() pid ...

  2. 调用c++接口类

    调用c++接口类 public class CarDeviceDll { /*对dll库进行一些初始化*/ [DllImport("IDI.dll")] public static ...

  3. linux 用户、用户组不能是全数字

    今天封装命令行,需要创建用户.用户组,遇到下面问题,如图: 当时我和迷茫,为什么明明存在‘1111’这个用户组,但是却提示不存在呢??难道是linux的一个bug??? 接着我又试了几个: 发现规律了 ...

  4. C 和 Object- C 中得 #ifdef 和#ifndef

    很多宏是为了进行条件编译.一般情况下,源程序中所有的行都参加编译.但是有时希望对其中一部分内容只在满足一定条件才进行编译,也就是对一部分内容指定编译的条件,这就是“条件编译”.有时,希望当满足某条件时 ...

  5. [Android] adb shell dumpsys的使用

    reference to :http://blog.csdn.net/g19920917/article/details/38032413 有两种方法可以查看service list: 1. adb ...

  6. October 5th 2016 Week 41st Wednesday

    Don't follow the crowd, let the crowd follow you. 不要随波逐流,要引领潮流. But to be a good follower is already ...

  7. 第K 小数

    [问题描述]有两个正整数数列,元素个数分别为N和M.从两个数列中分别任取一个数相乘,这样一共可以得到N*M个数,询问这N*M个数中第K小数是多少.[输入格式]输入文件名为number.in.输入文件包 ...

  8. "稀奇古怪的"delete this

    myClass::foo(){     delete this; } .. void func(){     myClass *a = new myClass();     a->foo(); ...

  9. window 环境安装MongoDB

    强制安装mongodb服务 命令 sc create MongoDB binPath= "D:\MongoDB\Server\3.2\bin\mongod.exe --service --d ...

  10. lsof -ntP -i:端口取出 动行程序的PID 然后xargs kill -9 这个进程

    [root@ok ok]# lsof -ntP -i: [root@ok ok]# netstat -lnutp|grep tcp /dnsmasq tcp /sshd tcp ::: :::* LI ...