精华内容
下载资源
问答
  • 原生js获取元素宽度

    千次阅读 2018-12-13 18:06:56
    var imgWidth = document....//以上为获取元素宽度,但是如果css不是行内样式,则获取不到,那么代码应写为 var imgWidth = document.getElementsByClassName('imgbox')[0].style.offsetWidth; //修改...
    var imgWidth = document.getElementsByClassName('imgbox')[0].style.width;
    
    //以上为获取元素宽度,但是如果css不是行内样式,则获取不到,那么代码应写为
    
    var imgWidth = document.getElementsByClassName('imgbox')[0].style.offsetWidth;
    
    //修改元素的宽的的时候可以直接用
    
    document.getElementsByClassName('imgbox')[0].width = 100 + 'px';

     

    展开全文
  • 原生js 获取页面宽度

    2021-05-26 10:15:32
    function getPageWidth() { var g = document, a = g.body, f = g.documentElement, d = g.compatMode == "BackCompat" ? a : g.documentElement; return Math.max(f.scrollWidth, a.scrollWidth, d....
    function getPageWidth() {
      var g = document,
        a = g.body,
        f = g.documentElement,
        d = g.compatMode == "BackCompat" ? a : g.documentElement;
      return Math.max(f.scrollWidth, a.scrollWidth, d.clientWidth);
    }

     

    展开全文
  • 如何通过js获取Html元素的实际宽度高度发布时间:2020-04-24 15:23:24来源:亿速云阅读:136作者:小新今天小编给大家分享的是如何通过js获取Html元素的实际宽度高度,相信很多人都不太了解,为了让大家更加了解js...

    如何通过js获取Html元素的实际宽度高度

    发布时间:2020-04-24 15:23:24

    来源:亿速云

    阅读:136

    作者:小新

    今天小编给大家分享的是如何通过js获取Html元素的实际宽度高度,相信很多人都不太了解,为了让大家更加了解js获取Html元素的实际宽度高度的方法,所以给大家总结了以下内容,一起往下看吧。一定会有所收获的哦。

    第一种情况就是宽高都写在样式表里,就比如#p1{width:120px;}。这中情况通过#p1.style.width拿不到宽度,而通过#p1.offsetWidth才可以获取到宽度。

    第二种情况就是宽和高是写在行内中,比如style="width:120px;",这中情况通过上述2个方法都能拿到宽度。

    小结,因为id.offsetWidth和id.offsetHeight无视样式写在样式表还是行内,所以我们获取元素宽和高的时候最好用这2个属性。注意如果不是写在行内style中的属性都不能通过id.style.atrr来获取。

    现 在的前端制作很少直接把样式写style里了,都是写在样式表里。如果你要获取的样式没有相对应的(就像#p1.style.width对 应#p1.offsetWidth),就只能分别针对不用浏览器来获取样式表的属性了,可以试着搜索“JS 获取样式属性”之类的。

    代码:var o = document.getElementById("view");

    var h = o.offsetHeight; //高度

    var w = o.offsetWidth; //宽度

    关于如何通过js获取Html元素的实际宽度高度就分享到这里了,希望以上内容可以对大家有一定的参考价值,可以学以致用。如果喜欢本篇文章,不妨把它分享出去让更多的人看到。

    展开全文
  • 本文主要对原生JS获取元素集合的子元素宽度的实现方法进行介绍,代码详细,具有很好的参考价值,需要的朋友一起来看下吧
  • function getPageViewWidth() { var d = document, a = d.compatMode == "BackCompat" ? d.body : d.documentElement; return a.clientWidth; }
    function getPageViewWidth() {
      var d = document,
        a = d.compatMode == "BackCompat" ? d.body : d.documentElement;
      return a.clientWidth;
    }

     

    展开全文
  • 原生JS获取div元素的宽度

    千次阅读 2020-04-06 10:44:13
    最近在做一个进度条组件,需要获取div元素的宽度。例如: <div id="myDiv" style="width: 200px; height: 200px; background-color: gray"> </div> 获取myDiv元素的宽度: var divWidth = ...
  • }后就可以用clientHeight、offsetHeight来获取html了没有设置的时候:设置后的body跟html一样heightfunction getInfo(){var s = "";s += " 网页可见区域宽:"+ document.body.clientWidth;s += " 网页可见区域高:"+...
  • function getScreenWidth() { var smallerSide = Math.min(screen.width, screen.height); var fixViewPortsExperiment = rendererModel.runningExperiments.FixViewport || rendererModel.runningExperiments....
  • 下面本篇文章就来给大家介绍一下使用javascript获得浏览器高度的方法。有一定的参考价值,有需要的朋友可以参考一下,希望对大家有所帮助。在js中,可以使用HTML DOM innerHeight属性来获得浏览器的高度。...
  • Javascript原生获取dom元素宽、高

    千次阅读 2018-12-10 17:57:11
    获取网页窗体方法 &nbsp;&nbsp;&nbsp;&nbsp;网页可见区域宽: document.body.clientWidth &nbsp;&nbsp;&nbsp;&nbsp;网页可见区域高: document.body.clientHeight &nbsp;&...
  • 习惯了用jQuery的css()的方法获取元素的css属性,突然不用jquery了,当要获得元素的css时候,我瞬间停顿了一下,咦?咋获取元素的css值?比如获取元素的width。是这样么?document.getElementById("id").style.width...
  • $('#ele').width(); //盒子content宽度 $('#ele').innerWidth(); //盒子content + padding $('#ele').outerWidth(); //盒子content + padding +...//js $('#ele')[0].offsetWidth //盒子content + padding + border宽度
  • 原生JS兼容所有浏览器获取浏览器高度和宽度,响应式布局 js 获取浏览器高度和宽度值(兼容多浏览器)   var width = window.innerWidth||document.documentElement.clientWidth||document.body.clientWidth; var ...
  • 有些时候,在一个网页的ul li中,存在左右两个部分的内容,但是右边元素内容又是不固定,左边元素相对应的不能用固定宽度,所有需要我们动态的获取右边元素宽度,来赋值给左边元素的marginRight值。 HTML结构: ...
  • 有些时候,在一个网页的ul li中,存在左右两个部分的内容,但是右边元素内容又是不固定,左边元素相对应的不能用固定宽度,所有需要我们动态的获取右边元素宽度,来赋值给左边元素的marginRight值。HTML结构:头像...
  • 支持高版本浏览器、IE9及其以上的 window.innerWidth 支持IE6/7/8 document.documentElement.clientWidth或者document.body.clientWidth 最终使用兼容写法: var w=window.innerWidth || document.documentElement....
  • 这中情况通过#div1.style.width拿不到宽度,而通过#div1.offsetWidth才可以获取宽度。第二种情况就是宽和高是写在行内中,比如style="width:120px;",这中情况通过上述2个方法都能拿到宽度。小结,因为id....
  • JavaScript 中,使用元素的 offsetWidth 和 offsetHeight 属性可以分别获取元素的包含边框的宽度和高度;而 clientWidth 和 clientHeight 属性则可以分别获取元素的不包含边框的宽度和高度。这些属性值包含的内容...
  • 原生 js 如何获取定位

    2020-11-01 20:15:52
    本篇文章作为前面一篇文章(原生js如何获取宽高)的后续,主要分析原生 javascript 获取元素定位的 api 以及一些优化。 JS 定位都有哪些获取方式呢 clientLeft & clientTop offsetLeft & offsetTop ...
  • 原生js获取屏幕高度

    2021-08-18 09:37:49
    原生js获取宽高度 document.body.clientWidth ==> BODY对象宽度 document.body.clientHeight ==> BODY对象高度 document.documentElement.clientWidth ==> 可见区域宽度 document.documentElement....
  • 原生js获取数据 与body相关的属性 //说明:当body没有border、margin的时候,三者的值是一样的 document.body.clientHeight;//获取body的可视区域宽,body的content+padding document.body.offsetHeight;//获取body...
  • 前端web页面中,js可以很方便的获取div元素的高度和宽度,那么这篇文章就说一说原生JS与JQ如何快速的获取DIV元素的高度和宽度的方法。js获取div元素高度与宽度的方法js获取div元素的高度与宽度要用的 clientHeight ...
  • 一、获取元素的行内样式var obj = document.getElementById("test");alert(obj.height + "\n" + obj.width);// 200px 200px typeof=string只是将style属性中的值显示出来二、获取计算后的样式var obj = document....
  • JS 原生获取样式

    2017-03-14 10:36:00
    1.通常使用的获取样式表的方法:element.style; 只能获取内联中得样式表;并且是可以修改;这种经常有在这里不做赘述。 2.getComputedStyle可获取指定元素所有的样式【外联, 内嵌, 内联】; getComputedStyle是...
  • 原生js获取 var box = document.getElementById("box"); box.clientWidth; //获取该元素宽度包含padding值 box.clientHeight; //获取该元素高度包含padding值 box.offsetWidth; //获取该元素宽度+padding +border ...

空空如也

空空如也

1 2 3 4 5 ... 20
收藏数 12,673
精华内容 5,069
关键字:

js原生获取宽度