获取元素的内容宽度

Question

offsetWidth对我来说不够好,因为这包括填充和边框宽度.我想找出元素的内容宽度.是否有一个属性,或者我必须采取offsetWidth然后从计算的样式中减去填充和边框宽度？

Answer 1

由于这是在谷歌搜索时首先出现的，但是还没有合适的答案，因此，这里是一个：

function getContentWidth (element) {
  var styles = getComputedStyle(element)

  return element.clientWidth
    - parseFloat(styles.paddingLeft)
    - parseFloat(styles.paddingRight)
}

基本上，我们首先获得元素的宽度，包括填充（clientWidth），然后左右减去填充。我们需要parseFloat填充，因为它们以- px后缀字符串形式出现。

我已经在CodePen上为此创建了一个小操场，看看吧！

Answer 2

我建议要么scrollWidth要么clientWidth取决于您是否想要考虑滚动条。

查看确定元素的尺寸或规范本身。