Question

A blog I read has some annoying commenters. I thought I would try my hand at Greasemonkey to turn them off.

The basic structure of the HTML is simple – a comment looks something like this:

<li>
  <cite>user name ...</cite>
  comment text
</li>

So with that in mind, I bashed my head against the keyboard for a while until this dropped out:

var killlist = /user1|user2/;

var comments = document.getElementsByTagName('li');

if (comments.length) {
  for ( var i = 0; i < comments.length; i ++ ) {
    var comment = comments[i];
    var cites = comment.getElementsByTagName('cite');
    if (cites.length) {
      var cite = cites[0];
      var title = cite.textContent;
      if (killlist.test(title)) {
        comment.parentNode.removeChild(comment);
      }
    }
  }
}

window.alert('Done!')

(the window.alert is just so I know if the script runs to completion)

This mostly works. e.g. on one test page, it removed 13 of 16 posts by one of the users. I tried replacing the removeChild line with this:

comment.style.visibility = 'hidden';

That appears to get everything, but at the expense of leaving great empty spaces where the comments would have been.

I’m a complete javascript newbie, so can anyone see anything obvious I’m doing wrong?

Answer 1

You should be able to fix it by reversing the order of your for loop and deleting elements from the end of the comments array first:

for ( var i = comments.length - 1; i >= 0; i-- )