将“onclick”应用于 iFrame 中的所有元素

Question

如何使用 JavaScript DOM 将 onclick 事件应用于 iframe 内的链接？

这是我正在尝试但不起作用的方法：

document.getElementById('myIframe').contentDocument.getElementsByTagName('a').onclick = function();

似乎没有抛出任何错误，我可以完全控制iframe 中的内容。

这里有一些代码可以测试，看看我是否至少可以计算出我的iframe 中有多少div。

// access body
var docBody = document.getElementsByTagName("body")[0];

// create and load iframe element
var embed_results = document.createElement('iframe');
embed_results.id = "myIframe";
embed_results.setAttribute("src", "http://www.mysite.com/syndication/php/embed.php");

// append to body
docBody.appendChild(embed_results);

// count the divs in iframe and alert   
alert(document.getElementById("myIframe").contentDocument.getElementsByTagName('div').length);

Answer 1

iFrame 可以从不同域的另一个网站获取内容。

能够访问其他域上的内容将对用户构成安全漏洞，因此无法通过 Javascript 进行此操作。

因此，您不能将页面中的事件附加到 iFrame 中的内容。

Answer 2

getElementsByTagName 返回一个 NodeCollection，因此您必须遍历此集合并将 onclick 处理程序添加到该集合中的每个节点。下面的代码应该可以工作。

var links = document.getElementById('myIframe').contentDocument.getElementsByTagName('a');
for(var i=0;i<links.length;++i)links[i].onclick=function(){}

还要确保在加载框架内容后运行此代码

embed_results.onload=function(){
   // your code
}