Jquery 将外部HTML文件加载到带括号的div中

Jquery 将外部HTML文件加载到带括号的div中,jquery,html,Jquery,Html,对不起,如果这是一个愚蠢的问题,但没有其他解决方案,从其他时间,这已经被问到帮助我 我试图将一个单独的HTML文件的内容显示到一个div中,该div显示在多个页面上,这样我就不必在对其进行更改时重复复制和粘贴它 我在chrome浏览器中本地托管,并使用括号编辑器 这是一个基本上总结了我要做的事情的例子- index.html <!DOCTYPE html> <html> <head> <script src="https://aj

对不起,如果这是一个愚蠢的问题,但没有其他解决方案,从其他时间,这已经被问到帮助我

我试图将一个单独的HTML文件的内容显示到一个div中,该div显示在多个页面上,这样我就不必在对其进行更改时重复复制和粘贴它

我在chrome浏览器中本地托管,并使用括号编辑器

这是一个基本上总结了我要做的事情的例子-

index.html

<!DOCTYPE html>
<html>
    <head>
        <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
        <script>
            $(document).ready(function(){
                $('#content').load("content.html");
            });
        </script>
    </head>
    <body>

        <div id="content"></div>

    </body>
</html>

$(文档).ready(函数(){
$('#content').load(“content.html”);
});
下面是我想在#content div中显示的内容:

content.html

<!DOCTYPE html>
<html>

    <head>
    </head>

    <body>

        <p>Hello!</p>

    </body>
</html>

你好!


我看到一些关于
.load()
的信息,如果您在本地托管,那么这就是问题所在吗(如何解决这个问题?我对编码还不熟悉。

插入内容的方法很多,让我们从最好的开始吧

html导入标记

这是一种有很多好处的方法,比如ist短af, 但是会出现这样的问题:浏览器之间的兼容性更差

jquery方法

如官方文档中所述,有一种方法
.load()
,尽管它有一个完成处理程序

$("#content").load("path/to/local/file.html", function (){
console.log("success");
});
手动ajax

不要这样做,除非你知道你的使命,或者你的项目没有时间限制,你想知道正在发生什么

有许多方面解释了如何执行这种方法,但许多人认为这和许多人构建的东西提供了方便的访问,所以如果您对编码不熟悉,这将不适合您的问题

疯狂的对象操作和复杂的脚本还有很多。如果您知道只有您或愿意启用实验设置的人才会使用它,我建议您使用第一种

任何其他能够产生快速响应和发布的项目都可以尝试jquery。 尝试使用调试器来探索这一点 尝试检查控制台输出

如果你发现里面有什么东西或是有意外的行为,把它贴出来,我会尽力帮你的