感谢您阅读这篇文章 我面临chrome中的跨源问题: 请帮助我解决此问题,以便它可以从单独的文件加载页眉和页脚,并保持index.html文件的结构整洁。
错误:
Access to XMLHttpRequest at 'file:///E:/sudhir/Websites/sample%20css%20mulitpage/header.html' from origin 'null' has been blocked by CORS policy: Cross origin requests are only supported for protocol schemes: http, data, chrome, chrome-extension, https.
jquery_3.5.1.js:2 GET file:///E:/sudhir/Websites/sample%20css%20mulitpage/header.html net::ERR_FAILED
索引。 html
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Test</title>
<script src="js/jquery_3.5.1.js" ></script>
<script >$(function(){
$("head").load("header.html") });
</script>
</head>
<body>
</body>
header.html
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Test</title>
<link rel="stylesheet" href="css/bootstrap.3.3.4.min.css">
<link href="css/reset.css" rel="stylesheet" type="text/css">
<link href="style.css" rel="stylesheet" type="text/css">
<link href="css/responsive.css" rel="stylesheet" type="text/css">
<script src="js/jquery_3.5.1.js" "></script>
<!-- Font Awesome -->
<!-- <link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/font-awesome/4.4.0/css/font-awesome.min.css">-->
<link rel="stylesheet" href="css/font-awesome.min.css">
</head>
footer.hmtl
<script src="js/jquery.js"></script>
<script src="js/bootstrap.3.3.4.min.js"></script>
<!-- <script src="js/jquery.easing.min.js"></script>
<script src="plugin/fancybox/jquery.fancybox.pack.js"></script>
<script src="plugin/slick/example/js/slick.min.js"></script>
<script src="plugin/m-custome/jquery.mCustomScrollbar.concat.min.js"></script>
<script src="js/jquery.flexslider.js"></script> -->
<script src="js/app.js"></script>
</html>