Question

我是jQuery的新手。我使用jQuery append()添加HTML元素。在查看页面后，该元素未显示，但已添加并显示在网页中。

代码：

<html>
    <head>
        <title>TODO supply a title</title>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <script src="js/libs/jquery/jquery.js" type="text/javascript"></script>
    </head>
    <body>      
        <div id="button-div">
            <button id="test-btn">
                Click Me
            </button>
        </div>
        <script>
            $('#test-btn').click(function (){
                $('#button-div').append("<div>This is sample text</div>");
            });
        </script>
    </body>
</html>

Actualy我想要一些元素添加html网页并将新添加的元素保存到数据库。

然后我用Jquery收集内容，它们显示空洞的结果。这是真正的问题。

Answer 1

您必须使用DOM检查器。查看页面源只会加载静态HTML，因为您的javascript执行添加了动态HTML，它不会以这种方式显示。

Answer 2

您的元素不会出现在源代码中。您可以看到使用元素检查器时发生的情况。在Windows上的Chrome中，您可以在mac osx上使用F12键或cmd + alt + i进行显示。

Answer 3

页面源只显示页面加载时添加的html，通过javascript或jquery页面加载后添加的html可以使用Firebug Inspect或chrome检查器查看。

使用jQuery append（）添加html元素后页面源问题

3 个答案: