javascript - 使用jquery追加方法

Question

在我的代码中，我做了类似的事情

$("#jdoe").append("<h3>Test</h3>");

html

<html>
<head>
</head>
<body>
<div id="jdoe"></div>
</body>
</html>

它按预期工作（文本测试显示在 h3 中），我期待如果我在浏览器中查看源代码，我会看到类似

<html>
<head>
</head>
<body>
<div id="jdoe"><h3>Test</h3></div>
</body>
</html>

如果我的期望是错误的，请纠正我

score 2 · Accepted Answer

你没有改变你的页面的来源，你改变了你的 DOM。如果您使用首选浏览器的开发人员工具，您将在那里看到更改。

我认为您可以通过点击F12.

score 1 · Accepted Answer

你的期望似乎是正确的......

但是要查看它的外观，您必须使用 Chrome 的 Inspect Element 之类的东西，而不是查看源代码。

但我建议更像这样：

$("#jdoe").append($("<h3>").text("Text"));

score 0 · Accepted Answer

您的“查看源代码”将与您从服务器获得的 html 相同。

任何使用 javascript/jquery 的操作都将不适用。

score 0 · Accepted Answer

您需要访问控制台，而不是源。在 Google Chrome 中，这可以通过按Ctrl+ Shift+来完成J，从那里您可以访问其他开发人员工具。

4 回答 4