Question

我有一个非常简单的网页，可以将服务器中的数据作为容器加载到s中。问题是有时图像太高，溢出并导致布局问题。因此，我一直在使用以下方法来调整div的大小：

target.style.height = height; // As short form of:
document.getElementById('someId').style.height=height;

但是到目前为止，我没有尝试过。这是html文件：

    <!DOCTYPE html>
    <html>
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    </head>
    <body bgcolor="#E3FBFF" text="#000000" onload="loadImages();">
      <script type = "text/javascript">
        function loadImages()
        {
          ...Function omitted for brevity...
          But it gets to this line:
          document.getElementById(d0).style.height = height+10;
        }
  </script>
    <div id=d0></div>
    <hr>
    <div id=d1></div>
    <hr>
    <div id=d2></div>
    <hr>
    <div id=d3></div>
    <hr>
    </body>
    </html>

就是这样！

我发现了各种文章like this one或this one，但是它们没有帮助。

我想到要提到的是，就我而言，我本身并不需要使用div。我只需要图像和相关文本不垂直（或水平）重叠即可。照原样，当图像加载时，它可能是一团糟。 ...我如何告诉我的div是全宽度，而其他div没有覆盖？我尝试使用一个类，使用CSS等，都被忽略了。

我想我是在一个不正确的假设下工作的，即divs作为面向块的东西，即使您声明全宽（“ width = 100％”）也可以并且仍然会垂直重叠，具体取决于放置在其中的内容。

Answer 1

将单位添加到height变量中。在编辑元素的CSS样式时，这是必需的。参见：MDN

document.getElementById('someId').style.height=height变为： document.getElementById('someId').style.height = height.toString() + 'px'

Answer 2

您没有显示您为“高度”分配的内容，但是从您的代码中，我认为它是整数。

document.getElementById(d0).style.height = height+10;

样式需要一个字符串（即10px），因此无法为其分配数字，请尝试以下操作

document.getElementById(d0).style.height = height+10+'px';

javascript将为您将其转换为字符串
有关整数的更多信息，请在这里What's the best way to convert a number to a string in JavaScript?

div的大小调整被忽略

2 个答案: