Search code examples
javascriptdomprototypejs

How do I select the first H1 element in a TD?


I am (stuck) using Prototype 1.3.1 and I'm having a hard time moving from jQuery to the older version of this library. Unfortunately, the extensions I'm writing are for a vendor-provided system to which we can not update. So, no moving to a newer version.

I'm having trouble finding out how to do things without the modern CSS selectors, or I'm doing something wrong. It looks like CSS selectors only surfaced in 1.5.1?

Anyways, I have a TD with x number of H1 tags in it. I need to add a DIV after the first H1. I have the ID of the TD and there are no IDs on the H1s.

I also need a bit of guidance on how to create and manipulate the object. For example, it looks like Element as a constructor wasn't implemented until 1.6. So, how do I create a "prototype-enabled" object so that I can call methods like update() on it?

I have tried using extend() on a document.createElement result but get 'object doesn't support...'. I'm sure I'm missing something, but it's hard to find docs on a library from 5 years ago.

If anyone could provide any pointers I would greatly appreciate it. Cheers.


Solution

  • If you just use JavaScript this is rather simple.

    var obj = ... // Your TD node
    var h1s = obj.getElementsByTagname("h1");
    var myH1;
    if (h1s.length > 0) {
      myH1 = h1s[0];
    } else {
      // Trigger error
    }