尝试使用 Javascript 向类添加 ID，显示在开发工具上，但不显示在源代码中

Question

我正在尝试将ID"extraattr"添加到具有名为"prod-description-bdy"的类的div中。此类在页面上仅出现一次。

我在下面编写了以下代码，当我在 Chrome 开发工具上检查它时它可以工作，但在我执行"查看源代码"时没有显示。

我的代码中是否缺少某些内容？

const elem = document.getElementsByClassName("prod-description-bdy")[0];
function myFunction() {
elem.setAttribute("id", "extraattr");
}
document.addEventListener("DOMContentLoaded",myFunction);

Answer 1

这是因为它是Javascript，只有在页面加载后才会运行。查看源代码不会运行 Javascript。

Answer 2

你在开发工具的检查器中看到的是 DOM，而不是源代码。DOM 可以更改，从服务器发送给您的 html 不能更改。

文档对象模型

Answer 3

源代码正是这样 - 程序运行的源代码。它不会显示运行时所做的任何更改。