想象一下:您向页面发出一个 get 请求,然后您收到它的 HTML 作为响应,就像浏览器一样。
如果不渲染它,您如何使用该 HTML 字符串并以编程方式计算页面中元素的 x、y 宽度和高度属性?
我可以在隐藏窗口中使用某个库模拟渲染,还是可以在 js 中模拟一个窗口,模拟其渲染并使用常规方法来查找这些值?
您可以做的是将元素呈现在body
. 确保将背景颜色应用于此处html
提到的元素。一旦您将元素呈现在用户看不到的地方,您就可以获取所需的所有内容。
$(document).ready(function() {
console.log("Width: " + $("#child").css("width"));
console.log("Height: " + $("#child").css("height"));
console.log("Left: " + $("#child").css("left"));
console.log("Top: " + $("#child").css("top"));
});
html {
background-color: white;
}
body {
background: #dadada;
height: 100vh;
}
#child {
width: 100px;
height: 100px;
background: yellow;
position: relative;
left: 65px;
top: 50px;
z-index: -1;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="child">This should be hidden</div>
本文收集自互联网,转载请注明来源。
如有侵权,请联系[email protected] 删除。
我来说两句