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. 有关于web server架构的一个小疑问

    今天闲的时候trace route了yahoo和sina的域名,yahoo的如下: 1     1 ms     1 ms    <1 ms  172.21.127.1   2     3 ms ...

  2. 获取Jenkins project build结果

    当Jenkins管理的build project越来越多的时候,须要脚本收集每一个project的近期一次build结果,从而集中管理.依据业务规则,决定是否重算和何时重算. 以下的命令是利用curl ...

  3. ORACLE:plsql优化

      1.登录后默认自动选中My Objects? 设置方法:Tools菜单--Brower Filters会打开Brower Filters的定单窗口,把“My Objects”设为默认即可.? 同理 ...

  4. 真实世界里的钢铁侠-特斯拉汽车创始人埃隆&#183;马斯克(Elon Musk)

    真实世界里的钢铁侠--特斯拉汽车公司和SpaceX公司总裁马斯克(31岁).当我们得意于「站在山上踢几块石头下去」或是「站在风口上的猪」的成功理论的时候,我们真的成功了吗?我们到底创造了什么?改变了什 ...

  5. 点滴的积累---J2SE学习小结

    点滴的积累---J2SE学习小结 什么是J2SE J2SE就是Java2的标准版,主要用于桌面应用软件的编程:包括那些构成Java语言核心的类.比方:数据库连接.接口定义.输入/输出.网络编程. 学习 ...

  6. 一张图总结Google C++编程规范(Google C++ Style Guide)

    Google C++ Style Guide是一份不错的C++编码指南,我制作了一张比較全面的说明图,能够在短时间内高速掌握规范的重点内容.只是规范毕竟是人定的,记得活学活用.看图前别忘了阅读以下三条 ...

  7. 那些年踩过的坑之:first-child伪类选择器

    原文:那些年踩过的坑之:first-child伪类选择器 :first-child 选择器用于选取属于其父元素的首个子元素的指定选择器.——w3school 嗯,乍一看好像说的不是很明白,因此这个选择 ...

  8. IIS7 配置 PHP5.5

    本文环境: 操作系统:Win7(x64) 中文专业版 PHP       :V5.5 首先添加IIS. 控制面板-〉程序-〉打开或关闭Windows功能 1. 勾选“Internet 信息服务”   ...

  9. jquery下php与ajax的数据交换方式

    参考链接:http://www.php100.com/html/webkaifa/PHP/PHPyingyong/2013/0122/11971.html 一.前台传递字符串变量,后台返回字符串变量( ...

  10. hunnu-11546--Sum of f(x)

    Sum of f(x) Time Limit: 1000ms, Special Time Limit:2500ms, Memory Limit:32768KB Total submit users:  ...