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

标签 javascript jquery html google-chrome-extension

我正在制作一个 chrome 扩展来加载 <iframe>另一个网站的新标签页。现在我正在加载 YouTube 的订阅页面(不用担心 Same-Origin 问题,我已经解决了这个问题),但现在我正尝试从页面中删除除 #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>

左和右.html

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

Window.js

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;
}

如您所见,现在我正在使用按钮加载它。一旦按下,它就会加载 YouTube 并且应该剪掉除 #content 之外的所有 html。 ,但事实并非如此。有没有其他方法可以解决这个问题,可能是使用 jQuery?谢谢!

最佳答案

document.querySelectorAll(!'#content')

无法满足您的要求,如果您确实想删除除 #content 之外的所有元素,则应使用以下内容。

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

关于javascript - 如何使用 Chrome 扩展程序从页面中剪切元素,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/35546743/

相关文章:

javascript - Popover 中的 Bootstrap Tab 不起作用

javascript - 使用 jQuery 获取填充表单的 HTML 代码

php - AJAX请求中的特殊字符

javascript - JQuery 未使用 $ ('#22/1' 创建对象)?

html - Css Div 溢出

javascript - 如何将 json 对象发布到 web api 然后接收响应?

c# - ASP.NET MVC 中的 Ajax 文件上传和 JQuery 表单数据

javascript - 使用 JavaScript 在 OnClick 按钮上添加表格行并保存在 Laravel 的数据库中

html - UserComments 架构上的 dtstart 警告

html - css 转换规则中的问题