javascript - Javascript - 重定向到另一个网站并在该页面加载后调用 Javascript 函数

Question

场景：您的网页上有一个指向另一个网站（例如 yahoo.com）的链接，并且用户点击了该链接。

即使页面位于完全不同的域中，您能否调用 Javascript 函数并在页面上加载 HTML/CSS？比如，在雅虎上渲染某种侧边栏？

如果不是（我假设是这种情况），还有其他方法吗？

Answer 1

简短的回答是不，你不能。

你当然可以做一些变通方法，就像 Blender 在他的评论中建议的那样，在网站中嵌入一个 iframe，但是由于同源策略，如果 iframe 中加载的内容来自另一个域，你将不被允许对其进行任何访问。这适用于 CSS 和 JavaScript，因此您将无法以任何方式修改内容。

Tha 说，您也许可以将内容加载到 iframe 中，并在您自己的页面上，在 iframe 旁边有一个“侧边栏”。当您单击“侧边栏”中的任何链接时，您会在 iframe 中加载该引用，从而创建侧边栏与 iframe 内容相关的“感觉”。这绝不是一个很好的解决方案，但它是我目前能想到的最接近的解决方案。

更新

扩展了@kieran 在他的评论中提供的示例，带有一些链接，所以这里是我上面描述的一个工作示例。

您的 DOM 看起来类似于：

<div class="sidebar">
    <a href="http://images.yahoo.com/" target="container">Yahoo images</a><br/>
    <a href="http://news.yahoo.com/" target="container">Yahoo news</a>
</div>
<iframe name="container" class="site-container" src="http://www.yahoo.com/" />

还有一些您可以修改以满足您的需求的 CSS：

.sidebar {
    width: 150px;
    float: left;
    background-color: #ccc;
    border-right: 1px solid #888;
}

.site-container {
    border: 0;
}

.sidebar,
.site-container {
    height: 300px;
}