js按字符串顺序重新排序DOM节点廖雪峰js练习题
对于⼀个已有的HTML结构：
1. Haskell
2. JavaScript
3. Python
4. Ruby
5. Scheme
<!--HTML结构-->
<ol id="test-list">
<li class="lang">Scheme</li>
<li class="lang">JavaScript</li>
<li class="lang">Python</li>
<li class="lang">Ruby</li>
<li class="lang">Haskell</li>
</ol>
按字符串顺序重新排序DOM节点：
'use strict';
// sort list:
//获取⽗节点
var list =ElementById("test-list");
var arr =[];
// console.log(list);
/
/将⽗节点的孩⼦放进array数组中，js中数组元素的类型可以任意，这⾥数组元素类型为DOM节点
for(let i =0; i < list.children.length; i++){
arr.push(list.children[i]);
}
// console.log(arr);
//利⽤⾼阶函数sort()对数组排序，排序规则⾃定义⼀个函数传给sort
//题⽬要求根据节点的⽂本内容按照字符串顺序排序
arr.sort(function(x, y){
if(x.innerText > y.innerText){
return1;
}else if(x.innerText < y.innerText){
return-1;
}else{
return0;
}
});
// console.log(arr);
//将节点添插⼊⽗节点的中
// 因为我们插⼊的js节点已经存在于当前的⽂档树，因此这个节点⾸先会从原先的位置删除，再插⼊到新的位置。
for(let i =0; i < arr.length; i++){
list.appendChild(arr[i]);
}
结果
1. Haskell
2. JavaScript
3. Python
4. Ruby
5. Scheme
sort函数 js
<ol id="test-list>
<li class="lang">Haskell</li>
<li class="lang">JavaScript</li> <li class="lang">Python</li>
<li class="lang">Ruby</li>
<li class="lang">Scheme</li> </ol>

版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。