使用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. Rendering in UE4

    Intro Thinking performance. Identify the target framerate, aim your approach on hitting that target ...

  2. MySQL:主键、外键、索引(一)

    干货: 主键是关系表中记录的唯一标识.主键的选取非常重要:主键不要带有业务含义,而应该使用BIGINT自增或者GUID类型.主键也不应该允许NULL.可以使用多个列作为联合主键,但联合主键并不常用. ...

  3. git免密

    免账号密码输入 git clone https://lichuanfa%40gitcloud.com.cn:lcf13870752164@git.c.citic/Citic-Data/bigdata_ ...

  4. mysql 查询今天,昨天,上个月sql语句

    今天 select * from 表名 where to_days(时间字段名) = to_days(now()); 昨天Select * FROM 表名 Where TO_DAYS( NOW( ) ...

  5. tf.logging.set_verbosity

    tf.logging.set_verbosity (tf.logging.INFO) 作用:将 TensorFlow 日志信息输出到屏幕

  6. ESP8266 tcp透传AP+STA

    AP 建立WIFI,接受STA连接,串口数据和TCP互传 #include <ESP8266WiFi.h> const char *ssid = "esp8266_666&quo ...

  7. [Flutter + Firebase] Enable Firebase for Flutter

    Anroid Firebase Project setup: 1. In firebase console, cerate a Android app setup you can find in co ...

  8. Linux grep 查找字符所在文件(grep详解)

    查找字符所在文件 grep -ir "S_ROLE"  ./* -i 不区分大小写 -r 查找字符出处 -a   --text   #不要忽略二进制的数据. -A<显示行数& ...

  9. rpmlint 方便的rpm spec 以及rpm 文件检查工具

    rpmlint 可以方便的让我们检查rpm spec 的信息,给予我们提示以及改进,同时也支持对于rpm 文件处理 安装 yum install -y rpmlint 使用 spec 检查 rpmli ...

  10. If...else 条件判断和If else嵌套

    If(条件表达式){ 如果条件表达式结果为true,执行该处代码. 如果条件表达式结果为false,执行下边代码. }else{ 如果条件表达式结果为false,执行该处代码. } If(条件表达式) ...