Über den Unterschied zwischen der Überprüfung von Elementen und der Anzeige des Quellcodes einer Webseite

Ich weiß nicht, ob Sie bemerkt haben, dass beim Öffnen einer beliebigen Webseite mit dem Chrome-Browser zwei sehr ähnliche Optionen angezeigt werden, wenn wir mit der rechten Maustaste auf die Seite klicken:

Es dient dazu, den Quellcode der Webseite anzuzeigen und zu prüfen (Elemente zu untersuchen).

Ich dachte immer, dass zwischen diesen beiden Optionen kein Unterschied besteht, aber da Chrome diese beiden Optionen auflistet, muss es dafür einen Grund geben.

Schauen wir uns eine einfache Seite an:

Der Anzeigeeffekt auf der Webseite ist wie folgt (der größte Teil des Leerraums wird gelöscht, um die Bildgröße zu komprimieren):

Wir überprüfen die Elemente

Sie werden feststellen, dass im Tag <p></p> ein zusätzlicher Satz vorhanden ist.
Im Quellcode der Webseite gibt es jedoch keinen solchen Satz im Tag <p></p>:

Dieser Satz wird dynamisch von JS generiert.

Daher besteht ein kleiner Unterschied zwischen der Überprüfung von Elementen und der Anzeige des Quellcodes einer Webseite. Dieser Unterschied kann als der Unterschied zwischen Quellcode und DOM bezeichnet werden. Wenn wir Elemente überprüfen, sehen wir uns tatsächlich das DOM an. Nachdem das DOM gerendert wurde, sehen wir beim Anzeigen des Quellcodes der Webseite den nicht analysierten Quellcode. Das Obige ist der vollständige Inhalt dieses Artikels. Ich hoffe, er kann Ihnen bei Ihrem Studium und Ihrer Arbeit hilfreich sein.