Javascript 动态表行在DOM中的显示顺序不正确 成功：功能（数据、状态）{ var头=$（“#MainDiv”）； html（null）； var headertemplate=$（“名称”）； header.append（headertemplate）； $。每个（数据、函数（）{ 变量模板=$（“”）； template.find（'span.searchListTitle'）.attr（'title'，this.title）； //将模板添加到集合中 header.append（模板）； }); 标题。附加（“”）； },

现在，当我试图在表上设置边框时，我注意到它只在th标记上应用边框，即Header（Name）

在firebug中进一步调试时，我看到DOM序列是这种格式的
名称
试验
试验
试验
试验
试验

---

有人能告诉我为什么在附加所有for循环行之前要关闭表……这是一个AJAX调用

您不能向dom中添加分段元素。所以，您将一个表添加到标题中，然后将行附加到表中

 Debugging further in fire bug I saw that the DOM sequence is in this format
        <table class='searchlistbody'><tr><th>Name</th></tr></table>
        <tr> <td class='campnameAltrow'>Test</td></tr>
        <tr> <td class='campnameAltrow'>Test</td></tr>
        <tr> <td class='campnameAltrow'>Test</td></tr>
        <tr> <td class='campnameAltrow'>Test</td></tr>
        <tr> <td class='campnameAltrow'>Test</td></tr>

成功：功能（数据、状态）{
var头=$（“#MainDiv”）；
html（null）；
var headertemplate=$（“名称”）；
header.append（headertemplate）；
$。每个（数据、函数（）{
变量模板=$（“”）；
template.find（'span.searchListTitle'）.attr（'title'，this.title）；
//将模板添加到集合中
headertemplate.append（模板）；
});
},

从append函数的文档判断：它实际上尝试使用适当的DOM元素

不要尝试将其用作字符串连接操作

相反，请尝试创建表元素并将TH和TRs分别附加到其中：

 success: function (data, status) {
            var header = $("#MainDiv");

            header.html(null);
            var headertemplate = $("<table class='searchlistbody'><tr></th><th>Name</th></tr></table>");
            header.append(headertemplate);

            $.each(data, function () {
                var template = $("<tr> <td class='campnameAltrow'><span class='searchListTitle'></span></td></tr>");

                        template.find('span.searchListTitle').attr('title', this.Title);

                // add the template to the collection
                headertemplate.append(template);
            });
        },

var表=$（“”）
表.追加（“…”）
$.each（函数（）{
...
表.追加（“…”）
...
})

操纵DOM有非常不一致的行为，，，，你能给我指一些好文章或任何能帮助我更好地学习的书吗@穆萨

 success: function (data, status) {
            var header = $("#MainDiv");

            header.html(null);
            var headertemplate = $("<table class='searchlistbody'><tr></th><th>Name</th></tr></table>");
            header.append(headertemplate);

            $.each(data, function () {
                var template = $("<tr> <td class='campnameAltrow'><span class='searchListTitle'></span></td></tr>");

                        template.find('span.searchListTitle').attr('title', this.Title);

                // add the template to the collection
                headertemplate.append(template);
            });
        },

var table = $("<table ...></table>")
table.append("<th>...</th>")
$.each(function() {
  ...
  table.append("<tr>...</tr>")
  ...
})