javascript - 使用 JavaScript 包含文件

Question

我需要包含一个始终使屏幕浏览器大于或等于 699px 的文件，为此我尝试使用以下脚本:

<script type="text/javascript">
<!--
if (screen.width >= 699) {
document.write (" <!--#include virtual="/menu.asp"-->");
}
//-->
</script>

但它什么也没做。有谁知道如何让它工作吗？

致以诚挚的问候。

Answer 1

include 指令需要成为页面的一部分在到达网络浏览器之前，并且由于 JavaScript 在网络浏览器中执行，所以已经太晚了为了那个原因。您可能会考虑将包含内容放入页面中，但使用 style="display:none;" 将其隐藏在 div 中，然后在页面加载时使用 JavaScript 将其删除:

<script type="text/javascript">
window.addEventListener('load', function(){
    if (screen.width >= 699)
        document.getElementById('myHiddenElement').style.display = null;
});
</script>

或者，您可以对 CSS Media Queries 使用相同的策略。 .

编辑:示例:

<style type="text/css">
#myHiddenElement {
    display: none;
}
@media screen and (min-width: 699px) {
    #myHiddenElement {
        display: block;
    }
}
</style>

这将为您提供更好的性能，并且当用户调整浏览器窗口大小时，它会自动隐藏和显示内容。