区块链如何隐藏其HTML源代码？

Question

当您导航至： blockchain.info

您会注意到，如果单击页面上的view-source ，它将显示与您inspect-element不同的HTML上下文。 我的问题是，他们如何做到这一点？

我了解他们使用的是AngularJS框架中的.pug模板。 但是，如果未从客户端（浏览器）端加载它们，我的浏览器如何知道从何处读取它们？

另外，如果我要在页面上插入jQuery，jQuery是否会知道何时触发事件on('click', 'submit', 'whatever') etc ... ？

Answer 1

单击View Source ，您将看到服务器发回的内容。 许多页面不会发送回完整的HTML页面，而是发送一些框架HTML并通过JavaScript添加其余功能

当您Inspect Element ，您正在查看浏览器的DOM表示形式，其中包括通过JavaScript完成的所有操作。 有关直观的解释，请参阅CSS技巧上的这篇文章： https : //css-tricks.com/dom/

Answer 2

任何呈现HTML客户端（React，Angular，Vue）的框架都可以做到这一点。 实际的源代码实际上可以只是一些基本的html样板文件和一个div，然后可以通过Javascript之类的应用程序加载该div。 因此，当您查看页面的源代码时，就会看到此基本模板。 但是，当检查元素时，Chrome开发工具（和其他工具）正在检查正在客户端渲染的元素。 您的浏览器已将这些元素放在DOM上，直到执行代码后，它们才在源代码中不存在。 希望这有助于清理问题。