如何使用Greasemonkey和Jquery将HTML元素隐藏在某个类中?

This news site (The Guardian) has a small frame that displays in the bottom-right of the page, with code like this:

这个新闻网站(The Guardian)有一个小框，显示在页面的右下角，有这样的代码:

<div class="initially-off social-cta-overlay">

    <div class="social-cta-overlay-content"></div>

</div>

I hid the internal contents of the inner div because they're not important. I wrote a Greasemonkey script that uses JQuery to hide this box because it appears on every page:

我隐藏了内部div的内容，因为它们不重要。我编写了一个Greasemonkey脚本，使用JQuery隐藏这个框，因为它出现在每个页面:

// ==UserScript==
// @name        hide-guardian-ad
// @namespace   guardian
// @description Hides the Guardian social media frame
// @version     1
// @grant       none
// ==/UserScript==

// @require       http://ajax.googleapis.com/ajax/libs/jquery/2.1.0/jquery.min.js

$(".social-cta-overlay").hide()

I installed the script, but nothing happens and the box is still there.

我安装了脚本，但是什么也没发生，而且这个盒子还在。

2 个解决方案

#1

That script has 3 problems (worst first):

这个剧本有三个问题(最糟糕的是第一个):

The @require directive is outside the metadata block. This means that Greasemonkey ignores it as just an ordinary javascript comment.
@require指令位于元数据块之外。这意味着Greasemonkey将它忽略为一个普通的javascript注释。
There is no @include or @match directive. This means that the script will fire on every page and iframe of every site! (Crashing some of them, and chewing up resources.)
没有@include或@match指令。这意味着脚本将在每个站点的每个页面和iframe上启动!(破坏其中一些，消耗资源。)
@grant none means that the script will interfere with and crash all or part of many sites.
@grant none表示该脚本会干扰和崩溃许多站点的全部或部分。

This script works:

这个脚本工作原理:

// ==UserScript==
// @name        hide-guardian-ad
// @include     http://www.theguardian.com/*
// @description Hides the Guardian social media frame
// @require     http://ajax.googleapis.com/ajax/libs/jquery/2.1.0/jquery.min.js
// @grant       GM_addStyle
// ==/UserScript==

$(".social-cta-overlay").hide()

#2

try this:

试试这个:

$(document).find(".social-cta-overlay").hide();

#1