使用jquery的.width()方法获取一个元素的当前宽度，不管元素是否设置了宽度，css样式时内联 外联或者是内嵌，都可以使用

这个方法获取元素的宽度。

使用原生js style.width .width取不到值

1 元素没有设置宽度值

2 元素设置了宽度指，但是是内联或者外联样式表中，并非内嵌式的

这种方法虽然取不到宽高值，但是可以通过这个方式来设置值

可以通过offsetWidth offsetHeight来获取元素的宽高值

所以，jquery的width()与js的offsetWidth都可以获取元素的宽度，但有个区别：

.width()的值单纯是内容区域的宽度、不包括内外补丁和border。ie6+和chrome相同。
offsetWidth ：包括了内补丁和border，不包括外补丁。ie6+和chrome相同

js的style.width取不到元素的宽度值的更多相关文章

  1. js的 style.width 取不到元素的宽度值

    以前一直用jquery的.width()方法来获取一个元素的当前的宽度.不管该元素是否设置了宽度,CSS样式是内联.外联or内嵌,都可用此方式获得元素当前的宽度. 今天想用原生JS想获取一个元素宽度时 ...

  2. JS获取display为none的隐藏元素的宽度和高度的解决方案

    有时候,我们一进入页面,就需要获取display为none元素的物理尺寸(宽高),或获取display为none元素的子元素的物理尺寸(宽高),本篇文章就如何解决以上问题给出自己的解决方案 <h ...

  3. canvas里设置width和css里设置width和js里设置width的区别

    canvas.width 和 它的style.width是不一样的: canvas是个画布,有他自己的宽和高(默认是没有单位的纯数字),就是canvas.width和canvas.height的宽和高 ...

  4. style.width与offsetWidth的区别

    1. style.width只能读取内联样式,offsetWidth都可以读取: 2. style.width读取的值带“px”单位,offsetWidth读取纯数值: 3. style.width获 ...

  5. 一个元素的宽度 及带padding，border，margin的各自情况

    width() - 设置或返回元素的宽度 height() - 设置或返回元素的高度 innerWidth() - 返回元素的宽度(包含 padding) innerHeight() - 返回元素的高 ...

  6. js null表示没有取到html中的元素 undenfind 表示没有被赋值

    js null表示没有取到html中的元素 undenfind 表示没有被赋值

  7. js 元素高度宽度整理

    1.1只读属性 所谓的只读属性指的是DOM节点的固有属性,该属性只能通过js去获取而不能通过js去设置,而且获取的值是只有数字并不带单位的(px,em等),如下: 1)clientWidth和clie ...

  8. 关于chart.js 设置canvas的宽度为父级元素的宽度的百分百 以及 X轴上面刻度数据太多如何处理

    今天在做一个数据统计的界面的时候,需要做折线统计图,在网上找了一圈发现数据统计的插件还是不少的,本着轻量级的的原则选择了Chart.js,后来在做的过程中便遇到两个问题,以此记录下来,和刚刚接触前端的 ...

  9. js中style的属性

    下面这些属性都是通过js的style来设置css.只是整理了一部分,详细的可以参考相应的学习网站,不好的地方欢迎大家拍砖. alignContent :"" 属性在弹性容器内的各项 ...

随机推荐

  1. TPA测试项目管理系统-测试用例管理

            Test Project Administrator(简称TPA)是经纬恒润自主研发的一款专业的测试项目管理工具,目前已广泛的应用于国内二十余个整车厂和零部件供应商.它可以管理测试过程 ...

  2. python怎么连接MongoDB数据库

    Python 要连接 MongoDB 需要 MongoDB 驱动,这里我们使用 PyMongo 驱动来连接. pip 安装: pip3 install pymongo 引入库: import pymo ...

  3. 路由器安全——破解wifi密码，同时中间人攻击

    聊聊安全那些事儿 篇一:Wi-Fi安全浅析 2016-04-25 13:18:16 141点赞 712收藏 63评论 前言 近期,Wi-Fi相关的安全话题充斥着电视新闻的大屏幕,先是曝出了路由器劫持的 ...

  4. SpringBoot集成MyBatis的Bean配置方式

    SpringBoot集成MyBatis的Bean配置方式 SpringBoot是一款轻量级开发的框架,简化了很多原先的xml文件配置方式,接下来就介绍一下如何不适用XML来配置Mybatis spri ...

  5. 使用Apache commons-maths3-3.6.1.jar包实现快速傅里叶变换（java）

    本例应用的是快速傅里叶变换 (fast Fourier transform),即利用计算机计算离散傅里叶变换(DFT)的高效.快速计算方法的统称,简称FFT.快速傅里叶变换是1965年由J.W.库利和 ...

  6. JAVA添加WORD文档批注

    本文将介绍在Java程序中如何给Word文档中的指定字符串添加批注.前文中,主要介绍的是针对某个段落来添加批注,以及回复.编辑.删除批注的方法,如果需要针对特定关键词或指定字符串来设置批注,可以参考本 ...

  7. B-树，B+树，B*树总结

    链接地址:https://blog.csdn.net/v_JULY_v/article/details/6530142 B+树 B+ 树是一种树数据结构,是一个n叉树,每个节点通常有多个孩子,一棵B+ ...

  8. php正则表达示的定界符

    在学习正则表达示前,我们先要来学习正则表达示的定界符. 定界符,就是定一个边界,边界已内的就是正则表达示. PHP的正则表达示定界符的规定如下: 定界符,不能用a-zA-Z0-9\ 其他的都可以用.必 ...

  9. CF1237E 【Balanced Binary Search Trees】

    首先我们要注意到一个性质:由于根与右子树的根奇偶性相同,那么根的奇偶性与\(N\)相同 然后我们发现对于一个完美树,他的左右两个儿子都是完美树 也就是说,一颗完美树是由两棵完美树拼成的 注意到另一个性 ...

  10. python基础代码

    from heapq import *; from collections import *; import random as rd; import operator as op; import r ...