包含具有相同URL的另一个IFRAME的IFRAME是否有限制?

Mot*_*tti 16 html javascript iframe dom

为了在框架层次结构中玩一下,我写了一个小的html页面,允许嵌套任意数量的帧(问题末尾可用的代码).

但是这不起作用,在IE9和Firefox 4上创建了内部框架但没有渲染(head并且body为空):

框架截图

在Chrome上它可以工作两个级别然后如果我单击Add内部框架上的按钮没有任何反应(控制台中也没有错误消息).

如果我复制文件N次数并让每个文件使用不同的文件,它适用于任何深度(但如果有一个循环则不行).

我试图搜索这样的限制,但我不能使用正确的关键字.有没有人对此有任何参考?

这是addRemoveFrames.html文件:

<!DOCTYPE html>
<html>
<head>
    <title>Add and Remove Frames</title>
    <script type="text/javascript">
        function add() {
            var f = document.createElement('iframe');
            f.src = 'addRemoveFrames.html';
            document.getElementById('frameContainer').appendChild(f);
        }
        function remove() {
            var c = document.getElementById('frameContainer');
            var f = c.lastChild;
            if (f)
                c.removeChild(f);
        }
    </script>
</head>
    <body>
        <input type="button" onclick="add()" value="Add"/>
        <input type="button" onclick="remove()" value="Remove"/>
        <hr />
        <div id="frameContainer"></div>

    </body>
</html>
Run Code Online (Sandbox Code Playgroud)

我稍微修改了@davin的答案,因此每个框架的URL反映了它在层次结构中的完整路径.

var counter = 0;
function add() {
    var f = document.createElement('iframe');
    var sep = location.search ? (location.search + '.') : "?";
    f.src = 'addRemoveFrames.html' + sep + ++counter;
    document.getElementById('frameContainer').appendChild(f);
}
Run Code Online (Sandbox Code Playgroud)

dav*_*vin 12

看起来像一个明智的浏览器安全机制,以防止嵌套iframe的无限循环(即使在你的情况下,它不会是无限的).

在任何情况下,一个简单的解决方法可能是向URL添加一个无用的查询参数,使浏览器认为加载的页面不相同,但确实如此.

所以不是你当前的函数add(),而是像这样(我全力以赴,所以id不会对全局命名空间进行调查):

var add = (function(){

  var id = 0;
  return function(){
     var f = document.createElement('iframe');
     f.src = 'addRemoveFrames.html?useless=' + id++;
     document.getElementById('frameContainer').appendChild(f);
  };

})();
Run Code Online (Sandbox Code Playgroud)


Bof*_*ain 7

以下是官方参考:实施HTML框架 - W3C工作草案31-Mar-97.标题是"无限递归"并指出如果src等于父URL,则应将其视为空.

我建议使用该技术davin,或使用纯DOM来创建嵌套元素而不是IFRAMEs,这将使编程更改更容易,并可能使用更少的内存,以及避免延迟加载的问题.