"Alert" 和 "if" 改变 dom 从 iframe 复制到 div 的行为

Question

尝试制作一些老式的 ajax (iframe-javascript) 脚本。 DOM导航使用了一点mootools

说明：

HTML：

1 个 iframe 称为“缓冲区”

1 个名为“显示”的 div

JAVASCRIPT：（简称：将 iframe 内容复制到页面上的 div 中）

1) iframe 上的 onLoad 触发 handler()，一个计数器确保它只运行一次 （这是因为否则firefox将进入反馈循环。我认为会发生什么：加载iframe> handler（）> copyBuffer>更改iframe的src，firefox再次将其作为onload）

2) 调用copybuffer()，它设置iframe的src，然后将iframe内容复制到div中，然后擦除iframe内容

代码：

---

count=0;
function handler(){

if (count==0){
copyBuffer();
count++;
}

}

function copyBuffer(){


$('buffer').set('src','http://www.somelink.com/');

if (window.frames['buffer'] && $('display') ) { 

$('display').innerHTML = window.frames['buffer'].document.body.innerHTML;
window.frames['buffer'].document.body.innerHTML="";
}

}

---

问题：

问题 1) 没有任何反应，内容没有加载到 div 中。但如果我要么：

A) 移除计数器，让脚本在反馈循环中运行：内容突然复制到 div 中，但当然有一个反馈循环正在进行，你可以看到它一直在状态栏中加载。

或

B) 在 copyBuffer 函数中插入警报。内容被复制，没有反馈循环。

为什么会这样？

问题 2) If 包裹着我从互联网上的来源获得的复制代码。我不确定它有什么作用？如果我删除它，代码将无法在：Safari 和 Chrome 中运行。

非常感谢！

---

更新：

就像答案所说我已经创建了一个事件处理程序。他们使用 jQuery，我在 mootools 中做了一个：

window.addEvent('domready', function() {

    $('buffer').addEvent('load', function(){

        $('display').set('html',window.frames['buffer'].document.body.innerHTML) 
        window.frames['buffer'].document.body.innerHTML="";

    }).set('src','somelink');

});

额外问题：

3) 我是 stackoverflow 的新手（多么棒的地方！），如果我为后续问题创建新线程会更好吗？

Answer 1

当您尝试访问时，iframe 尚未加载页面，因此无法获取内容..

我相信通过在 iframe 上添加负载处理程序并在其中进行复制，以下方法会起作用..

function handler(){
   $('buffer').load( function(){copyBuffer();} ).attr('src','http://www.somelink.com/');
}

function copyBuffer(){
   if (window.frames['buffer'] && $('display') ) 
    { 
       $('display').innerHTML = window.frames['buffer'].document.body.innerHTML;
       window.frames['buffer'].document.body.innerHTML="";
    }
}

Answer 2

B) 在 copyBuffer 中插入警报 功能。内容被复制， 没有反馈循环。

根据您的描述，您的代码需要某种延迟才能正确执行，而 alert 只是给出了所需的延迟。
更准确地说，在我看来，$('buffer').set('src','http://www.somelink.com/'); 和 $('display').innerHTML = window.frames['buffer'].document.body.innerHTML; 之间的时间跨度不足以让缓冲区完全加载其源代码。

您应该考虑处理适当的事件，以确保在您的代码触发之前所有内容都已加载。

例如，您可以通过以下方式重写代码：

function handler(){    
    $('buffer').load( function(){
        if (count==0){
            copyBuffer();
            count++;
        }
    }).attr('src','http://www.somelink.com/');    
}

function copyBuffer(){

    //$('buffer').set('src','http://www.somelink.com/');

    if (window.frames['buffer'] && $('display') ){    
        $('display').innerHTML = window.frames['buffer'].document.body.innerHTML;
        window.frames['buffer'].document.body.innerHTML="";
    }    
}