不多说,用一图足以说明

首先先解释下普通元素和非普通元素,

  非普通元素是指window,document这些 元素对象,

  普通元素是指除window,document之外的元素,如:div

对于普通的元素 ,他们的作用相同。
比如 
网页上有一个 div 元素:
  <div style="width:200px;height:200px;"></div>
我们可以使用:
  $(function(){
     var width1 = $("div").css("width");
     var width2 = $("div").width();
  })
都可以获取到宽度width。

不过要注意:
.css("width")会带 单位, 例子中 会输出 : 200px ;
.width()则不带单位 , 输出 200 ;

对于非普通元素,只能使用 .width()
如:
我们想获取 window对象的宽度,我们只能使用$(window).width();输出电脑屏幕的宽度;
使用$(window).css("width"); 输出 undifined

width() innerwidth() outerwidth() css('width')的更多相关文章

  1. jQuery中【width(),innerWidth(),outerWidth()】

    这个问题,已经别扭我多年了,今天终于彻底解决了,拿出来庆贺一下.jquery作为开源项目,无论从思路上,还是从严谨性上,让人崇敬. 随着时间的流逝,jquery的一些功能被逐渐挖掘出来.通过jQuer ...

  2. jQuery.width()和jQuery.css('width')的区别

    [TOC] 问题描述 使用jQuery修改一个div的宽度时,发现$($0).width('10rem')总是修改成不正确的值,然后使用$($0).css('width', '10rem')时却能正确 ...

  3. jQuery—一些常见方法(3)【width(),innerWidth(),outerWidth()】

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  4. jQuery height() innerHeight() outerHight() width() innerWidth() outerWidth()源码解读

    在第二层each,传入的对象以height举例是这样的,{padding:innerHeight,content:height,"":outerHeight} 对它遍历调用func ...

  5. jQuery中的width() innerWidth() outerWidth() outerWidth(true)的区别

    width()仅仅包括content(内容) innerWidth()包括content(内容)和padding(补白) outerWidth()包括content(内容),padding(补白)和b ...

  6. jquery width(), innerWidth(), outerWidth() 区别

    #div1 { width: 100px; height: 100px; border: 5px black solid; padding: 10px; margin: 10px; backgroun ...

  7. jquery中innerwidth,outerwidth,outerwidth和width的区别

    在jQuery中,width()方法用于获得元素宽度: innerWidth()方法用于获得包括内边界(padding)的元素宽度, outerWidth()方法用于获得包括内边界(padding)和 ...

  8. JQuery .width()/.css("width")方法 比较

    1. 获取到的值的区别 获取到的为实际宽度,不包括 内边距 和 边框: <div id="aa"> ...... </div> // 1. width() ...

  9. innerWidth outerWidth

    在jQuery中: 一.width()方法用于获得元素宽度: 二.innerWidth()方法用于获得包括内边界(padding)的元素宽度; 三.outerWidth()方法用于获得包括内边界(pa ...

随机推荐

  1. 金蝶K3 破解版

  2. Ewebeditor最新漏洞及漏洞大全

    Ewebeditor最新漏洞及漏洞大全[收集] 来源:转载作者:佚名时间:2009-06-03 00:04:26 下面文章收集转载于网络:) 算是比較全面的ewebeditor编辑器的漏洞收集,如今的 ...

  3. SHGetSpecialFolderLocation

    uses shlobj;function GetDesktopFolder():string;var  pItem: PItemIDList;  temp: array[0..MAX_PATH] of ...

  4. Java ServletContext 详解

    ServletContext, 是一个全局的储存信息的 空间,服务器开始,其就存在,服务器关闭,其才释放.request,一个用户可有多个:session,一个用户一个:而 servletContex ...

  5. Linux lsof命令使用小结

        lsof(list open files)是一个列出当前系统打开文件的工具.在Linux环境下,任何事物都是以文件的形式存在,通过文件不仅可以访问常规数据,还可以访问网络连接和硬件.所以,如传 ...

  6. TCP/IP协议原理与应用笔记12:单播、多播和广播地址(目的地址)

    根据数据接收者的接收范围,将目的地址分为单播.多播.广播. 这里目的地址的划分主要针对的是 物理地址 和 IP地址,没有涉及到端口地址,因为主要针对标识通信节点的地址(物理地址 和 IP地址)而言,和 ...

  7. CSS3——选项卡切换

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  8. scrollLeft,scrollWidth,clientWidth,offsetWidth 可实现导航栏固定不动(冻结)的效果

    HTML精确定位:scrollLeft,scrollWidth,clientWidth,offsetWidth  scrollHeight: 获取对象的滚动高度.  scrollLeft:设置或获取位 ...

  9. Centos 7中 vim 中文乱码

    参考:http://www.myexception.cn/operating-system/1534005.html 一. sudo vim /etc/vimrc 在文件中加入如下几行:      s ...

  10. 301页面转向 php

    新建301.php页面,在程序入口文件index.php引用301.php页面 301.php内容如下,仅用于参考: <?php$the_host = $_SERVER['HTTP_HOST'] ...