如何计算HTML元素内容的可见高度和宽度?

问题描述 投票:0回答:1

我正在使用操纵up来获取我所构建的应用程序中的内容截图。我的大多数代码都在工作,但是我有两种情况,结果与预期不符。我可以使用元素上的getBoundingClientRect()成功地指示伪造者对具有定义的css高度和宽度的元素进行屏幕抓取,但是在没有定义高度/宽度的情况下,我想知道在技术上是否可以获取基于内部元素的高度和宽度的元素的高度和宽度。

例如(或者我可能遇到的最可能的情况),我可能有一段内容,其中主体没有设置样式参数,但是内部内容有高度。它可能不是第一个子元素,但它甚至可能是该子元素的子元素。

我已经使用get getBoundingClientRect()和offsetHeight进行了探索,但没有成功。

是否有一种方法可以让我获得计算出的元素的高度/宽度?

var body = document.querySelector('body');

console.log(body.clientHeight);
console.log(body.style.height);
console.log(body.getClientRects());
console.log(body.getBoundingClientRect());
#container {
  height:200px;
  width:200px;
  background-color:blue;
  border:1px solid black;
  color: white;
  text-align: center;
}
<body>
  <div id="container">
    HELLO 
  </div>
</body>
javascript html css puppeteer
1个回答
© www.soinside.com 2019 - 2024. All rights reserved.