javascript - 如何观察 iframe 中 DOM 的变化？

Question

我正在使用 Jquery-Mutation 摘要 https://code.google.com/p/mutation-summary/ “一个 JavaScript 库，可以快速、轻松且安全地观察 DOM 的更改”

可以在这里找到:https://github.com/joelpurra/jquery-mutation-summary

这是一个工作示例:http://joelpurra.github.io/jquery-mutation-summary/example/demo.html

我希望能够从父窗口观察 iframe 中 DOM 的更改。这是我的代码

$(function() {
var $ChangeThere = $('#myframe') //iframe id myframe
    $ChangeThere.mutationSummary('connect', callback, [{
    all: true
}]);
function callback(summaries){
//something changes in iframe dom
    alert('change!');
}
});

上面的代码不起作用。我也从同一个域访问。

Answer 1

您应该能够在 iFrame 中进行监听，然后将结果发送回父级。您可以在父级中建立一个函数，然后从 iFrame 中更新它，如下所示。

父级:

function alertfromiframe(message){
    alert(message);
}

iFrame:

$(function() {
var $ChangeThere = $('#frameContents') //iframe id myframe
    $ChangeThere.mutationSummary('connect', callback, [{
    all: true
}]);
function callback(summaries){
//something changes in iframe dom
    parent.alertfromiframe('change!');
}
});