使用 Javascript 将链接转换为 iframe答案

【问题标题】：Convert a link into an iframe using Javascript使用 Javascript 将链接转换为 iframe
【发布时间】：2016-09-01 01:03:33
【问题描述】：

假设我有一个链接

<a href="http://URL"></a>

代替此链接，我想显示一个包含链接内容的 IFRAME。示例：

<iframe src="http://URL"></iframe>

此 iframe 的宽度将为 100%，并且 iframe 的高度将动态计算为等于结果页面的高度（也称为http://URL）。

我将如何使用纯 Javascript 解决方案来做到这一点？

【问题讨论】：

Creating an IFRAME using JavaScript的可能重复
所以它不像我最初想象的那么容易，因此我的答案删除了。题。你的<a> 元素有id 名称吗？更重要的是，<a href...> 和这里的</a> 之间是否有任何文字。我不明白你怎么能看到页面上写的那些链接？没有这些答案，我不知道如何进行。
是的，您可以在元素中添加 class 或 id，并在和之间添加任何文本
@t.niese 这并不能解决我的问题。我正在尝试将链接转换为 iframe，并使用 Javascript 调整帧大小。
make iframe height dynamic based on content inside- JQUERY/Javascript

标签： javascript iframe

【解决方案1】：

你可以试试这个，但它只能在同一个域名中工作。这是安全限制

<html>
<body>
    <div>
        <a href="http://example.org" class="frame">example.org</a>
    </div>
    <script>
        var links = document.getElementsByClassName('frame');
        for (var i = 0; i < links.length; i++) {
            var frame = document.createElement("iframe");
            frame.setAttribute('src', links[i].getAttribute('href'));
            frame.setAttribute('class', links[i].getAttribute('class'));
            frame.style.width = "100%";
            frame.onload = function() {
                frame.style.height = frame.contentWindow.document.body.scrollHeight + "px";
            };

            links[i].parentNode.replaceChild(frame, links[i]);
        }
    </script>
</body>
</html>

【讨论】：

我将如何更改它以便没有域限制？
如果是您的，您可以在远程服务器上嵌入 javascript 代码（或更改服务器响应标头），但我想不是这样吗？那就试试下面这个库吧，其实我没用过：github.com/davidjbradshaw/iframe-resizer