By Jens Erat


2013-08-14 19:53:01 8 Comments

This is meant to provide a canonical Q&A to all that similar (but much too specific questions to be a close target candidate) popping up once or twice a week.

I'm developing an application that needs to parse a website with tables in it. As deriving XPath expression for scraping web pages is boring and error-prone work, I'd like to use the XPath extractor feature of Firebug (or similar tools in other browsers) for this.

Example input looks like this:

<!-- snip -->
<table id="example">
  <tr>
    <th>Example Cell</th>
    <th>Another one</th>
  </tr>
  <tr>
    <td>foobar</td>
    <td>42</td>
  </tr>
</table>
<!-- snip -->

I want to extract the first data cell ("foobar"). Firebug proposes the XPath expression

//table[@id="example"]/tbody/tr[2]/td[1]

which works fine in any XPath tester plugins, but not my own application (no results found). If I cut down the query to //table[@id], it works again.

What's going wrong?

2 comments

@Peter Rakmanyi 2015-01-30 18:33:42

Just came across the same problem. I almost wrote a recursive funtion to check for every tbody tag if it exists and traverse the dom that way, then I remembered I know regex. :)

Before parsing, get the html as a string. Insert missing <tbody> and </tbody> tags with regex, then load it back into your DOMDocument object.

Jens Erat gives a good explanation, but here is

Solution 4: Make sure the HTML source always has the <tbody> tags with regex

JavaScript
    var html = '<html><table><tr><td>foo</td><td>bar</td></tr></table></html>';
    html.replace(/(<table([^>]+)?>([^<>]+)?)(?!<tbody([^>]+)?>)/g,"$1<tbody>").replace(/(<(?!(\/tbody))([^>]+)?>)(<\/table([^>]+)?>)/g,"$1</tbody>$4");

PHP
    $html = $dom->saveHTML();
    $html = preg_replace(array('/(<table([^>]+)?>([^<>]+)?)(?!<tbody([^>]+)?>)/','/(<(?!(\/tbody))([^>]+)?>)(<\/table([^>]+)?>)/'),array('$1<tbody>','$1</tbody>$4'),$html);
    $dom->loadHTML($html);

Just the regex:

matches `<table>` tag with whatever else junk inside the tag and between this and the next tag if the next tag is NOT `<tbody>` also with stuff inside the tag

    /(<table([^>]+)?>([^<>]+)?)(?!<tbody([^>]+)?>)/

replace with

    $1<tbody>

the $1 referencing the captured `<table>` tag with contents.
Do the same for the closing tag like this:

    /(<(?!(\/tbody))([^>]+)?>)(<\/table([^>]+)?>)/

replace with

    $1</tbody>$4

This way the dom will ALWAYS have the <tbody> tags where necessary.

@Alex 2017-07-15 16:30:11

Somehow, this answer immediately reminded me of stackoverflow.com/a/1732454/5114081

@Peter Rakmanyi 2017-07-16 18:13:06

@Alex That is a great post. But does it really apply to this case? The regex is used on a string to insert a possibly missing part before it is being parsed by an actual xml parser. The same could be done on the object it is parsed into by searching, checking, inserting, moving and iterating, but this seemed faster based on the computer not caring about what the bits represent. Please note that I may be completely wrong here and if anyone can show this method resulting in a security problem, unintended behavior, etc., please provide an explanation or example, so we can all learn from it.

@Alex 2017-07-17 07:28:44

Personally, I couldn't think of an example where using a regex here could cause unintended behaviour, otherwise I would've mentioned it. This wasn't meant to unnecessary criticize your post, I just wanted to remind that using regexes could (in theory, at least) bring some fallbacks with it.

@Jens Erat 2013-08-14 19:53:01

The Problem: DOM Requires <tbody/> Tags

Firebug, Chrome's Developer Tool, XPath functions in JavaScript and others work on the DOM, not the basic HTML source code.

The DOM for HTML requires that all table rows not contained in a table header of footer (<thead/>, <tfoot/>) are included in table body tags <tbody/>. Thus, browsers add this tag if it's missing while parsing (X)HTML. For example, Microsoft's DOM documentation says

The tbody element is exposed for all tables, even if the table does not explicitly define a tbody element.

There is an in-depth explanation in another answer on stackoverflow.

On the other hand, HTML does not necessarily require that tag to be used:

The TBODY start tag is always required except when the table contains only one table body and no table head or foot sections.

Most XPath Processors Work on raw XML

Excluding JavaScript, most XPath processors work on raw XML, not the DOM, thus do not add <tbody/> tags. Also HTML parser libraries like and only output XHTML, not "DOM-HTML".

This is a common problem posted on Stackoverflow for PHP, Ruby, Python, Java, C#, Google Docs (Spreadsheets) and lots of others. Selenium runs inside the browser and works on the DOM -- so it is not affected!

Reproducing the Issue

Compare the source shown by Firebug (or Chrome's Dev Tools) with the one you get by right-clicking and selecting "Show Page Source" (or whatever it's called in your browsers) -- or by using curl http://your.example.org on the command line. Latter will probably not contain any <tbody/> elements (they're rarely used), Firebug will always show them.


Solution 1: Remove /tbody Axis Step

Check if the table you're stuck at really does not contain a <tbody/> element (see last paragraph). If it does, you've probably got another kind of problem.

Now remove the /tbody axis step, so your query will look like

//table[@id="example"]/tr[2]/td[1]

Solution 2: Skip <tbody/> Tags

This is a rather dirty solution and likely to fail for nested tables (can jump into inner tables). I would only recommend to to this in very rare cases.

Replace the /tbody axis step by a descendant-or-self step:

//table[@id="example"]//tr[2]/td[1]

Solution 3: Allow Both Input With and Without <tbody/> Tags

If you're not sure in advance that your table or use the query in both "HTML source" and DOM context; and don't want/cannot use the hack from solution 2, provide an alternative query (for XPath 1.0) or use an "optional" axis step (XPath 2.0 and higher).

  • XPath 1.0:
    //table[@id="example"]/tr[2]/td[1] | //table[@id="example"]/tbody/tr[2]/td[1]
  • XPath 2.0: //table[@id="example"]/(tbody, .)/tr[2]/td[1]

@ganders 2014-09-25 05:43:03

In addition to what was stated above, for my scraper on these scenarios, I have a flag for "skipFirstRow" which actually works perfectly (for the pages I'm scraping).

@VeRychard 2015-01-11 22:19:43

I've been searching for a solution for 4 hours, because the data I wanted from a site didn't want to be mine. All the values were easy by their xpaths, however one of the tables returned an error, and the solution was to delete tbody and replace it with an extra /.

@jpaugh 2017-12-20 19:29:34

@VeRychard There are easier ways to get a Valentine. :-)

Related Questions

Sponsored Content

6 Answered Questions

10 Answered Questions

[SOLVED] Why does HTML think “chucknorris” is a color?

12 Answered Questions

[SOLVED] Why does this CSS margin-top style not work?

  • 2012-03-01 16:17:34
  • jamietelin
  • 217492 View
  • 303 Score
  • 12 Answer
  • Tags:   html margin css

19 Answered Questions

[SOLVED] Why does CSS work with fake elements?

  • 2013-12-03 14:19:30
  • Jordan ChillMcgee Ludgate
  • 17597 View
  • 436 Score
  • 19 Answer
  • Tags:   html css

17 Answered Questions

66 Answered Questions

[SOLVED] Why not use tables for layout in HTML?

  • 2008-09-17 13:19:09
  • Benno Richters
  • 448698 View
  • 665 Score
  • 66 Answer
  • Tags:   html css

1 Answered Questions

[SOLVED] Right Xpath for HTML elements?

3 Answered Questions

[SOLVED] Why is this seemingly simple Xpath navigation not working?

  • 2013-08-21 17:12:01
  • UpQuark
  • 397 View
  • 4 Score
  • 3 Answer
  • Tags:   c# html xpath

5 Answered Questions

[SOLVED] Why does firebug add <tbody> to <table>?

  • 2009-11-05 05:15:58
  • Mask
  • 5345 View
  • 30 Score
  • 5 Answer
  • Tags:   html dom firebug

Sponsored Content