jQuery DOM 操作在 IE 或 Safari 中不起作用答案

【问题标题】：jQuery DOM manipulation not working in IE or SafarijQuery DOM 操作在 IE 或 Safari 中不起作用
【发布时间】：2014-03-26 05:49:53
【问题描述】：

我遇到了 jQuery 函数 prepend() 和 after() 的问题，它们在 Safari 或 IE 中没有按预期执行。在这两个开发者工具中仍然看不到任何警告。这段代码在 Chrome 和 Firefox 中都能正常运行。

我正在尝试（并成功）完成的是通过 jQuery 对几行进行排序。数组中的第一个元素将作为#tbody 元素的第一个子元素移动，其余元素将依次排序。

var $previousCountry = null;
var group_id = "A";
for (var i = 0; i < countries.length; i++) {
    var $country = $('#trcountry-' + countries[i].id);
    if (i === 0) {
        $('#tbody-' + group_id).prepend($country); //Problem 1
    }
    else {
        $previousCountry.after($country); //Problem 2
    }
    $previousCountry = $country;
}

示例 HTML 代码：

<table>
    <tbody id="tbody-A">
        <tr id="trcountry-3"><td></td></tr> <!-- In fact a lot of td:s -->
        <tr id="trcountry-2"><td></td></tr>
        <tr id="trcountry-1"><td></td></tr>
    </tbody>
</table>

奇怪的是，我能够执行相同的代码 - $('#tbody-A').prepend('#trcountry-1'); - 通过所有四种浏览器的开发者工具，每次都成功。

什么会导致这个问题？

【问题讨论】：

请分享相关的HTML。
@Blazemonger 我编辑了问题。
你从哪里得到group_id？
@MMM 我想你的问题是相关的。 group_id 设置较早，包含一个字母，具体取决于用户选择。但我知道这不是问题的一部分。 group_id 总是给出预期的结果。为了清楚起见，编辑了问题。

标签： javascript jquery cross-browser dom-manipulation

【解决方案1】：

由于您已经在使用 jquery，您可以尝试使用 tablesorter 插件。我经常使用它。您所要做的几乎就是包含插件并进行以下 api 调用：

$(document).ready(function() 
    { 
        $("#myTable").tablesorter(); 
    } 
);

网址：http://tablesorter.com/docs/#Demo

【讨论】：

不错的插件，但它不是我需要的那种解决方案。我不希望客户对表格进行排序，我希望他们预测一些足球比赛的结果，然后让我的脚本根据每支球队获得的分数对表格进行排序。
这应该是评论，而不是答案。

【解决方案2】：

我刚刚想通了。而且我觉得有点惭愧..

问题是我的排序功能没有正确设置，这导致 Safari 和 IE 给了我未排序的数据 - 因此前置是按照与以前完全相同的顺序完成的，导致我假设 DOM操作出错了。

经验教训。

【讨论】：