详解 $().css('width')和$().width()的区别

　　在本次项目开发中，经常用jquery获取高度和宽度并且动态加载，有时候用$().css('width')或$().width()这两个方法获取宽度并设置，但是有时候出现获取不到的情况，查阅资料后发现他俩之间即相同又不同。
　　概念：
　　 1.$().css()
　　　在w3c jQuery的文档中，$().css()方法设置或返回被选元素的一个或多个样式属性。$().css()在设置多个属性时，可以采用对象的形式，但值是字符串的形式(我都经常忽略而出问题)。

　　　2.$().width()
　　 width()函数用于设置或返回当前匹配元素的宽度。返回第一个匹配元素的宽度。如果不为该方法设置参数，则返回以像素计的匹配元素的宽度。

　　区别：

　　　　1.$().css()返回的值带单位，而$().width()不带单位。

<body>

    <div style="width:200px;background:red;height:200px">获取该标签的宽度</div>

    <script src="jquery.min.js"></script>

    <script>

    $(function(){

        console.log($('div').css('width'));

        console.log($('div').width())

    })

    </script>

</body>

结果如下：注意颜色，通过typeof检测，说明了前者是字符串，后者是数字

　　　　2.$().css()在window,document这些元素对象中获取不到该值，为undefined。而$().width()可以获取该值。后者的适用范围程度>前者。

<body>

    <div style="width:200px;background:red;height:200px">获取该标签的宽度</div>

    <script src="jquery.min.js"></script>

    <script>

    $(function(){

        console.log($('window').css('width'));

        console.log($(window).width())

    })

    </script>

</body>

结果如下：为什么$().css()中选择器中是双引号，而$().width()不是，这应该是语法问题，window是个变量，加上引号就代表是常量。

　另外：$().width()，在jquery版本为1.4.1后支持参数为函数的形式。

详解 $().css('width')和$().width()的区别的更多相关文章

CSS width：100%和width：auto的区别
width:100%和width:auto的区别 width:auto比较聪明,如果margin已经左右占去10px的空间,那么width给的值就是580px. <style> div{ ...
canvas里设置width和css里设置width和js里设置width的区别
canvas.width 和它的style.width是不一样的: canvas是个画布,有他自己的宽和高(默认是没有单位的纯数字),就是canvas.width和canvas.height的宽和高 ...
css Media Query详解
Media Queries详解 Media Queries直译过来就是“媒体查询”,在我们平时的Web页面中head部分常看到这样的一段代码: 1 <link href="css/re ...
[转]CSS hack大全&详解
转自:CSS hack大全&详解 1.什么是CSS hack? CSS hack是通过在CSS样式中加入一些特殊的符号,让不同的浏览器识别不同的符号(什么样的浏览器识别什么样的符号是有标准的, ...
css样式之background详解
background用法详解: 1.background-color 属性设置元素的背景颜色可能的值 color_name 规定颜色值为颜色名称的背景颜色(比如 red) he ...
1:CSS中一些@规则的用法小结 2: @media用法详解
第一篇文章:@用法小结第二篇文章:@media用法第一篇文章:@用法小结这篇文章主要介绍了CSS中一些@规则的用法小结,是CSS入门学习中的基础知识,需要的朋友可以参考下 at-rule ...
vi和vim区别及命令详解
vi和vim都是Linux中的编辑器,不同的是vim比较高级,可以视为vi的升级版本.vi使用于文本编辑,但是vim更适用于coding. 现将vim的命令行收集于下: vi有3个模式:插入模 ...
css中的width,height，属性与盒模型的关系
这段话很容易记住盒模型: css中盒子模型包含属性margin.border.padding.content,他们可以把它转移到我们日常生活中的盒子(箱子)上来理解,日常生活中所见的盒子也具有这些属 ...
jQuery+css+div--一些细节详解
(一).首先.让我们认识一下最基本普通的alert()弹出框!(改变alert()提示弹出框的样式) 我们在写html或是jsp页面的时候,谁都不希望自己精心设计,且非常美观的页面颜色布局被破坏掉吧! ...

随机推荐

Oracle SQL*Plus 数据备份为 sql 文件
在某些比较严格的环境中,不提供像PL/SQL Developer 这样的工具供我们备份表数据时,使用SQL*Plus运行如下脚本内容导出数据. 1, 执行时登录SQL*Plus, 命令 @D: ...
SimpleRpc-系统边界以及整体架构
系统边界什么是系统边界?系统边界就是在系统设计之初,对系统所要实现的功能进行界定,不乱添加,不多添加.这么做的好处就是,系统简单明了,主旨明确,方便开发和用户使用.举个例子,一个自动售货机的本职工作 ...
你的专属定制——JQuery自定义插件
前言絮叨絮叨 jQuery是一个快速.简洁的JavaScript框架,是继Prototype之后又一个优秀的JavaScript代码库(或JavaScript框架).jQuery设计的宗 ...
简易RPC框架-私有协议栈
*:first-child { margin-top: 0 !important; } body > *:last-child { margin-bottom: 0 !important; } ...
STM32获取DHT11温度传感器数据
准备物件 STM32F103C8T6核心板 ST-LINK V2 DHT11 杜邦线若干连接线 STM32F103C8T6芯片管脚图管脚说明连接仿真器 STM32 ST-LINKV2 VCC V ...
调用惯例Calling Convention （或者说：调用约定）
调用惯例影响执行效率,参数的传递方式以及栈清除的方式. 调用惯例参数传递顺序谁负责清除参数参数是否使用暂存器 register 从左到右被调用者是 pascal 从左到右被调用者否 ...
MySQL or MariaDB 错误解决方法之报错代码1045
phpMyAdmin登录报错:mysqli_real_connect(): (28000/1045): Access denied for user 'root'@'localhost' (using ...
手动添加 Git bash 到鼠标右键
由于不知原因,右键没有了Git Bash Here,没有这个右键菜单导致获取Git仓库中的代码很不方便,所以决定通过注册表的方式将这个菜单加出来. 1.win + R,输入"regedit& ...
python之HTMLParser解析HTML文档
HTMLParser是Python自带的模块,使用简单,能够很容易的实现HTML文件的分析.本文主要简单讲一下HTMLParser的用法. 使用时需要定义一个从类HTMLParser继承的类,重定义函 ...

详解 $().css('width')和$().width()的区别

详解 $().css('width')和$().width()的区别的更多相关文章

随机推荐

热门专题