我有一个动态加载iframe的脚本标记。那个iframe有自己的脚本标签,可以在第一个iframe中加载另一个iframe。 (愚蠢我知道,但我无法控制插件)。
我需要做以下事情: - 等待动态创建第一个iframe - 等待iframe的脚本执行并加载嵌套的iframe - 获取嵌套iframe的主体高度
我试过在两个级别都没有运气的情况下监听DOM的变化。以下是第一个iframe而不是第二个iframe。必须有一个更简单的方法!
// init
// --------------------------------
// define mutation observer
MutationObserver = window.MutationObserver || window.WebKitMutationObserver;
// wait for document ready
$(document).on('ready', iframeDimensionsFaq);
// iframe dimensions function
// --------------------------------
function iframeDimensionsFaq() {
// get iframe parent element
var parent = document.getElementById('helpjuice_js_widget_content');
// observe iframe parent for DOM changes
observe(parent, function(firstIframe){
firstIframe.addEventListener('load', function() {
// observe second iframe
observe(this, function(secondIframe){
console.log(secondIframe);
});
});
});
};
// observe element for new nodes
// --------------------------------
function observe(el, cb) {
// create new mutation observer
var observer = new MutationObserver(function(mutations, observer) {
// check for added nodes
if (!mutations[0].addedNodes) return;
// loop added nodes & check for iframe
var addedNodes = mutations[0].addedNodes;
for (var i=0; i<addedNodes.length; i++) {
if (addedNodes[i].nodeName.toLowerCase() === 'iframe') {
cb(addedNodes[i]);
}
}
});
// observe parent for DOM changes
observer.observe(el, {
subtree: false,
attributes: true,
childList: true
});
};