Javascript 检测Div的可见宽度

这是一个通用的编程问题（它还没有特定的用途/应用程序）

如果我在HTML中创建一个标记（比如img、a或div），但不定义其宽度或使用百分比宽度（即

width:50%

），我将如何使用javascript查找它显示的实际宽度（以像素为单位）？我也更喜欢交叉划船，但这不是我主要关心的

我的意思是，我知道如果它是像div这样的块元素，它将需要

100%

，但是我如何找到

100%

是什么呢？我是否只需要爬上节点树，直到找到一个具有定义宽度的父节点，然后根据它进行计算

---

我知道

clientWidth

和

clientHeight

，但它们都不是crossbrowser或w3批准的…

请查看jQuery API中的函数。这绝对是跨浏览器的，以像素为单位返回宽度（有关详细信息，请参阅）。

请查看jQuery API中的函数。这绝对是跨浏览器的，以像素为单位返回宽度（有关详细信息，请参阅）。

一个可能的解决方案是使用原型方法

Element.prototype.getElementWidth = function() {
    if (typeof this.clip !== "undefined") {
          return this.clip.width;
    } else {
      if (this.style.pixelWidth) {
          return this.style.pixelWidth;
      } else {
             return this.offsetWidth;
      }
    }
};

---

一个可能的解决方案是使用原型方法

Element.prototype.getElementWidth = function() {
    if (typeof this.clip !== "undefined") {
          return this.clip.width;
    } else {
      if (this.style.pixelWidth) {
          return this.style.pixelWidth;
      } else {
             return this.offsetWidth;
      }
    }
};

---

如果使用百分比，则在查询时将返回百分比。听起来好像你在试图从一个百分比值（即50%）中得到一个静态值（即450px）。除非您运行一些数学运算（找到容器宽度的静态值并使用百分比进行计算），否则无法真正做到这一点。如果使用百分比，则在查询时将返回百分比。听起来好像你在试图从一个百分比值（即50%）中得到一个静态值（即450px）。除非你运行一些数学运算（找到容器宽度的静态值并用百分比进行计算），否则你无法真正做到这一点。非常感谢我所需要的，但是如果我不想使用jQuery，还有其他选择吗？@Tomas什么是你可以接受的：原始JavaScript（无框架）或其他框架（如MooTools）？是的，我想你可以重写这个函数来避免实现整个框架。正如我所说的，这个函数现在还不能应用到任何东西上。但我正在考虑是否可以在原始JS中实现这一点，以避免仅为.width（）导入整个框架。非常感谢我所需要的，但如果我不想使用jQuery，是否有其他替代方法？@Tomas您可以接受的方法：原始JavaScript（无框架）或其他框架（如MooTools）？是的，我想你可以重写这个函数来避免实现整个框架。正如我所说的，这个函数现在还不能应用到任何东西上。但我正在考虑是否可以在原始JS中这样做，以避免为just导入整个框架。width（）不要覆盖默认原型。这是错误的做法。不要覆盖默认原型。这是个坏习惯。