Question

我正在尝试编写一个Web小部件，允许用户在自己的网页中显示自定义信息（来自我的网站）。我想要使用的机制（用于创建Web小部件）是javascript。

基本上，我希望能够编写一些像这样的javascript代码（这是最终用户复制到他们的HTML页面，以便在我们的页面中显示我的小部件）

<script type="text/javascript">
/* javascript here to fetch page from remote url and insert into DOM */
</script>

我有两个问题：

如何编写javascript代码以从远程网址获取页面？理想情况下，这将是PLAIN javascript（即不使用jQuery等 - 因为我不想强迫用户获取第三方脚本jQuery，这可能与其页面上的其他脚本冲突等）
我提取的页面包含内联javascript，它在body.onLoad事件中执行，以及用于响应用户操作的其他函数 - 我的问题是：

i）中。是否会为检索到的文档触发body.onLoad事件？ ⅱ）。如果将检索到的页面直接转储到DOM中，那么该文档将包含两个<body>部分，这些部分不再有效（X）HTML - 但是，我需要触发body.onLoad事件以使页面转到设置正确，我还需要检索页面中的其他功能，以便检索到的页面能够响应用户交互。

关于如何解决这些问题的任何建议/提示？

Answer 1

有两种方法。

主机网站使用<iframe>标记将您的网页包含在其网页内的固定尺寸框中。它在自己的document内运行，并拥有自己的<body>和onload事件;它位于您网站的安全上下文中，因此如果出于某种原因需要AJAX可以回调您的服务器。

这很容易;访客页面甚至不需要知道它被包含在iframe中。
主机站点使用<script src="http://your-site/thing.js"></script>从您的服务器运行脚本。您的脚本使用document.write()或DOM方法直接在宿主文档中创建大量内容。无论哪种方式，您都知道何时将它们放置到位，这样您就不需要onload。

您正在主机的安全上下文中运行，因此您无法将AJAX直接发送到服务器或直接查看服务器的cookie;任何此类数据必须作为脚本的一部分提供。（您可以查看主机服务器的cookie和跨站点脚本到他们的任何页面，相反，如果您的脚本中有任何敏感数据，主机站点也会看到它。所以那里只要一个站点从另一个站点获取脚本内容，它就是一种隐式信任关系。）

使用javascript将远程页面加载到DOM中

1 个答案: