简体   繁体   English

常见的页眉和页脚错误

[英]Common Header and footer error

I just learnt about common header and footer technique .. Below is the code i have written I can't figure out what is wrong with this code .. 我刚刚了解了常见的页眉和页脚技术。.下面是我编写的代码,无法弄清楚此代码有什么问题..

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">

<head>
    <script type="text/javascript" src="jquery-1.10.2.js"></script>
</head>

<body>
    <div id="header"></div>
    <script>
        $("#header").load("header.html");
    </script>
</body>

</html>

I tried your code with other jQuery library version and it was running to me. 我尝试使用其他jQuery库版本使用您的代码,并且该代码正在运行。

I had use the jquery@1.10.1 library, and the header.html in the same directory. 我曾经在同一目录中使用过jquery@1.10.1库和header.html

You could see this running here. 您可以看到它在这里运行。

you can do this easily using jquery. 您可以使用jquery轻松完成此操作。 this is an alternative way that i use and works fine. 这是我使用的另一种方式,效果很好。

$(function(){
    $("[data-load]").each(function(){
        $(this).load($(this).data("load"), function(){
        });
    });
})

now use data-load on any element to call its contents from external html file you just have to add line to your html code where you want the content to be placed. 现在在任何元素上使用data-load从外部html文件中调用其内容,您只需要在要放置内容的html代码中添加一行即可。

example

<nav data-load="sidepanel.html"></nav>
<nav data-load="footer.html"></nav>

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM