Javascript 如何使用<；部门>；标记而不是<；iframe>；要加载快速垂直菜单？

提前感谢您提供的任何帮助。我在这个话题上搜索了几个星期，没有找到任何有用的东西

我负责更新我办公室员工的在线资源指南。我的工作使用了一个名为InQuira Info Manager的专有网络软件，供人们在存储库中搜索答案。基本上它就像WordPress一样工作。它是一个基于web的WSYIWYG web编辑器，但您也可以手动添加源代码

在工作中，我使用Dreamweaver CS2[升级不是当前选项]，我们所有的机器都有IE7，我不知道还要多久。因此，无论我构建什么，都必须与IE7兼容，并且不能是数据驱动的站点，例如使用PHP或其他服务器端技术。但是，我可以使用JavaScript，无论是外部引用还是内联引用

参考指南使用的页面为两栏格式，左侧栏用于导航，右侧主栏用于显示内容。我从家里的Dreamweaver CS6副本中提取了Spry垂直弹出式菜单的源代码，并将其粘贴到我工作时的CS2页面中，在侧边栏的“#nav”

中

问题是：我需要能够将Spry菜单文件的源HTML加载到

，而不是跨多个页面粘贴到许多不同的实例中。因为这是一个资源指南，它会定期更新，所以如果我添加或删除一个主题，我不想这样做二十次，每个主题一次。模板布局也不起作用，因为我不能用信息管理器点击Dreamweaver中的“重新发布”按钮，我必须复制整个HTML文件的源代码并手动将其粘贴到信息管理器文件中，就像创建一个新的WordPress条目一样

我试过使用

，但麻烦不断；具体来说，至少在IE7中，标签似乎不尊重z-Index属性，因此不管怎样，弹出式菜单都落后于内容

。无论我做什么，我都无法让他们掌握最新的内容。我读过关于使用JavaScript使用

.innerHTML

属性将内容加载到“#nav”

中的内容，但我一定是做错了什么。我将脚本代码粘贴到

区域中，并在HTML文件中调用脚本，但无法使其工作

---

我承认我在网页设计方面肯定不是专业人士，但在我撞上这堵墙之前，一切都很顺利。IE7很烂，但我不能强迫我的工作升级。任何使用JavaScript或其他非服务器端替代方案的解决方案都会非常好。谢谢大家!

首先，iFrame:iFrame在您的情况下（在任何浏览器AFAIK中）都不起作用，因为无论您设置了什么z索引，iFrame中的内容都不会溢出；因此，如果将菜单作为下拉子菜单，它将隐藏在iFrame中

关于

document.write（“…”）

方法：我个人不喜欢使用

document.write（）

，因为我觉得这会让代码有点凌乱，因为它需要将代码嵌入html中

您的另一种方法是正确的：将Spry菜单的内容保存在HTML文件中（没有头或体，只有div的内容）。在将要显示菜单的位置添加一个

标记（同时添加菜单所需的所有外部CSS）；然后，在页面头部添加下一个Javascript：

<script type="text/javascript">
    function loadSidebar()
    {
        var xmlhttp;
        if (window.XMLHttpRequest){
            //Modern browsers (including IE8+, not sure if IE7)
            xmlhttp=new XMLHttpRequest();
        }else{//IE7, IE6 and IE5
            xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
        }

        xmlhttp.onreadystatechange=function()
        {
            if(xmlhttp.readyState==4 && xmlhttp.status==200)
            {   //This will reemplace the content of the #Nav div 
                document.getElementById("nav").innerHTML=xmlhttp.responseText;
            }
        }
        xmlhttp.open("GET","SidebarMenu.html",true);
        xmlhttp.send();
    }
</script>

函数loadSidebar（）
{
var-xmlhttp；
if（window.XMLHttpRequest）{
//现代浏览器（包括IE8+，不确定IE7是否可用）
xmlhttp=新的XMLHttpRequest（）；
}else{//IE7、IE6和IE5
xmlhttp=新的ActiveXObject（“Microsoft.xmlhttp”）；
}
xmlhttp.onreadystatechange=函数（）
{
if（xmlhttp.readyState==4&&xmlhttp.status==200）
{//这将重新嵌入#Nav div的内容
document.getElementById（“nav”）.innerHTML=xmlhttp.responseText；
}
}
open（“GET”，“SidebarMenu.html”，true）；
xmlhttp.send（）；
}

这就在结束标记之前

：

<script type="text/javascript">
    loadSidebar();
 </script>

loadSidebar（）；

如果这样做有效，您可能希望将头部的函数放在一个外部Javascript文件中（这样您就不会在每个页面中都有代码），只需将调用保持在正文的末尾

---

如果它不起作用，我建议您在Google chrome中测试它，在控制台打开的情况下（按

F12

，您可能还需要按一下

F5

），并在函数中添加一些

console.log（）

调用，这样您就可以知道问题的确切位置。修复它，然后在IE中再次测试。

您的解释有点长，我无法确切了解问题所在（IE7本身就是一个大问题：（）。您是否试图在加载页面后在div中加载html文件（或其中的一部分）？如果是，我可以给您一个如何使用jQuery（Javascript库）的示例@Roimer，谢谢你的回复。我愿意接受你的任何建议。长话短说就是如果我在网站上添加一个部分（参考指南），我不想在同一个Spry菜单的多个实例之间进行更改。我想要一个外部菜单文件，我可以更改一次，并使更改在每个页面上生效。框架集不是一个选项，iFrame会产生无休止的问题。我工作的另一个站点似乎只使用实际的HTML源代码来存储菜单n一个单独的窗口包含在文档中。写（“…”）；。嗨，我修复了你的问题的格式，你不能使用

，除非它们被转义（html实体），在反勾之间，或者在

标记内。更多信息。关于你的问题，我有一个可能的答案（给我10分钟），但你应该知道用户