Javascript 动态更新DOM时，为什么html源代码不更改_Javascript_Jquery_Html_Dom_Browser

Javascript 动态更新DOM时，为什么html源代码不更改

javascript jquery html dom browser

Javascript 动态更新DOM时，为什么html源代码不更改,javascript,jquery,html,dom,browser,Javascript,Jquery,Html,Dom,Browser,我之前发布了一个问题，对答案很满意但我注意到，如果动态更新（任何？？？）DOM元素，那么view source（使用浏览器的view source）会发现更新后的DOM元素属性保留其旧值（在更新之前）。但是，如果使用Firebug/IE开发者工具栏，它将显示更新的DOM 例如： FF3.5-查看页面来源： <html> <head> <script src='http://ajax.googleapis.com/ajax/libs/jquery/1.4

我之前发布了一个问题，对答案很满意

但我注意到，如果动态更新（任何？？？）DOM元素，那么view source（使用浏览器的view source）会发现更新后的DOM元素属性保留其旧值（在更新之前）。但是，如果使用Firebug/IE开发者工具栏，它将显示更新的DOM

例如：

FF3.5-查看页面来源：

<html>
  <head>
    <script src='http://ajax.googleapis.com/ajax/libs/jquery/1.4.1/jquery.min.js' type='text/javascript'></script>
    <script>
      $(function() {
        $('input.readonly').attr('readonly', true);//set input with CSS class readonly to readonly
      });
    </script>
  </head>
  <body>
    <input type='text' class='readonly' maxlength='20' value='Blort'>This one is read-only<br>
    <input type='text' maxlength='20' value='Fish'>This one is not read-only<br>

  </body>
</html>

萤火虫会给你类似的东西

<input type="text" value="Blort" maxlength="20" class="readonly" readonly="">

IE8开发者工具栏：

因此，我猜测浏览器（IE8/FF3.5）在DOM事件开始之前（在我的例子中，它是jQuery的

document.ready（）

）生成html源代码的时间要早得多

有人能告诉我幕后发生了什么吗？

视图源是下载到浏览器的源。内存中发生的事情不会在源代码中更新

一些浏览器都有DOM检查器，例如，Safari 4.0有一个很棒的DOM浏览器，可以帮助您动态查看动态生成的元素及其CSS样式。

因为源代码是服务器端的，DOM是在客户端操作的。从技术上讲，源代码“不必”是服务器端的。您可以通过访问驱动器上的本地页面来加载它。假设它类似于Firebug/IE开发者工具栏？@Ram是的，这是相同的想法。

<input type="text" value="Blort" maxlength="20" class="readonly" readonly="">