Greasemonkey: Change text in a webpage?

Question

I used the function:

document.getElementsByTagName('strong')

to get all the text in a page with that type of formatting. The HTML looks like:

<td align="center" valign="bottom"><H1><font size="+4"><strong>TEXT_HERE</strong></font> <br>

I would like to change "TEXT_HERE" to maybe something else or remove it all together. How might I go about doing that?

Thanks in advance for your help :)

Answer 1

With a for loop?

var strongElems = document.getElementsByTagName('strong');
var wantToHide  = true || false;

for (var i=0; i<strongElems.length; i++)
{
  var thisElem = strongElems[i];
  if (wantToHide)
  {
    thisElem.style.display = "none"; // hide it
  }
  else
  {
    thisElem.textContent = "something else"; // change it
  }
}

Answer 2

When I wanted to change some text in a web page, I based my Greasemonkey solution on DumbQuotes. I liked that I could easily define replacement pairs into a list:

replacements = {
  "old": "new",
  "foo": "bar",
};

That said, I'll check out Tomalak's solution as well. Thanks for posting this question.

Answer 3

// ==UserScript==
// @name           MyScript
// @namespace      http://example.com
// @description    Example
// @include        *
//
// @require     http://ajax.googleapis.com/ajax/libs/jquery/1.3.1/jquery.min.js
// ==/UserScript==

var shouldHide = false;

$.each($('strong'), function() {
  if(shouldHide) {
    this.hide();
  } else {
    this.text = "New Text";
  }
});