So I have data structured like that in page:
<!-- some html--> <table> <thead> <tr> <th>Date</th><th>Type</th><th>Value</th> <!-- Header I need --> </tr> </thead> </table> <!-- some html--> <table> <tbody> <tr id="insertGuidHere"> <td>eventDate</td><td>eventType</td><td>eventData</td> <!-- Values I need to map --> </tr> </tbody> </table>
I have a header row and somewhere down the line in a different table on a different level I have the data row (an overly complex kendo-grid). I can’t go from one to another via a reasonable xpath, but I know that indices match correctly.
What I want is a way to map header index to data. Something like reverse
nth-child() – I find the element by text and return its index
var x = $x("//th[contains(text(),'Value')]").findIndexAmongSiblings(); // returns 3, because it's 3rd header cell $("tr#insertGuidHere > td:nth-child(" + x + ")"); // returns eventData cell
I know there is an
.index() function in jQuery, but I couldn’t get it to run properly, that is to return a numeric.