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>

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

Answer 1

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

我认为您可以通过点击F12来获取所有浏览器的开发者工具。

Answer 2

您的期望似乎正确......

但要看看它看起来像什么，你将不得不使用像Chrome的Inspect Element这样的东西，而不是查看来源。

但我建议更喜欢这样做：

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

Answer 3

您的“查看来源”将与从服务器获得的HTML相同。

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

Answer 4

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