Question

这是javascript代码，用于在index.html中显示另一个html文件

<script src="//code.jquery.com/jquery-1.10.2.js"></script>
<script> 
$(function(){
$("#header").load("header.html"); 
$("#footer").load("footer.html"); 
});
</script> 

<div id="header"></div>
<!--Remaining section-->
<div id="footer"></div>

但是当我点击示例标题以显示header.html的内容或者如果我点击页脚只显示footer.html时如何制作

       <li><a href="header.html"><span>Header</span></a></li>
        <li><a href="footer.html"><span>Footer</span></a></li>

Answer 1

以下是一个例子：

<强> HTML

function runShapes(color){
    shapeNames = Object.getOwnPropertyNames(shapes);
    shapeNames.forEach(function(prop) {
        if(typeof shapes[prop] === "function") {
            shapes[prop](color);
        }
    });
}

<强>的JavaScript

<ul id="nav">
    <li>
        <a href="header.html" data-container="header">
            <span>Header</span>
        </a>
    </li>
    <li>
        <a href="footer.html" data-container="footer">
            <span>Footer</span>
        </a>
    </li>
</ul>
<div id="header"></div>
<!--Remaining section-->
<div id="footer"></div>

使用javascript添加标头html文件

1 个答案: