html

<ul id="ul1">
<li>9</li>
<li>2</li>
<li>7</li>
<li>4</li>
<li>11</li>
</ul> <input type="button" value="排序" id="btn1" />
思路:
1,将li集合插入一个数组里
2,对数组进行排序
3,将排序后的数组appendChild那个ul里 说明:
appendChild的用法,见
http://www.cnblogs.com/huaci/p/3823031.html li集合,它并不等同于数组,所以也没有sort方法 js代码 window.onload = function(){
var oUl = document.getElementById("ul1");
var oBtn = document.getElementById("btn1"); oBtn.onclick = function(){
var arr = [];
for(var i=0; i<oUl.children.length; i++){
arr.push(oUl.children[i]);
} arr.sort(function(li1,li2){
var n1 = parseInt(li1.innerHTML);
var n2 = parseInt(li2.innerHTML);
return n1-n2;
}); for(var i=0; i<arr.length; i++){
oUl.appendChild(arr[i]);
} } }

li排序的更多相关文章

  1. li排序的两种方法

    1.一般做法 <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <ti ...

  2. JS实现ul,li排序效果

    <!DOCTYPE html> <html> <head> <title>js列表排序</title> <meta charset=& ...

  3. python入门之排序,文件操作

    排序 li.sort() 对li列表从小到大排序,直接更新li列表 sorted(li) 返回一个li排序后的列表,并非直接对li作更新 列表元素必须是同一种数据类型 文件操作 打开文件: f = o ...

  4. 常用的-->查找算法与排序算法

    顺序查找 从列表第一个元素开始,顺序进行搜索,直到找到为止. 二分查找 从有序列表的候选区data[0:n]开始,通过对待查找的值与候选区中间值的比较,可以使候选区减少一半. li = [1, 2, ...

  5. React的井字过三关(2)

    这篇笔记是官方教程的延续笔记,所有代码基于第一篇笔记的结尾代码.旨在解决教程后面提出的五个问题. 一 . 用(X,Y)来取代原有的数字坐标 原来的数字坐标是这样的: 现在的要求是把原来的代码坐标改为二 ...

  6. Python学习【第九篇】函数

    函数 函数是什么? 函数是组织好的,可重复使用的,用来实现单一,或相关联功能的代码段. 在学习函数之前,一直遵循:面向过程编程,即:根据业务逻辑从上而下实现功能,其往往用一段代码来实现指定功能,开发过 ...

  7. JQuery基础总结上

    最近在慕课网学习JQuery基础课程,发现只是跟随网站的课程学习而不去自己总结扩展的话,很难达到真正学会理解的地步. 于是先在网站上草草过了一遍课程,然后借着今天的这个时间边记录边重新整理学习一下. ...

  8. python容器类型:列表,字典,集合等

    容器的概念我是从C++的STL中学到的 什么是容器? 容器是用来存储和组织其他对象的对象. 也就是说容器里面可以放很多东西,这些东西可以是字符串,可以是整数,可以是自定义类型,然后把这些东西有组织的存 ...

  9. JAVA_Collection容器

    因为项目的需要,今天抽时间把JAVA中的容器复习了一下,为了以后的不时之需,现在把它记下来. 容器有其名,知其意,用来盛放数据的集合,JAVA中为我们提供了三种容器类:set.list.map,三种容 ...

随机推荐

  1. iOS 如何创建单例对象

    一.什么是单例? 说到单例我就想起了我的java啊 ,不禁感叹起我的大学时光,学了4年的java开发,到现在还是放弃了我的java,踏入了iOS的行列. 算了,入正轨,我现在正是铁树银花的青春美少女, ...

  2. 方案猿身高project联赛,艺术家,相反,养殖场!-------三笔

    已经看到了程序猿在电影中都是非常厉害的人物,硬道理键盘噼里啪啦后,奇妙的事情会发生. 当我报了这个专业,開始认真的写程序,在这个领域学习的时候,却发现非常多干这一行 的都自称"码农" ...

  3. Matlab---串口操作---数据採集篇

    matlab功能强大,串口操作也非常easy.相信看过下面两个实验你就能掌握咯! 開始吧! 实验1: 从电脑COM2口读取数据.并将数据保存在TXT文件里,方便数据分析,以下是M脚本: %名 称:Ma ...

  4. 基于Grunt的版本号构建系统新手教程

    作者:zhanhailiang 日期:2014-10-12 1. 安装nodejs,npm,grunt-cli.參见<Windows环境下安装nodejs+npm+grunt-cli工具> ...

  5. android关于实现滑动界面

    首先要说的是,滑动界面,我们需要一个以上的view切换,实际上可以使用ArrayList<View> pageViews要保存view信息,然后切换 LayoutInflater infl ...

  6. spring集成 JedisCluster 连接 redis3.0 集群

    最近在公司做了 jedisCluster整合spring 的配置, 分享如下 客户端采用最新的jedis 2.7 1. maven依赖: <dependency> <groupId& ...

  7. SQLServer 复制中移除和加入公布而不初始化全部项目

    -- 若提前"禁止架构更改".新增的列不会自己主动加入大公布.此时应使用 sp_articlecolumn 加入列 EXEC sp_changepublication @publi ...

  8. HTTP协议中的短轮询、长轮询、长连接和短连接

    HTTP协议中的短轮询.长轮询.长连接和短连接 引言 最近刚到公司不到一个月,正处于熟悉项目和源码的阶段,因此最近经常会看一些源码.在研究一个项目的时候,源码里面用到了HTTP的长轮询.由于之前没太接 ...

  9. Java字节流和字符流

    file.txt文本中存储的内容: 好abc 1.字符流处理: package com.wjy.java; import java.io.FileInputStream; import java.io ...

  10. UC高级编程--实现myls程序

    跟着达内视频,学习UC高级编程,完毕程序小练习. 主要练习的函数为:  int lstat(const char *path, struct stat *buf);  size_t strftime( ...