javascript - 如何在加载后从 iframe 中选择内容-6ren

javascript - 如何在加载后从 iframe 中选择内容

转载作者：行者123 更新时间：2023-12-02 14:59:12

我制作了一个 Chrome 扩展程序，可以使用 <iframe> 加载我的新标签页。我的 YouTube 订阅页面(我解决了 SAMEORIGIN 问题)，并且想要将文档的一个元素复制到另一个 <div> 中，#content准确地说是元素。这是我的代码:

背景.html

<html> 
    <head>   
        <script type="text/javascript" src="jquery-2.2.0.min.js"></script>
        <script type="text/javascript" src="script.js"></script>
        <script type="text/javascript" src="window.js"></script>
    </head>
    <body>
        <iframe id="left"  name="left"></iframe>
        <div id="canvas"></div>
    </body>
</html>

Window.js

$(document).ready(function(){
    var $left = $('#left');

    $left.attr('src', 'https://www.youtube.com/feed/subscriptions');

    var $leftDoc = $left.contentWindow.document;
    $leftDoc.querySelector('#content').clone().appendTo('#canvas');
});

Script.js

chrome.webRequest.onHeadersReceived.addListener(
    function(info) {
        var headers = info.responseHeaders;
        for (var i = headers.length - 1; i >= 0; --i) {
            var header = headers[i].name.toLowerCase();
            if (header == 'x-frame-options' || header == 'frame-options') {
                headers.splice(i, 1); // Remove header
            }
        }
        return {
            responseHeaders: headers
        };
    }, {
        urls: ['*://*/*'], // Pattern to match all http(s) pages
        types: ['sub_frame']
    }, ['blocking', 'responseHeaders']
);

现在，YouTube 已加载，但我无法获取 <iframe> 中的文档。，因为它将该属性称为 undefined 。我正在努力获取div#content无需任何其他内容即可加载，以便从我的新标签页轻松导航。有任何想法吗？谢谢!

编辑: #content是div顺便说一句，它显示您的订阅源。

最佳答案

您似乎在 jQuery 对象上使用 contentWindow 等 native 方法，而不是等待 Iframe 加载，您想要的是更多

$(document).ready(function(){
    var $left = $('#left');

    $left.on('load', function() {
        $(this).contents().find('#content').clone().appendTo('#canvas');
    });

    $left.attr('src', 'https://www.youtube.com/feed/subscriptions');
});

关于javascript - 如何在加载后从 iframe 中选择内容，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/35567558/

文章推荐： javascript - 本地文件未触发 webRequest.onHeadersReceived

文章推荐： record - Ada 中的歧视记录是什么？

文章推荐： javascript - stateParam 设置范围

行者123

个人简介

我是一名优秀的程序员,十分优秀！

作者热门文章

滴滴打车优惠券免费领取

全站热门文章

首页

博学

6Ren·AI

商城

javascript - 如何在加载后从 iframe 中选择内容