20

我已经可以使用 jQuery 获取 iframe 的内容，尽管我想学习如何使用纯 JavaScript 获取它。

这就是我到目前为止所拥有的。

 var frame = document.getElementById('awc_frame');
 var easyBB = frame.contentWindow.document.body.innerHTML;
 easyBB.getElementById('chatbox-title').innerText="Chatbox";

我做错了什么，请帮忙。原来框架没有ID，我已经试过了

var frame = document.frames['awc_frame'];

跨浏览器效率高吗？然后我如何获得 contentWindow？只是一些解释，所以我可以用 JavaScript 而不是 jQuery 来做到这一点。jQuery版本是这个

var frame = $('#avacweb_chat iframe');
var easyBB = $('#chatbox-title',frame.contents()).text('Chatbox');
4

2 回答 2

37

如果它在同一个域上，试试这个。如果 iframe 的来源与您正在查看的窗口不同，它不会让您访问 iframe 内容。

var iframe = document.getElementById("awc_frame");
var iframe_contents = iframe.contentDocument.body.innerHTML;

使用 jsfiddle iframe 查看同一域上的页面的工作示例：

http://jsfiddle.net/tqAL3/1/

于 2013-05-26T01:30:25.583 回答
0

与 Nile 相同的答案，但作为更类似于 querySelector 的功能

// iframe-query-selectors.js v1
function iframeQuerySelector(iframe, selector, all){
    if( iframe && (iframe.nodeName || iframe.tagName) === 'IFRAME' && iframe.nodeType === 1){
        all = all ? 'All' : '';
        if(selector){
            return iframe.contentDocument['querySelector' + all](selector);
        };
        return iframe.contentDocument;
    };
    throw new Error('The element must be an iframe.');
};
function iframeQuerySelectorAll(iframe, selector){
    return iframeQuerySelector(iframe, selector, true);
};
于 2021-05-08T17:53:29.913 回答