javascript - How to use greasemonkey to selectively remove content from a website - Stack Overflow

admin管理员组

文章数量:1195006

The content I am trying to modify has a series of <div> entries, and within each of these are other <div> entries. There are no id tags to help here. What I want the script to do is inspect the content of each of these <div> entries and look for some text. This will be used to determine whether the whole '' entry is deleted/hidden or not. Is this possible? How?

Below is an example. There are several of these in the page, and I want to delete/hide the ones where the text inside the <div class="foo bar"> tags say "Yes." So in this example, this whole thing would get deleted/hidden.

<div class="entry">

<div class="fooPhoto"><a href="Addfoo.jsp?tid=954102"><img class="person" src=".png" border="0" width="24" height="24" onerror="this.src='images/site/icons/dude.png'" title="Photo Unavailable" alt="Photo Unavailable" ></a></div>

<div class="fooAvg">4.7</div>     

<div class="foo bar">Yes</div>

<div class="fooShare">
<a class="shareEmail" href="referral.jsp?sid=882&tid=954102&pgid=3">Share using email</a>
</div>

</div><!-- closes entry -->

The content I am trying to modify has a series of <div> entries, and within each of these are other <div> entries. There are no id tags to help here. What I want the script to do is inspect the content of each of these <div> entries and look for some text. This will be used to determine whether the whole '' entry is deleted/hidden or not. Is this possible? How?

Below is an example. There are several of these in the page, and I want to delete/hide the ones where the text inside the <div class="foo bar"> tags say "Yes." So in this example, this whole thing would get deleted/hidden.

<div class="entry">

<div class="fooPhoto"><a href="Addfoo.jsp?tid=954102"><img class="person" src="http://static.barfoo.com/images/site/icons/dude.png" border="0" width="24" height="24" onerror="this.src='images/site/icons/dude.png'" title="Photo Unavailable" alt="Photo Unavailable" ></a></div>

<div class="fooAvg">4.7</div>     

<div class="foo bar">Yes</div>

<div class="fooShare">
<a class="shareEmail" href="referral.jsp?sid=882&tid=954102&pgid=3">Share using email</a>
</div>

</div><!-- closes entry -->

• javascript
• greasemonkey
• html
• tampermonkey

Share Improve this question Follow edited Jan 23, 2017 at 21:10 Brock Adams 93.4k2323 gold badges240240 silver badges304304 bronze badges asked Feb 6, 2012 at 23:44 node ninjanode ninja 33k6060 gold badges173173 silver badges257257 bronze badges

Add a comment  | 

1 Answer 1

Sorted by: Reset to default 22

The general answer to your question is not too hard with the jQuery contains() selector. Something like this will work:

// ==UserScript==
// @name     _Remove annoying divs
// @include  http://YOUR_SERVER/YOUR_PATH/*
// @require  http://ajax.googleapis.com/ajax/libs/jquery/2.1.0/jquery.min.js
// @grant    GM_addStyle
// ==/UserScript==
//- The @grant directive is needed to restore the proper sandbox.

// Use the jQuery contains selector to find content to remove.
// Beware that not all whitespace is as it appears.

var badDivs = $("div.entry div.foo:contains('Yes')");

badDivs.parent ().remove ();

---

Update for the site specified in the comments:
Note that there is no need to search for text because the site conveniently gives the key div a class of isX or notX.

// ==UserScript==
// @name     _Sample
// @include  http://example.com/SelectItem.jsp*
// @require  http://ajax.googleapis.com/ajax/libs/jquery/2.1.0/jquery.min.js
// @grant    GM_addStyle
// ==/UserScript==
//- The @grant directive is needed to restore the proper sandbox.

var badDivs = $("#ratingTable div.entry").has("div.notX");

badDivs.remove ();

---

Finally, for dynamic (AJAX driven) pages, use MutationObserver or waitForKeyElements. (WaitForKeyElements also works fine on static pages.)

Here's the above script rewritten to be AJAX aware:

// ==UserScript==
// @name     _Sample
// @include  http://example.com/SelectItem.jsp*
// @require  http://ajax.googleapis.com/ajax/libs/jquery/2.1.0/jquery.min.js
// @require  https://gist.github.com/raw/2625891/waitForKeyElements.js
// @grant    GM_addStyle
// ==/UserScript==
//- The @grant directive is needed to restore the proper sandbox.

waitForKeyElements ("#ratingTable div.entry", deleteNotX);

function deleteNotX (jNode) {
    if (jNode.has("div.notX").length) {
        jNode.remove ();
    }
}

本文标签： javascriptHow to use greasemonkey to selectively remove content from a websiteStack Overflow