Javascript 使用js在多个页面上显示页眉和页脚_Javascript_Jquery_Html

Javascript 使用js在多个页面上显示页眉和页脚

javascript jquery html

Javascript 使用js在多个页面上显示页眉和页脚,javascript,jquery,html,Javascript,Jquery,Html,我想使用javascript在html的每个页面中调用header.html和footer.html。我试过了代码，但这对我不起作用这是相同的代码 <html> <head> <title>hi</title> <script type="text/javascript" src="jquery-1.11.1.min.js"></script> <script> $("#header").load("hea

我想使用javascript在html的每个页面中调用header.html和footer.html。我试过了代码，但这对我不起作用

这是相同的代码

<html>
<head>
<title>hi</title>
<script type="text/javascript" src="jquery-1.11.1.min.js"></script>
<script> 
$("#header").load("header.html"); 
$("#footer").load("footer.html"); 
</script> 
</head>
<body>
<div id="header"></div><br />
<div id="content">
  Main Content
</div><br />
<div id="footer"></div>
</body>
</html>


你好
$（“#header”）.load（“header.html”）；
$（“#footer”）.load（“footer.html”）；


主要内容

我从这个网站下载了jquery-1.11.1.min.js。请帮助我更正此代码。

您需要将代码包装到函数中：

<script>
    jQuery(document).ready(function($){
        $("#header").load("header.html");
        $("#footer").load("footer.html");
    });
</script>


jQuery（文档）.ready（函数（$）{
$（“#header”）.load（“header.html”）；
$（“#footer”）.load（“footer.html”）；
});

否则，您的代码将在

#页眉

和

#页脚

可用之前执行。

您需要将代码包装到函数中：

<script>
    jQuery(document).ready(function($){
        $("#header").load("header.html");
        $("#footer").load("footer.html");
    });
</script>


jQuery（文档）.ready（函数（$）{
$（“#header”）.load（“header.html”）；
$（“#footer”）.load（“footer.html”）；
});

否则，您的代码将在

#页眉

和

#页脚

可用之前执行。

将代码包装在文档就绪块中

jQuery(document).ready(function($) {
  $('#header').load('header.html', function () {
    console.log('header.html loaded')
  });
  $('#footer').load('footer.html', function () {
    console.log('footer.html loaded')
  });
})

将代码包装在文档就绪块中

jQuery(document).ready(function($) {
  $('#header').load('header.html', function () {
    console.log('header.html loaded')
  });
  $('#footer').load('footer.html', function () {
    console.log('footer.html loaded')
  });
})

问题是，在调用脚本加载元素时，没有加载DOM

Jquery找不到$（“#页眉”）和#页脚，因为DOM尚未就绪

在

标记上方尝试此操作：

jQuery(document).ready(function($) {
 $("#header").load("header.html"); 
 $("#footer").load("footer.html"); 
}

问题是，在调用脚本加载元素时，没有加载DOM

Jquery找不到$（“#页眉”）和#页脚，因为DOM尚未就绪

在

标记上方尝试此操作：

jQuery(document).ready(function($) {
 $("#header").load("header.html"); 
 $("#footer").load("footer.html"); 
}

以前有人问过这个问题：你能用你当前的文件结构更新你的帖子吗？控制台有没有给你任何错误？以前有人问过可能重复的问题：你能用你当前的文件结构更新你的帖子吗？控制台有没有错误？可能是Hi的重复，这是mozilla的，但chromeHi没有，我检查控制台。以下是错误XMLHttpRequest无法加载header.html。收到无效的响应。因此，不允许访问源“null”。index.html:1 header.html loadedIt不是这段代码的问题，因为您使用的是带有文件URL的chrome。您好，这是与mozilla，但不是与chromeHi，我检查控制台。以下是错误XMLHttpRequest无法加载header.html。收到无效的响应。因此，不允许访问源“null”。index.html:1 header.html loadedIt不是这段代码的问题，因为您使用的是带有文件URL的chrome。您好，这是与mozilla合作，但不与chrome合作–您好，这是与mozilla合作，但不与chrome合作–您好，这是与mozilla合作，但不与chrome合作–您好，这是与mozilla合作，但不与chrome合作