Getting inner HTML of a <td> after previous <td>

Question

So, I'm working in possibly the most user-unfriendly CRM and I wanted to make my life a little bit easier with iMacros.

However, things are so complicated that I can't do a simple task of getting some value easily.

Here's how stuff looks like on the page:

<td id="_t5141276" class="Label">Number:</td>
<td id="_t5141277" class="Value">1234567890</td>

I need to get innerhtml of "Value" class, BUT:
1) There's bunch of Values on the page
2) IDs are generated randomly for every page.

I figured out that I could look for the "Number:" text in first td, and then get innerhtml of the td after that one, but how do I do it?

I'd prefer it to be in javascript or something else that I could easily integrate into iMacros.

Answer 1

I'm going to assume you can't change the markup in any way, as that seems to be implied in your question.

You can get a list of all td elements in document order from querySelectorAll . When you find the one with Number: in it, just use the next one:

var list = document.querySelectorAll("td"); // See note below
var index;
var value;
for (index = 0; index < list.length - 1; ++index) {
    if (list[index].innerHTML === "Number:") {
        value = list[index + 1].innerHTML;
        break;
    }
}

Note I've allowed for the possibility that the Number: item is the last one (and so the next, the one we want, would be missing) by stopping one short of the last one.

---

Note: The above does it in a webpage in the normal way. To do it in iMacros, apparently you have to prepend window.content to document.querySelectorAll , so the first line would be:

var list = window.content.document.querySelectorAll("td");
//         ^^^^^^^^^^^^^^^------- added for iMacros

Answer 2

First you can get all the td elements and check the innerHTML of the td and match with your "Number:". If it is mached then get the next td value.

The code will be something like this:

var value = 0; 
var tds = document.getElementsByTagName("td");
for (var i=0; i< tds.length; i++)
{
    var currentTd = tds[i];
    var value = currentTd.innerHTML.trim() // trim will remove extra spaces
    if(value === "Number:")
    {
        value = tds[i+1].innerHTML;
        break;
    }
}

Answer 3

Thanks for your answers. I can't upvote them because I don't have enough rep, but all suggestions work (including the deleted one for iMacros after a bit of tweaking).

Answer 4

Non-JavaScript Option

Adobe CQ5 likes to do the randomly generated ID thing as well.

What I typically do is to open the page in question in chrome, inspect the element I want to isolate, and within the inspection tools, delete the values for "ID" until I've removed all of the dynamically generated ones that are parent elements to the element in question.

After that is done, inspect your element again (you'll want to avoid refreshing and deleting all of your hard work!) and right click on the html element to copy the XPATH.

This takes a little trial and error, and often requires that I copy the XPATH multiple times to find sneaky IDs.

Within iMacros, use

TAG XPATH="[your XPATH goes here]" EXTRACT=TXT
TAG XPATH="[your XPATH goes here]" CONTENT=whatever

to do whatever you like.