从 div 内的多个 iframe 中提取标题

extracting title from multiple iframes inside a div

我已经为此苦苦挣扎了几天,似乎无法解决问题。我有几个 html(都位于同一域中),我将它们作为 iframe 加载到 parent 页面内的 div 中。然后我尝试从每个 iframe 中提取一个标题并将它们推入一个数组,然后删除 iframe。一切都很好,除了 pageTitles 数组填充了许多空白字符串。谢谢!

        var currentPage = 0;                
        var pages = new Array("page1.html", "page2.html", "page3.html", "page4.html");
        var maxPages = pages.length;    

        var pageTitles = [];

        for (i=0; i < maxPages; i++){
            var iframe = document.createElement('iframe');
            iframe.frameBorder=1;
            iframe.width = "400px";
            iframe.height = "50px";
            iframe.id="childFrame"+i;
            var frameTitle = iframe.id;
            iframe.setAttribute("src", pages[i]);
            document.getElementById("hidden").appendChild(iframe);
            //pageTitles.push(window.frames[i].document.title); // tried this with no luck
            pageTitles.push($("#"+frameTitle).contents().find("title").text());
            //pageTitles.push(document.getElementById(frameTitle)[0].document.title); // this is probably completely wrong, but thought I'd try it anyway
            document.getElementById("hidden").removeChild(iframe);
        }

很确定 iframe 内容尚未加载,因此无法获取标题。包含一个 onload 回调,让该回调确定 iframe 的名称,然后销毁 iframe 并加载下一个。

Capture iframe load complete event

您必须等待 iframe 加载。只有这样您才能获取内容值。这可能会有所帮助。

$("#"+frameTitle).on('load',function(){
        pageTitles.push($(this).contents().find("title").text());
   });