js,jQuery 排序的实现:

重点: 想要实现排序,最简单的方法就是

  1. 先把标签用jQuery读进对象数组
  2. 用js排序好对象数组 (针对对象数组进行排序, 不要试图直接对网页的内容进行直接更改)
  3. 用对象数组内容覆盖网页上的标签数组;
//排序从文字短的到长的
var arr_a=new Array();
var i=0;
$(".type_list_txt > span:contains('T恤')").parent().children("a").each(function(){
arr_a[i]=$(this).clone();
i++;
});
for(i=0; i<arr_a.length;i++){
for(j=i+1;j<arr_a.length;j++){
if($(arr_a[i]).text().length > $(arr_a[j]).text().length ){
temp=arr_a[i];
arr_a[i]=arr_a[j];
arr_a[j]=temp;
}
}
}
i=0;
$(".type_list_txt > span:contains('T恤')").parent().children("a").each(function(){
$(this).replaceWith($(arr_a[i]));
i++;
});

原文地址:http://www.cnblogs.com/henw/archive/2011/04/26/2029474.html

参照原文,我写了自己的排序,原文的是简单的选择排序,我的是冒泡排序。

function doOrder(){
//#orderCom为页面上的按钮
var type = $("#orderCom").attr("type");
console.log(type);
var flelems = new Array();
var fi = 0;
//globalFl为全局变量,逐个获取元素
$("#detail"+globalFl).children().each(function(){
flelems[fi] = $(this).clone();
fi++;
});
if(type=="asc"){
//asc排序
for(var i=0;i<flelems.length-1;i++){
for(var j=0;j<flelems.length-i-1;j++){
if(parseFloat($(flelems[j]).attr('cval'))>parseFloat($(flelems[j+1]).attr('cval'))){
var ele = flelems[j];
flelems[j] = flelems[j+1];
flelems[j+1] = ele;
}
}
}
$("#orderCom").attr("type","desc");
$("#orderCom").text("积分↓");
}else{
//desc排序
for(var i=0;i<flelems.length-1;i++){
for(var j=0;j<flelems.length-i-1;j++){
if(parseFloat($(flelems[j]).attr('cval'))<parseFloat($(flelems[j+1]).attr('cval'))){
var ele = flelems[j];
flelems[j] = flelems[j+1];
flelems[j+1] = ele;
}
}
}
$("#orderCom").attr("type","asc");
$("#orderCom").text("积分↑");
}
fi = 0;
//把排序好的html写入
$("#detail"+globalFl).children().each(function(){
$(this).replaceWith($(flelems[fi]));
fi++;
});
}

转:js,jQuery 排序的实现,网页标签排序的实现,标签排序的更多相关文章

  1. [JS]jQuery,javascript获得网页的高度和宽度

    [JS]jQuery,javascript获得网页的高度和宽度网页可见区域宽: document.body.clientWidth 网页可见区域高: document.body.clientHeigh ...

  2. 标签页(tab)切换的原生js,jquery和bootstrap实现

    概述 这是我在学习课程Tab选项卡切换效果时做的总结和练手. 原课程中只有原生js实现,jquery和bootstrap实现是我自己补上的. 本节内容 标签页(tab)切换的原生js实现 标签页(ta ...

  3. js/jquery/html前端开发常用到代码片段

    1.IE条件注释 条件注释简介 IE中的条件注释(Conditional comments)对IE的版本和IE非IE有优秀的区分能力,是WEB设计中常用的hack方法.条件注释只能用于IE5以上,IE ...

  4. js,jquery,css,html5特效

    包含js,jquery,css,html5特效,源代码 本文地址:http://www.cnblogs.com/roucheng/p/texiao.html 2017新年快乐特效 jQuery最新最全 ...

  5. Web基础 HTML CSS JS JQuery AJAX

    1. Web基础 网页的骨骼HTML 什么是HTML超文本标记语言:Hyper Text Markup Language 这都不重要,重要的是:HTML是Web网页的基本组成部分HTML中定义的元素, ...

  6. JS jquery ajax 已看1 有用

    4.form中的input可以设置为readonly和disable,请问2者有什么区别? readonly不可编辑,但可以选择和复制:值可以传递到后台 disabled不能编辑,不能复制,不能选择: ...

  7. js jquery 选择器总结

    js jquery 选择器总结 一.原始JS选择器. id选择器:document.getElementById("test"); name选择器:document.getElem ...

  8. 分享:计算机图形学期末作业!!利用WebGL的第三方库three.js写一个简单的网页版“我的世界小游戏”

    这几天一直在忙着期末考试,所以一直没有更新我的博客,今天刚把我的期末作业完成了,心情澎湃,所以晚上不管怎么样,我也要写一篇博客纪念一下我上课都没有听,还是通过强大的度娘完成了我的作业的经历.(当然作业 ...

  9. js jquery, jquery-ui 获取form各种表单input的值?

    如何获取? make up (for): 弥补, 补偿, her beaty cannot make up for her stu'pidity. five Basic laws of human s ...

随机推荐

  1. [TPYBoard-Micropython之会python就能做硬件 5] 学习使用重力传感器及PWM

    转载请注明:@小五义 http://www.cnblogs.com/xiaowuyi            欢迎加入讨论群 64770604 一.实验器材 1.TPYboard V102板  一块 2 ...

  2. GDOI2015 解题报告

    首先嘛现在发现题目这么水我还啥都没想出来正是呵呵了.接下来就口胡下GDOI的题解吧 PS:代码什么的要请联系我 题目:快戳我 Day1: T1:这个嘛,可以先找到起点所能到达的每个点然后判断该点能否到 ...

  3. JavaScript中数组Array方法详解

    ECMAScript 3在Array.prototype中定义了一些很有用的操作数组的函数,这意味着这些函数作为任何数组的方法都是可用的. 1.Array.join()方法 Array.join()方 ...

  4. PHP结合memcacheq消息队列解决并发问题

    在处理业务逻辑时有可能遇到高并发问题,例如商城秒杀.微博评论等.如果不做任何措施可能在高瞬间造成服务器瘫痪,如何解决这个问题呢?队列是个不错的选择.队列(Queue)又称先进先出(First In F ...

  5. mysql 常用命令集锦

    Mysql安装目录数据库目录/var/lib/mysql/配置文件/usr/share/mysql(mysql.server命令及配置文件)相关命令/usr/bin(mysqladmin mysqld ...

  6. java 抽象(abstract) 构造 静态(static) 总结--2017-03-02

    抽象类:不能实例化!子类继承抽象类, 实例化子类对象才可以调用, 多态的体现; 抽象方法:必须被重写才能被调用; 静态方法:类名直接调用,或者实例化对象调用; 构造方法:new后面的括号里面带参数,就 ...

  7. Spark性能优化之道——解决Spark数据倾斜(Data Skew)的N种姿势

    原创文章,同步首发自作者个人博客转载请务必在文章开头处注明出处. 摘要 本文结合实例详细阐明了Spark数据倾斜的几种场景以及对应的解决方案,包括避免数据源倾斜,调整并行度,使用自定义Partitio ...

  8. 五金配件行业ERP解决方案

    五金行业信息化需求分析 “国内竞争国际化,国际竞争国内化”将是近几年我国五金行业发展的特点,中国作为全球五金制造中心的地位将进一步稳固.随着中国融入全球经济环境进程的加快以及经济实力的快速崛起,中国已 ...

  9. if(){}else 语句的正确写法以及它的嵌套使用

    if(一个返回bool值的条件表达式) { 程序块 } else{} 它的执行过程我们可以通过一个程序来了解 static void Main(string[] args) { ) // 条件1 { ...

  10. 赵本山 教你如何在实战项目中使用WCF

    我们都知道调用WCF直接在Service References中引用可以远程调用的WCF Url就行了. 但是我们想过没,在Development环境中可以这样做,但是QA.UAT.Productio ...