jQuery更改了html页面的内容,但"查看源代码"并未反映更改

Question

jQuery: v1.7.1大家
好,
我从jQuery更改了img属性像这样:

        $("document").ready(function () {
        $("img").attr({ src: "images/Spring.jpg", alt: "spring" });
    });

更改反映在浏览器中,但是,
1)当我检查"查看源代码"时,没有更改(它是原始的html)由js更改,为什么？像这样:

    <a href="images/Grass.jpg">
    <img src="images/Grass.jpg" alt="image"/> </a>

2)当我从Firebug检查时,它显示了jquery所做的更改？

<a href="images/Grass.jpg">
<img alt="spring" src="images/Spring.jpg"> </a>

这里发生了什么 ？
问)DOM的更改是否在内存中完成？萤火虫如何展示它？

Answer 1

源代码永远不会改变.当您"查看源代码"时,它只显示浏览器从服务器收到的内容.

它是您正在操作的DOM(文档对象模型),而不是HTML.

初始DOM状态是源HTML的表示,但它不与源HTML永久链接.Javascript更改DOM但不更改HTML.有关DOM的完整说明,请参见此处:http://www.w3.org/TR/DOM-Level-2-Core/introduction.html

文档对象模型(DOM)是用于有效HTML和格式良好的XML文档的应用程序编程接口(API).它定义了文档的逻辑结构以及文档的访问和操作方式.

以及"DOM不是什么"标题下页面的相关引用:

文档对象模型不是将对象持久化为XML或HTML的方法.DOM不是指定如何用XML表示对象,而是指定XML和HTML文档如何表示为对象,以便它们可以在面向对象的程序中使用.

类似地,Firebug(以及其他开发人员工具框架)向您显示DOM的当前状态(因为这是动态的).这就是为什么要看Firebug中的变化,而不是源代码视图中的变化.