Question

我有一个DIV我想根据窗口大小调整其大小。所以我有一个javascript方法返回要应用的新闻。但我不知道如何在不必等待页面加载结束的情况下将该大小定义为div。

我的意思是，我在页面上有一些长的加载对象，所以如果我使用window.onload方式设置大小，我在开始时有一个大小不好的div，然后当页面加载时， div调整大小。 Baaad正在寻找。

我想在显示页面后立即设置该大小，例如：

<div id="myid" style="width:myjavascript_Getcorrectsize();">

我该怎么做？

Answer 1

您不必等待window load事件，甚至是某些图书馆提供的“就绪”事件。只需将您的脚本块放在有问题的div之后，您就可以通过DOM访问div来设置其大小。 E.g：

<body>
  <div id="target">This is the target, JavaScript makes it 100px wide</div>
  <script>
    (function() {
      var elm = document.getElementById("target");

      elm.style.width = "100px";
    })();
  </script>
</body>

Live demo

参考文献：

那就是说，如果你可以通过CSS设置大小，你会更好。但我希望你已经发现由于某些原因你不能那样做。

Answer 2

最简单的方法是在文档末尾插入<script>块，然后执行所需的代码：

...
<script>
(function(){ //<-- This part is optional, but recommended if you don't want
             // to leak variables to the global scope
    document.getElementById("myid").style.width = myjavascript_Getcorrectsize();
})();
</script>
</body>

如果您希望元素具有特定的相对宽度，您还可以使用相对单位而不是JavaScript：

<div id="myid" style="width:50%">

Javascript - 设置DIV大小而无需等待页面加载结束

2 个答案: