Using Parentnode Multiple Times

I have this html code in a page &

Solution 1:

I tried node3 = node.parentNode.parentNode.firstChild.firstChild.firstChild to get from the node = <img src="/pic/aaab.gif" style="vertical-align: middle;" alt="Upload" /> to <img src="/pic/abc-aaa-bb.png" alt="aa/bb-cccc" />.

.firstChild does get the first child node in the DOM - which does not need to be an actual element, but could be of any node type. In your case, the firstChild of the <tr> is the whitespace text node (the linebreak in the html before the <td>).

What should i do?

You could try the .firstElementChild property instead.

However, relying that heavily on the exact structure of the DOM might not be good practise. Maybe try something like

<tr>.querySelector("td.ttr_typeimg")
<tr>.getElementsByTagName("img")[0]
<tr>.cells[0].firstChild.firstChild

Solution 2:

I solved this by

node3 = node.parentNode.parentNode.getElementsByTagName('*')[0].firstChild.firstChild;