Question

我正在制作一个Chrome扩展程序，将java.lang.NullPointerException: Attempt to invoke virtual method 'boolean com.google.android.gms.common.ConnectionResult.hasResolution()' on a null object reference另一个网站加载到“新标签页”页面上。现在我正在加载YouTube的订阅页面（不要担心<iframe>问题，我已经解决了这个问题），但现在我试图将所有内容都删除除Same-Origin元素（订阅供稿元素）之外的页面。

这是我的代码：

Background.html

#content

左右.html

<!DOCTYPE html>
<html> 
    <head>   
    <script type="text/javascript" src="script.js"></script> 
    </head>
        <iframe id="left" src="left.html" name="left"></iframe>
        <iframe id="right" src="right.html" name="right"></iframe>
</html>

Window.js

<!DOCTYPE html>
<html>  
    <body>   
        <input type="button" value="Load new document" id="loader">
    </body> 
    <script type="text/javascript" src="window.js"></script>    
</html>

正如您所看到的，现在我用按钮加载它。一旦按下它，它就会加载YouTube，并且应该删除除document.addEventListener('DOMContentLoaded', function() { document.getElementById("loader").addEventListener("click", loadUrl); }); function loadUrl() { window.location = 'https://www.youtube.com/feed/subscriptions'; [].forEach.call(document.querySelectorAll(!'#content'),function(e){ e.parentNode.removeChild(e); }); return false; }之外的所有html，但事实并非如此。有没有其他方法可以解决这个问题，可能使用jQuery？谢谢！

Answer 1

document.querySelectorAll(!'#content')

不符合您的要求，如果您想删除除#content之外的所有元素，则应使用以下内容。

document.querySelectorAll('*:not(#content)')

Answer 2

#content无法访问

document，因为全局document位于不同的网页上 - 包含iframe的网页，但不包含其内容。此外，document.querySelectorAll(!'#content')不是有效的选择器字符串 - 将被解释为document.querySelectorAll(false)，因为非空字符串的!返回false。

一般来说，您将很难访问iframe的内容。如果X-Frame-Options设置为SAMEORIGIN，大多数浏览器（例如Chrome）都不会加载iframe的内容，对于youtube来说，肯定是。{/ p>

假设您正在解决此问题（可能使用反向代理？），您可以使用JavaScript获取iframe的内容，如下所示：

iframe.contentWindow.document

然后，您可以在iframe上使用querySelector和好友：

iframeDocument.querySelector('#content')

如果你想切出一个节点，你应该remove()：

iframeDocument.querySelector('#content').remove()

现在，说完所有这些：

不要这样做。

你正在滥用iframe，这需要一些非常有创意的（阅读：脆弱，hacky）代码，Youtube当然有一个公共API，你可以从中访问某人的Youtube提要 - 并且Youtube远远少于Youtube可能会因加强安全，甚至意外而受阻。（假设其页面上的HTML发生了变化，因此#content包含所有内容。或者假设他们决定检查正确的来源是否使用JavaScript请求页面，并阻止您。）

你想要什么，你应该使用Youtube的API。

如何使用Chrome扩展程序从页面中剪切元素

2 个答案: