3

我有一个页面，其中包含一个用于导航的标题 div、一个用于内容的内容 div 和一个仅包含一些静态信息的页脚 div。

这个想法是，当您单击标题栏中的某些内容时，内容 div 会相应地更改其内容。为了便于开发，我想将每个内容元素存储在自己的文件中。我该如何填写magicLoad我在下面写的这个函数？

我目前没有使用任何框架（想到 jquery），但我肯定不反对使用一个。如果我在这里违反了其他最佳实践，我也很想知道，但我的主要目标是从外部页面加载。我怎样才能做到这一点？

这是我现在设置的基本骨架模型。（当然不止这 3 个，但这些足以说明这一点。）

<html>
    <script type="text/javascript">
    function show(which) {
        document.getElementById(which).innerHtml = magicLoad(which + ".html");
        return false;
    }       
    function showHome() { show('home'); return false;} // for onload

    </script>
    <body>
    <div id="header">
        <a href="javascript:void(0)" onclick="show('home')">HOME</a> |
        <a href="javascript:void(0)" onclick="show('training')">TRAINING</a> |
        <a href="javascript:void(0)" onclick="show('audits')">AUDITS</a>
    </div>
    <div id="content">

    </div>
    <div id="footer">

    </div>
    </body>
    <script> window.onload=showHome; </script>
</html>
4

2 回答 2

4

使用以下，简单直接

$('#which').load('test.html');

if which 作为参数

$('#'+which).load('test.html');
于 2012-06-20T05:22:05.793 回答
3

如果你想在一个网页中嵌入另一个网页，你应该考虑使用<iframe>. 就像是：

<script type="text/javascript">
function show(which) {
    document.getElementById(which).src=which+".html";
    return false;
}       
function showHome() { show('home'); return false;} // for onload

</script>
<iframe id="home"></iframe>
于 2012-06-20T05:08:38.893 回答