使用 JavaScript 从另一个页面获取内容
问题如何使用 JavaScript 将 div 从第 2 页加载到第 1 页。
第2页.html
<html>
<head>
<title> title </title>
<body>
<div id="main">
<div id="content2"> this is content2</div>
<div id="content3"> this is content3</div>
</div>
</body>
</html>
我想从 page2 获取并使用 id content2 使用该 div 的内容创建一个到 page1 的 div,单击并删除链接后,对 content3、content4 和连续执行相同的操作。
第1页.html
<html>
<head>
<title> title </title>
<body>
<div id="main">
<div id="content1"> this is content1</div>
<a href="#"> get content</a>
</div>
</body>
</html>
就是这样。
<html>
<head>
<title> title </title>
<body>
<div id="main">
<div id="content1"> this is content1</div>
<div>this is content2</div>
<div>this is content3</div>
</div>
</body>
</html>
我是 JavaScript 新手,我不知道该怎么做。如果有人可以提供帮助。谢谢。
编辑:如果真的可能的话,我想要一种只使用没有 jquery 的 javascript 的方法。我想让我的项目离线工作,我不能用 jquery 来做,因为它不起作用。我已经下载了 jquery 插件并将其粘贴到我的目录中,但是它也不起作用。
回答
您可以使用 JavaScript、jQuery 和 AJAX 的组合来执行此操作。
首先,包含 jQuery 库:
<script src=>//code.jquery.com/jquery-1.10.2.js></script>
然后编写一个类似的 JavaScript 函数,将 div 元素的 html 内容替换为 Page2.html 文件:
var loadNewContent = function {
$.ajax("Page2.html", {
success: function(response) {
$("#content2").html(response);
}
});
};
然后是一些“触发”需要运行此函数,例如:
$("#content2").on('click', loadNewContent);
页:
[1]