Question

从Javascript to insert IFRAME获取灵感，我试图通过Javascript插入iFrame：

function display(selector) {

    var i = document.createElement('iframe');
    i.scrolling = 'no';
    i.frameborder = '0';
    i.allowtransparency = 'true';
    i.style.border = 'none';
    i.style.overflow = 'hidden';
    i.style.width = $(selector).css('width');
    i.style.height = $(selector).css('height');
    i.src = '//localhost/content';
    $(selector).append(i);
}

原谅懒惰的jQuery。

无论如何，这在Firefox上可以正常工作，但Chrome出现了以下错误：

Port: Could not establish connection. Receiving end does not exist.

Chrome会添加预期的HTML，但不会显示iFrame。这是什么原因，如果有的话，有什么更好的方法可以实现我想做的事情？

Answer 1

您的代码似乎对我有用，也许您需要在localhost网址中添加一个端口。

Here is a working fiddle

function display(selector) {

    var i = document.createElement('iframe');
    i.scrolling = 'no';
    i.frameborder = '0';
    i.allowtransparency = 'true';
    i.style.border = 'none';
    i.style.overflow = 'hidden';
    i.style.width = $(selector).css('width');
    i.style.height = $(selector).css('height');
    i.src = 'http://www.wikipedia.com';
    $(selector).append(i);
}

display($('#cont'));

HTML：

<div id="cont"></div>

的CSS：

#cont {
     width: 200px;
    height: 200px;
}

我个人会使用这样的函数，并用css完成剩下的工作：

function iframeIt(where, url) {
    where.append('<iframe src="' + url + '"></iframe>');
}

iframeIt($('#cont'), 'http://www.wikipedia.com');

使用Javascript插入iFrame

1 个答案: