如何使用原始JavaScript查找div的宽度？

如何在不使用类似jQuery的库的情况下以跨浏览器兼容的方式查找<div>的当前宽度？

Answer 1

 document.getElementById("mydiv").offsetWidth 

• element.offsetWidth（MDC）

Answer 2

您可以使用clientWidth或offsetWidth Mozilla开发人员networking参考

这将是：

 document.getElementById("yourDiv").clientWidth; // returns number, like 728 

要么

 document.getElementById("yourDiv").offsetWidth; 

Answer 3

所有答案是正确的，但我仍然想给一些其他的替代品，可能工作。

如果您正在查找分配的宽度（忽略填充，边距等），您可以使用。

 getComputedStyle(element).width; //returns value in px like "727.7px" 

getComputedStyle允许您访问该元素的所有样式。 例如：padding，paddingLeft，margin，border-top-left-radius等等。

Answer 4

您也可以使用ClassNamesearchDOM。 例如：

 document.getElementsByClassName("myDiv") 

这将返回一个数组。 如果有一个你感兴趣的特定财产。例如：

 var divWidth = document.getElementsByClassName("myDiv")[0].clientWidth; 

现在divWidth将等于div数组中第一个元素的宽度。

Answer 5

其实，你不必使用document.getElementById("mydiv") 。
你可以简单地使用div的id，如：

var w = mydiv.clientWidth;
要么
var w = mydiv.offsetWidth;
等等

Answer 6

在div或body标签上调用下面的方法onclick =“show（event）;” function表演（事件）{

  var x = event.clientX; var y = event.clientY; var ele = document.getElementById("tt"); var width = ele.offsetWidth; var height = ele.offsetHeight; var half=(width/2); if(x>half) { // alert('right click'); gallery.next(); } else { // alert('left click'); gallery.prev(); } }