Question

我正在尝试一些非常简单的东西，但由于某些原因它不起作用：

index.html：

<!DOCTYPE html>
<html>
<head>
<meta charset="ISO-8859-1">
<title>SyriLab</title>
<link rel="stylesheet" href="css/bootstrap.min.css">
<link rel="stylesheet" href="css/style.css">
</head>
<body>
    <header></header>
    <div id="content"></div>

    <script src="js/jquery-3.3.1.min.js"></script>
    <script src="js/poper.min.js"></script>
    <script src="js/bootstrap.min.js"></script>
    <script src="js/functions.js"></script>
    <script src="js/main.js"></script>
</body>
</html>

js / main.js：

window.onload=function(){
    main();
}


function main(){
    $("header").load("./pages/header.html"); 
    $("#content").load("./pages/home.html");
}

启动index.html时出现的错误：

无法加载文件：/// E：/Dev/Eclipse/SyriLab/pages/header.html：仅支持协议方案的跨源请求：http，数据，chrome，chrome-extension，https。

无法加载文件：/// E：/Dev/Eclipse/SyriLab/pages/home.html：交叉源请求仅支持协议方案：http，数据，chrome，chrome-extension，https。

一切都是本地的，同一个根，我只是想创建一个基本的html页面，包括bootstrap和jquery（也是poper，不确定它是什么，但是在引导页面上）。并使用类似于“包含”的东西在php中，但使用常规的js和html。

我在这里做错了什么？

Answer 1

根据您的问题，您似乎尝试将index.html作为本地文件进行访问。而不是那样，您必须使用webserver（例如nginx，apache等）来访问该文件。由于用于访问本地文件的协议是file://，jQuery的加载方法将无法加载文件。出于安全原因，浏览器禁止此类请求。

配置网络服务器并尝试使用index.html协议访问http，您的代码应该有效。

Answer 2

正如其他人所说。您必须使用服务器提供文件。

为此，为避免安装软件，请使用Python。

在控制台中输入：

cd /path/to/my/index.html
python -m http.server

默认情况下，它将使用http://0.0.0.0:8000/

此简单服务器将提供您的目录文件。 Index.html是服务器将尝试查找并服务的空资源请求。

在本地

2 个答案: