Object: html insert占用太多高度

Question

我正在为我编写的 JavaScript 星图程序开发一个相当简单的 HTML 页面，运行遇到了一些麻烦。因为我希望每个页面的顶部都相同，所以我想我可以为页面的那部分编写一个 html 文件并将其插入到各个页面中。我使用 <object> 来做到这一点，它基本上可以工作，但在页面中占用了很多 space（我在对象周围添加了一个红色边框以清楚地显示这一点）：

code result

我的页面代码是：

<html>
<body>
  <object data="drawthestars-header.html" style="border: 1px solid red;">
    error loading file
  </object>
  <p><b>Draw a star?</b></p>
  <table>
    <tr>
      <td>Points: </td>
      <td><input type="text" value="15" id="deg" size="3" maxLength="3"></td>
    </tr>
    <tr>
      <td><label>Jump: </label></td>
      <td><input type="text" value="6" id="jump" size="3" maxLength="3"></td>
    </tr>
    <tr>
      <td><button id="redraw" onclick="addStar()">Draw</button></td>
      <td><button id="clear" onclick="clearAll()">Clear</button>
    </tr>
  </table>
  <br />

  <div id="stars"></div>

  <script src="drawthestars.js"></script>
</body>
</html>

drawthestars-header.html，插入的代码就是：

<a href="#">link???</a>

有人可以指出这里出了什么问题吗？

Answer 1

这将是默认的 IFrame 元素大小，对象元素实际上在幕后。

Default width/height of an IFrame

您应该设置对象元素的宽度和高度来更改它。

Object: html insert占用太多高度

Object: html insert takes up too much height

html

spacing