Discrepancy Between View Source and Dev Tools in Firefox

Hello everyone…

I’m experiencing something confusing while using Morningstar to view a list of stocks. When I right-click on a value in the table and click “Inspect” in Firefox, I can see the HTML/CSS and that exact value. However, when I right-click on the page and choose “View Source,” the div class and the text value are nowhere to be found.

How is Morningstar able to obfuscate this information? Am I missing something? Is there a specific technique they’re using to prevent the text from appearing in the source view?

Hello! Morningstar likely uses JavaScript to dynamically generate and render the stock values on the webpage after it loads. When you “View Source,” you’re seeing the original HTML file sent from the server, which doesn’t include the dynamically generated content. The “Inspect” tool, on the other hand, shows the live DOM, including all modifications made by JavaScript. This technique, often used by many websites, helps manage real-time data updates and ensures that sensitive or frequently changing information isn’t directly visible in the static source code.

View source shows you the original website code.