不多说,用一图足以说明

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

  非普通元素是指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. [MODx] 8. Snippet get data, chunk display

    Simple Example: Lets process this chunk and output its value. We have this Chunk, called "Welco ...

  2. android学习日记03--常用控件checkbox/radiobutton

    常用控件3.checkbox 复选框,确定是否勾选,点击一下勾选,点击第二下取消,当有一系列备选项时适合用checkbox控件,方便用户提交数据. 贴上例子Activity的java代码 packag ...

  3. C#_delegate - 调用列表 计算阶乘

    using System; using System.Collections.Generic; using System.Linq; using System.Text; namespace Dele ...

  4. VS2012 编译GDAL

    先安装VS 2012, 然后下载GDAL最新版本代码,解压. 用管理员权限打开Developer Command Prompt for VS2012终端,进入代码目录. 然后运行命令: nmake / ...

  5. Asp.Net 之 当前上下文中不存在名称" Server "

    在开发中经常用到应用程序的物理路径,在获取应用程序中文件的物理路径时最常用: string path = Server.MapPath("Document/example.doc" ...

  6. oracle学习总结3

    1:ddl语句创建一张学生表 create table stu(id number(6) not null,name varchar2(20),age number(3),gender char(1) ...

  7. Nim游戏(组合游戏Combinatorial Games)

    http://baike.baidu.com/view/1101962.htm?fr=aladdin Nim游戏是博弈论中最经典的模型(之一),它又有着十分简单的规则和无比优美的结论 Nim游戏是组合 ...

  8. unique函数 (STL)

    转自http://www.cnblogs.com/heyonggang/archive/2013/08/07/3243477.html 类属性算法unique的作用是从输入序列中“删除”所有相邻的重复 ...

  9. Css字体中英文对照表

    css字体中文.英文.Unicode名对照表 另外注意:繁体中文字体名,在简体中文系统中是不能被识别的. 中文名 英文名 Unicode Unicode 2 Mac OS 华文细黑 STHeiti L ...

  10. 【Objective-C】3 -self关键字

    一.Java中的this只能用在动态方法中,不能用在静态方法中 1.在动态方法中使用this关键字 1 public class Student { 2 private int age; 3 publ ...