我正在尝试根据<dt>while 移动时的链接内的值对以下内容进行排序，<dd>并使用它对以下DOM 元素进行排序。
样本：
<div class="courseTree">
<dt><input class="dept_checkbox" type="checkbox"><a href="">BBBB</a></dt>
<dd class="options">
<li>COURSE_BBB-AAA</li>
<li>COURSE_BBB-CCC</li>
</dd>
<dt><input class="dept_checkbox" type="checkbox"><a href="">AAAA</a></dt>
<dd class="options">
<li>COURSE_AAA-AAA</li>
<li>COURSE_AAA-CCC</li>
</dd>
</div>
我正在尝试做的事情：
<div class="courseTree">
<dt><input class="dept_checkbox" type="checkbox"><a href="">AAAA</a></dt>
<dd class="options">
<li>COURSE_AAA-AAA</li>
<li>COURSE_AAA-CCC</li>
</dd>
<dt><input class="dept_checkbox" type="checkbox"><a href="">BBBB</a></dt>
<dd class="options">
<li>COURSE_BBB-AAA</li>
<li>COURSE_BBB-CCC</li>
</dd>
</div>
我尝试了以下但没有运气。
var dl = $(".courseTree");
$(dl).children('dt').each(function() {
$(this).append($(this).next());
});
var sortedItems = $(dl).children('dt').sort();
$.each(sortedItems, function(i, dt) {
$(dl).append(dt);
$(dt).children('dd').each(function(j, dd) {
$(dl).append($(dd));
});
});
您可以将它们添加到数组中，然后对其进行排序。
arr = [];
$(".container").each(function () {
arr.push($(this).detach());
});
arr.sort(function(a,b) {
return a.find("a:first").html() > b.find("a:first").html()
});
for (var i = 0; i < arr.length; i++) {
$(".courseTree").append(arr[i][0].outerHTML);
}<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="courseTree">
<div class="container">
<dt><input class="dept_checkbox" type="checkbox"><a href="">BBBB</a></dt>
<dd class="options">
<li>COURSE_BBB-AAA</li>
<li>COURSE_BBB-CCC</li>
</dd>
</div>
<div class="container">
<dt><input class="dept_checkbox" type="checkbox"><a href="">AAAA</a></dt>
<dd class="options">
<li>COURSE_AAA-AAA</li>
<li>COURSE_AAA-CCC</li>
</dd>
</div>
</div>本文收集自互联网，转载请注明来源。
如有侵权，请联系 [email protected] 删除。
我来说两句