HTML source appearing different in Firebug to standard browser 'View Source' option?

Question

I have some HTML content being generated via some PHP.

Whilst investigating a css problem, I noticed through Firebug that some elements in the DOM were not organised as I expected. Yet, when I did the standard 'View Source' in Firefox it showed everything to be correct.

I know the source being displayed by Firebug is accurate, because the source it presents me corresponds to the aesthetic issue I'm seeing on screen, but I'm not sure what this means and how to investigate further.

Why does this happen, and which source version should I be looking at? (p.s. I have no JavaScript running on the website.)

Answer 1

Firebug cleans up the DOM tree, so if there's any syntax bugs in the raw source, you won't see them in Firebug (unless they're so bad it screws up the parse tree completely).

The regular view-source functionality shows the page's source as it came from the server. If you do any manipulations of the DOM after the page loaded, it won't show up in view-source, as that's now outdated. Firebug will show the live in-memory tree, with any manipulations included, but it will also clean things up.