javascript中li标签的排序和数组sort的用法

转：

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<title></title>

<script type="text/javascript">

window.onload = function () {

var oBtn = document.getElementById("btnChange");

var oUl1 = document.getElementById("ul1");

oBtn.onclick = function () {

var aLi = oUl1.getElementsByTagName("li");

var arr = [];

for (var i = 0; i < aLi.length; i++) {

arr[i] = aLi[i];

}

arr.sort(function (li1, li2) {

var n1 = parseInt(li1.innerText);

var n2 = parseInt(li2.innerText);

return n1 - n2;

});

for (var i = 0; i < aLi.length; i++) {

oUl1.appendChild(arr[i]);

}

</script>

</head>

<body>

<input type="button" name="" value="移动" id="btnChange" />

<ul id="ul1">

<li>5</li>

<li>2</li>

<li>9</li>

<li>4</li>

<li>7</li>

</ul>

</body>

</html>

原文地址：https://www.cnblogs.com/libin6505/p/10237676.html

时间： 2024-09-30 09:44:58

javascript中li标签的排序和数组sort的用法的相关文章

Jquery和JS获取ul中li标签

js 获取元素下面所有的li var content=document.getElementById("content"); var items=content.getElementsByTagName("ul"); var itemss=items[2].getElementsByTagName("li");//获取第二个li标签或 var div=document.getElementById('a'); var ul=div.childN

javascript 中isPrototypeOf 、hasOwnProperty、constructor、prototype等用法

hasOwnProperty:是用来判断一个对象是否有你给出名称的属性或对象,此方法无法检查该对象的原型链中是否具有该属性,该属性必须是对象本身的一个成员. isPrototypeOf是用来判断要检查其原型链的对象是否存在于指定对象实例中,是则返回true,否则返回false. instanceof 操作检查对象中是否有名为 property 的属性.也可以检查对象的原型,判断该属性是否为原型链的一部分. Java代码 hasOwnProperty: var obj = {a:1,b:2}

JavaScript中的内置对象（数组、Boolean、Number、字符串）和自定义对象

JS中常用的内置对象有:数组.Boolean类.Number类.字符串.下面分别介绍各自的常用方法 JS中的数组 1.数组的声明 ①字面量声明直接使用[]声明数组: var arr=[1,2,"3",true,null,undefined]; 在JS中同一数组可以存放各种数据类型. ②使用new关键字声明:var arr = new Array(); 参数可以有三种形式: >>> 不传参数,表示创建一个长度为0的空数组: >>> 传入一个数值,表示

javascript 中 split 函数分割字符串成数组

分割字符串成数组的方法有很多,不过使用最多的还是split函数 <script language="javascript"> str="2,2,3,5,6,6"; //这是一字符串 var strs= new Array(); //定义一数组 strs=str.split(","); //字符分割 for (i=0;i<strs.length ;i++ ) { document.write(strs[i]+"<b

<UL>中<li>标签前编号图片的简单调用

javascript中的innerHTML是什么意思，怎么个用法？

innerHTML在JS是双向功能:获取对象的内容或向对象插入内容:如:<div id="aa">这是内容</div> ,我们可以通过 document.getElementById('aa').innerHTML 来获取id为aa的对象的内嵌内容:也可以对某对象插入内容,如 document.getElementById('abc').innerHTML='这是被插入的内容'; 这样就能向id为abc的对象插入内容对于innerHTML 属性,几乎所有的

JavaScript中十种一步拷贝数组的方法

JavaScript中我们经常会遇到拷贝数组的场景,但是都有哪些方式能够来实现呢,我们不妨来梳理一下. 1.扩展运算符(浅拷贝) 自从ES6出现以来,这已经成为最流行的方法.它是一个很简单的语法,但是当你在使用类似于React和Redux这类库时,你会发现它是非常非常有用的. numbers = [1, 2, 3]; numbersCopy = [...numbers]; 这个方法不能有效的拷贝多维数组.数组/对象值的拷贝是通过引用而不是值复制. // ?? numbersCopy.push(4

javascript中的数组排序——sort()方法

在JavaScript中的Array对象提供了一个sort()方法用于对数组中的元素进行排序. sort()方法简介 JavaScript中数组的sort()方法主要用于对数组的元素进行排序.其中,sort()方法有一个可选参数.但是,此参数必须是函数. 数组在调用sort()方法时,如果没有传参将按字母顺序(字符编码顺序)对数组中的元素进行排序,如果想按照其他标准进行排序,就需要进行传一个参数且为函数,该函数要比较两个值,并且会返回一个用于说明这两个值的相对顺序的数字. Array.sort(

转---深入浅出妙用 Javascript 中 apply、call、bind

作者:伯乐在线专栏作者 - chokcoco 如有好文章投稿,请点击 → 这里了解详情如需转载,发送「转载」二字查看说明这篇文章实在是很难下笔,因为网上相关文章不胜枚举. 巧合的是前些天看到阮老师的一篇文章的一句话: "对我来说,博客首先是一种知识管理工具,其次才是传播工具.我的技术文章,主要用来整理我还不懂的知识.我只写那些我还没有完全掌握的东西,那些我精通的东西,往往没有动力写.炫耀从来不是我的动机,好奇才是." 对于这句话,不能赞同更多,也让我下决心好好写这篇,网上文章虽多,