jQuery to hide specific comments from forums

Question

So, I'm learning some jQuery and I've decided to use as a training ground a request a friend made me. I'm trying to create a script for greasemonkey that when a selected user posts something in a thread on the Overwatch forums: (https://us.forums.blizzard.com/en/overwatch/c/general-discussion) it hides that specific comment from the entire thread.

The forum in question identifies the users by a tag called: data-user-id="XXXX" which is what I want to use as a target of my script while selecting which posts to hide

The expected behaviour is that when the script runs and finds that a certain user by the user ID I've provided has written something it will just hide its entire post in the thread I'm currently reading.

These are some of the experiments I made:

//Experiment 1
$('#post_2:contains("data-user-id="XXXX"")').remove();

//Experiment 2
$('.boxed.onscreen-post:contains("XXXX")').remove();

//Experiment 3
$("#post_2 > .boxed.onscreen-post:contains('XXXX')").remove();

I'm struggling a bit with the concept of dynamic IDs to target the element in question and to make it read the content of the div to find the ID of the user.

These queries really didn't give me any error so my guess is that they couldn't find the string of text required to act.

Why don you try using css selector contain? Literally not :contains but *[id^=post] — Benyamin Limanto, Jun 30 '19 at 14:16
Possible duplicate of [jQuery how to find an element based on a data-attribute value?](https://stackoverflow.com/questions/4191386/jquery-how-to-find-an-element-based-on-a-data-attribute-value) — Heretic Monkey, Jun 30 '19 at 14:18

Julesezaar · Accepted Answer · 2019-06-30T14:37:38.060

I think you just need this:

$('[data-user-id="XXXX"]').remove();

If you want to use the css :contains(), drop the string quotes. According to the W3Schools jQuery :contains() Selector you just need to put the string without quotes in the :contains() selector. This will look for text between the start and end tag of the element .onscreen-post. So not in its attributes but in the real content of the block.

$('.boxed.onscreen-post:contains(XXXX)').remove();

// Or when it is a variable
var searchFor = 'XXXX';
$('.boxed.onscreen-post:contains(' + searchFor + ')').remove();

The above doesn't work for html attributes like your data-user-id="XXXX". If you want the behaviour of the :contains() selector on a html attr which is not an exact match you need the *= in the selector like this:

$('[data-user-id*="XXXX"]').remove();

// Or when it is a variable
var searchFor = 'XXXX';
$('[data-user-id*="' + searchFor + '"]').remove();

Thank you! this gave me a much broader view on how this works, i understood completely wrong the concept of "contains" mixing it up with containers... oops.. thank you very much! — Plarpoon, Jun 30 '19 at 16:55

score 0 · Answer 2 · answered Jun 30 '19 at 14:42

0

function hidePostsFromUsers(nicknames) {
  var posts$ = $('.contents.ember-view .topic-list-item');

  var filteredPosts$ = posts$.filter(function(ignore, el) {
    return nicknames.some(function(nick) {
      return $(el).find('[data-user-card]').attr('data-user-card') === nick;
    });
  });
  filteredPosts$.remove();
}

hidePostsFromUsers(['Doomfish-21368']);

answered Jun 30 '19 at 14:42

Gutelaunetyp

2,144
4
15
40

this is more an entire thread remover then a single post remover from a thread but i appriciated it a lot, thank you very much! – Plarpoon Jun 30 '19 at 16:54

jQuery to hide specific comments from forums

2 Answers2