gpt4 book ai didi

javascript - 将整个 HTML 页面导入到另一个页面

转载 作者:行者123 更新时间:2023-12-03 02:04:18 26 4
gpt4 key购买 nike

我正在尝试在我的网站中嵌入另一个网站,但由于可能会导致一些问题,我不想使用 iFrame 或 AJAX 导入来执行此操作。

<html>
<head>
<link rel="import" href="mysite.html">
</head>
<body>
<script>
var link = document.querySelector('link[rel="import"]');
var content = link.import;
document.body.appendChild(content.cloneNode(true));
</script>
</body>
</html>

基本上,我正在尝试使用从 Web 组件导入 HTML 来实现此目的,但不幸的是,我上面的内容不起作用(我也使用正确的浏览器),并且我找到的所有示例仅用于导入特定的 div或导入页面中的元素。但是是否可以简单地加载整个页面并将其嵌入到另一个站点中?

最佳答案

它不起作用,因为你从 import 获得的对象<link rel="import">的属性(property)元素是 Document界面。您不能将此类对象插入 <body> 中元素。

相反,您至少应该获得 <html>从其 documentElement 导入文档的元素属性:

 var content = link.import.documentElement  //returns a html element

但它仍然不正确,因为您将插入 <html> <body> 内的元素元素,这很丑。

您宁愿将导入文档的innerHTML 文本复制到主文档中:

 document.body.innerHTML = link.import.querySelector( 'body' ).innerHTML

或者将要导入的 HTML 放入 <template> 中,如果您想推迟脚本执行和加载,这是更好的选择。

关于javascript - 将整个 HTML 页面导入到另一个页面,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/49868832/

26 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com