代码之家 › 专栏 › 技术社区 › Máté Burján

如何查找和编辑嵌入式网页的元素?

tampermonkey embedding google-chrome jquery javascript

Máté Burján · 技术社区 · 8 年前

如何在将网页嵌入div后访问它?正常尝试只返回null。以下是我的意思示例:

var replaceThis = document.querySelector('.div1');
var withThis = document.querySelector('.div2 a').getAttribute("href");
replaceThis.innerHTML = '<object type="text/html" data="' + withThis + '" style="width: -webkit-fill-available; height: -webkit-fill-available;"></object>';

var thingFromEmbeddedSite = document.querySelector('.div2'); //returns div2
console.log(thingFromEmbeddedSite);

thingFromEmbeddedSite = document.querySelector('h2'); //returns null
console.log(thingFromEmbeddedSite);

https://jsfiddle.net/zhhL9rjr/3/

1 回复 | 直到 8 年前

keja 8 年前

你必须等待内容加载,然后访问内容,我已经对你的fiddle做了一个小更新,由于跨来源,它在那里无法工作。

<body>
    <div class="div1">
        stuff
    </div>
    <div class="div2">
        <a href="https://jsfiddle.net/user/login/">link</a>
    </div>
</body>

function embed(src, target){
    return new Promise(function(resolve, reject){
        let iframe = document.createElement("iframe");
        iframe.src = src;
        iframe.style = "width: -webkit-fill-available;height: -webkit-fill-available;";
        iframe.onload = function(){
            resolve(iframe.contentWindow.document);
        };

      target.parentNode.replaceChild(iframe, target);
   });
}

let href = document.querySelector('.div2 a').getAttribute("href"),
    target = document.querySelector('.div1');

embed(href, target).then(function(doc){

    console.log( doc.querySelector('h2') );

});

https://jsfiddle.net/zhhL9rjr/6/

但如果从同一个域加载某些内容,则应该可以正常工作。

推荐文章

Christian · 剪贴板链接以代码/文本而不是链接的形式粘贴到所见即所得

8 年前

NickP · 链接由Tampermonkey创建,可以在Chrome中使用,但不能在Firefox中使用?[副本]

8 年前

Patrick · 设置与同一HTML节中的id节点关联的下拉列表的值

8 年前

Andrew Zhang · 为什么Tampermonkey的GM\U xmlhttpRequest可以执行CORS请求?

8 年前

Zach · 使用相同的用户脚本在不同的URL上运行不同的代码

8 年前

darius · 附录如何使用用户脚本按类名从(动态)div中提取文本?

8 年前

Nur Bar · 如何再次启动代码?(在动态更新的页面上)

8 年前

Nur Bar · 查找具有最大值的数据id

8 年前

Boontawee Home · 无法删除某些网页上的灰度过滤器

8 年前

Máté Burján · 如何查找和编辑嵌入式网页的元素?

8 年前