How to convert Xpath to CSS

Question

My xpath: /html/body/div/table/tbody/tr[2]/td[4]

I need to get CSS to use it in the jsoup selector.

I found a comparison between xpath and css: here , and he said in his example ( Second <E> element anywhere on page ) that I cannot do this. Xpath xpath=(//E)[2] CSS N\A

Perhaps I cannot find what I am looking for. Any ideas?

Here's the html I'm trying to parse (I need to get the values: 1 and 3 ):

 <div class=tablecont> <table width=100%> <tr> <td class=header align=center>Panel Color</td> <td class=header align=center>Locked</td> <td class=header align=center>Unqualified</td> <td class=header align=center>Qualified</td> <td class=header align=center>Finished</td> <td class=header align=center>TOTAL</td> </tr> <tr> <td align=center> <div class=packagecode>ONE</div> <div> <div class=packagecolor style=background-color:#FC0;></div> </div> </td> <td align=center>0</td> <td align=center>0</td> <td align=center>1</td> <td align=center>12</td> <td align=center class=rowhead>53</td> </tr> <tr> <td align=center> <div class=packagecode>two</div> <div> <div class=packagecolor style=background-color:#C3F;></div> </div> </td> <td align=center>0</td> <td align=center>0</td> <td align=center>3</td> <td align=center>42</td> <td align=center class=rowhead>26</td> </tr> </table> </div> 

Answer 1

While an expression of type (//E)[2] cannot be represented using the CSS selector, an expression like E[2] can be emulated using the pseudo-class :nth-of-type() :

 html > body > div > table > tbody > tr:nth-of-type(2) > td:nth-of-type(4) 

Answer 2

Works well for me.

 //Author: Oleksandr Knyga function xPathToCss(xpath) { return xpath .replace(/\[(\d+?)\]/g, function(s,m1){ return '['+(m1-1)+']'; }) .replace(/\/{2}/g, '') .replace(/\/+/g, ' > ') .replace(/@/g, '') .replace(/\[(\d+)\]/g, ':eq($1)') .replace(/^\s+/, ''); } 

Answer 3

You are looking for something like this:

http://jsfiddle.net/YZu8D/

 .tablecont tr:nth-child(2) td:nth-child(4) {background-color: yellow; } .tablecont tr:nth-child(3) td:nth-child(4) {background-color: yellow; }