为什么仅仅因为我设置了“clientWidth”函数就显示了不同的“setInterval”值？
为什么仅仅因为我设置了“clientWidth”函数就显示了不同的“setInterval”值？
提问于 2016-01-03 12:45:52
我试着得到clientWidth值来知道身体的宽度。但我发现了一个问题：
以下是原始代码：
<input type="text" id="width"><br/>
<input type="text" id="height">
<script>
function getScreenSize(){
document.getElementById("width").value= document.body.clientWidth;
document.getElementById("height").value= document.body.clientHeight;
}
getScreenSize();
</script>
<div style="margin-top: 5300px;">foot</div>当我只将getScreenSize();转换为setInterval("getScreenSize()",10);时，如下所示：
<input type="text" id="width"><br/>
<input type="text" id="height">
<script>
function getScreenSize(){
document.getElementById("width").value= document.body.clientWidth;
document.getElementById("height").value= document.body.clientHeight;
}
setInterval("getScreenSize()",10);
</script>
<div style="margin-top: 5300px;">foot</div>没有任何原因，clientWidth的值发生了变化。
有人知道为什么我设置了setInterval函数就改变了它吗？
回答 2
Stack Overflow用户
回答已采纳
发布于 2016-01-03 12:54:19
这是因为没有setInterval，您的script会在添加底部的div之前运行。
因此，当浏览器读取页面时，它运行脚本，然后添加底部div，在运行时，宽度和高度不考虑div。有了setInterval，它就能解释那个div。
将脚本移到底部将显示来自两种方式的相同响应。
<input type="text" id="width"><br/>
<input type="text" id="height">
<div style="margin-top: 5300px;">foot</div>
<script>
function getScreenSize(){
document.getElementById("width").value= document.body.clientWidth;
document.getElementById("height").value= document.body.clientHeight;
}
getScreenSize();
</script>Stack Overflow用户
发布于 2016-01-03 12:53:41
您的脚本很可能在页面完全呈现之前运行，因此页面的大小实际上可以更改。您需要确保代码在DOM (Document )完成后运行(更多信息请参见window.onload vs $(document).ready() )。
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/34576663
复制相关文章
相似问题
腾讯云开发者
