Menu
I'm using Firefox alongside Firebug Developer tools.
Is the HTML shown in View Source (Ctrl + U) different from the HTML I see when inspecting elements using Firebug?
What are the differences between the two?
549
The source is the raw HTML that is unadulterated by any client-side scripts. It is the direct response of the HTTP request to the server. The DOM, on the other hand, is the same HTML structure that has been modified by JavaScript. Source Code reads the page's HTML as if you opened it in a text editor.
The main difference is the “View Source” shows the HTML that was delivered from the web server to your browser. Inspect elements is a developer tool to look at the state of the DOM tree after the browser has applied its error correction and after any Javascript have manipulated the DOM.
Yes they are different.
View source shows you the original HTML source of the page.
The inspector shows you the DOM as it was interpreted by the browser. This includes for example changes made by javascript which cannot be seen in the HTML source.
Oh and this also counts for the developer tools that allow you to view the DOM in other browsers, like the Chrome Web Inspector and Internet Explorer Developer Toolbar. The HTML source will always be the same across all browsers, the generated DOM might differ as it is an interpretation and render engines are not all the same (unfortunately).
141
It should also be noted that aside from the dynamic DOM manipulation which could be occurring via javascript etc, Firefox will also parse and "clean-up" malformed (X)HTML, so these changes will also affect what you see when inspecting an element.
3
The difference are (but not limited to) that in firebug console you can see dynamically changes, which occurred in web page. For example, DOM elements modifications (from AJAX or regular JavaScript), CSS in-place modifications, etc...
1
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
