如何阻止所谓不可见的 javascript 占用空间？

Question

我不太擅长编程，但我做了一些研究，发现这一小串 javascript 可以让我们在点击每个 javascript 链接按钮时立即在页面上播放声音：

<embed src=reset.wav autostart=false width=0 height=0 id=sound7 enablejavascript=true>

问题是，当我放入其中的几个时线来定义不同的声音，它们开始占用页面上的空间。我已将它们全部移至代码的最底部，紧接在结束所有主要内容的 div 关闭之后以及正文关闭之前（见下文）。通过这种方式，它们不会弄乱元素的位置，但仍然会在其他所有内容下方造成空白，这是令人沮丧的，因为它使滚动条不必要地出现。

</div>
<embed src=reset.wav autostart=false width=0 height=0 id=sound7 enablejavascript=true>
<embed src=reset2.wav autostart=false width=0 height=0 id=sound8 enablejavascript=true>
</body>
</html>

我已经看到了一些关于如何不使用visibility=hidden 和使用display=none 的答案，但我不确定如何将它们应用到这串代码，因为我对此很陌生。我需要更改此字符串的哪些部分或在何处添加代码的其他部分的示例将非常感激。

- - - - - - - - - 更新 - - - - - - - - - - - - - - - - ----

由于某种原因，Microsoft Word（是的，我承认这就是我正在使用的）不允许我在这些嵌入周围插入任何样式或 div 来应用“显示：无”。也许我只是对自己在做什么还不够了解，但即使当我使用以下代码成功地将“display：none”应用到每个嵌入时，即使空白被有效删除，声音也会停止播放：

<embed style='display:none' src=reset.wav ....>

然后我意识到另一个解决方案。我在这个页面上堆叠了许多元素，并且认为如果不可见的声音代码条目要占用空间，它们可以只重叠元素，这样就不会移动或添加任何内容，并且由于它们没有视觉方面，因此它们不会覆盖任何内容。我研究了重叠的工作原理并应用了它，它正在起作用！

<embed style='position:absolute;z-index:1' src=reset.wav autostart=true
width=0 height=0 id=sound1 enablejavascript=true>

Answer 1

需要明确的是，您发布的内容是 HTML，而不是 JavaScript。这不是管理页面中声音的最佳方法，但是，假设您想保留此方法：

如果它们正在显示或导致布局问题，最简单的方法是将它们包装在 的 div 中显示：无。

<div style="display:none;">
    <embed...>
    <embed...>
    <embed...>
</div>

一种“更干净”的方法是向所有这些嵌入添加一个公共类，然后为它们设置一个公共 CSS 规则：

<embed class="mysounds" ... >

<style>
     embed.mysounds { display:none; }
</style>

Answer 2

如果您正在谈论页面上的物理屏幕空间，那么您可以将它们放入 div 中并强制其变得非常小：

<div id="sounds" style="display: none;">
<embed src=reset.wav autostart=false width=0 height=0 id=sound7 enablejavascript=true>
<embed src=reset2.wav autostart=false width=0 height=0 id=sound8 enablejavascript=true>
</div>

如果由于某种原因这不起作用（某些内容（例如 Adob​​e flash）无法加载如果它是隐藏的），那么你可以尝试将每一个都变小，如下所示：

<div id="sounds">
<embed style="height: 1px" src=reset.wav autostart=false width=0 height=0 id=sound7 enablejavascript=true>
<embed style="height: 1px" src=reset2.wav autostart=false width=0 height=0 id=sound8 enablejavascript=true>
</div>