Question

没关系，我用oldschool方式计算元素。

我在主div里面有几个div。现在顶部的div有一个设定的宽度，但由于其中的内容，它的内部宽度不同。所以如果我没弄错的话，我需要innerWidth。无论如何，在这种情况下，它需要产生600的宽度。

我不是使用jquery而是使用jqui，所以我想在javascript单独看jqui没有内/外宽度功能。这确实意味着我有一个$选择器可以玩。

<style>
  .holder {
    width:100%; /* which in this case is 320px */
    overflow-x: auto;
    overflow-y:hidden;
  }

  .menu_item {
    width:200px;
    float:left;
  }
</style>

<div class="holder" onscroll="get_width(this)">
  <div class="menu_item">
    item1
  </div>
  <div class="menu_item">
    item2
  </div>
  <div class="menu_item">
    item3
  </div>
</div>

get_width(that) {
  alert(that.innerWidth); // returns undefined
  alert(that.width); // returns undefined
}

http://jsfiddle.net/TSQs7/2/

Answer 1

我相信你要找的是element.offsetWidth

Answer 2

要获得宽度和高度，请分别使用clientWidth和clientHeight。

element.clientWidth

<强>更新

即使在旧的ie6

中也支持

clientWidth

查看所有平台支持：

platforms support reference

有关不同宽度相关属性的更多深入信息，请查看这篇精彩文章：

understanding offsetwidth clientwidth scrollwidth and height respectively

注意：

此属性将值舍入为整数。如果你需要一个小数值，使用element.getBoundingClientRect（）。

clientWidth MDN

Fiddle Demo

获取没有jquery的元素的宽度

2 个答案: