转:js,jQuery 排序的实现,网页标签排序的实现,标签排序
js,jQuery 排序的实现:
重点: 想要实现排序,最简单的方法就是
- 先把标签用jQuery读进对象数组
- 用js排序好对象数组 (针对对象数组进行排序, 不要试图直接对网页的内容进行直接更改)
- 用对象数组内容覆盖网页上的标签数组;
//排序从文字短的到长的
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 排序的实现,网页标签排序的实现,标签排序的更多相关文章
- [JS]jQuery,javascript获得网页的高度和宽度
[JS]jQuery,javascript获得网页的高度和宽度网页可见区域宽: document.body.clientWidth 网页可见区域高: document.body.clientHeigh ...
- 标签页(tab)切换的原生js,jquery和bootstrap实现
概述 这是我在学习课程Tab选项卡切换效果时做的总结和练手. 原课程中只有原生js实现,jquery和bootstrap实现是我自己补上的. 本节内容 标签页(tab)切换的原生js实现 标签页(ta ...
- js/jquery/html前端开发常用到代码片段
1.IE条件注释 条件注释简介 IE中的条件注释(Conditional comments)对IE的版本和IE非IE有优秀的区分能力,是WEB设计中常用的hack方法.条件注释只能用于IE5以上,IE ...
- js,jquery,css,html5特效
包含js,jquery,css,html5特效,源代码 本文地址:http://www.cnblogs.com/roucheng/p/texiao.html 2017新年快乐特效 jQuery最新最全 ...
- Web基础 HTML CSS JS JQuery AJAX
1. Web基础 网页的骨骼HTML 什么是HTML超文本标记语言:Hyper Text Markup Language 这都不重要,重要的是:HTML是Web网页的基本组成部分HTML中定义的元素, ...
- JS jquery ajax 已看1 有用
4.form中的input可以设置为readonly和disable,请问2者有什么区别? readonly不可编辑,但可以选择和复制:值可以传递到后台 disabled不能编辑,不能复制,不能选择: ...
- js jquery 选择器总结
js jquery 选择器总结 一.原始JS选择器. id选择器:document.getElementById("test"); name选择器:document.getElem ...
- 分享:计算机图形学期末作业!!利用WebGL的第三方库three.js写一个简单的网页版“我的世界小游戏”
这几天一直在忙着期末考试,所以一直没有更新我的博客,今天刚把我的期末作业完成了,心情澎湃,所以晚上不管怎么样,我也要写一篇博客纪念一下我上课都没有听,还是通过强大的度娘完成了我的作业的经历.(当然作业 ...
- js jquery, jquery-ui 获取form各种表单input的值?
如何获取? make up (for): 弥补, 补偿, her beaty cannot make up for her stu'pidity. five Basic laws of human s ...
随机推荐
- AngularJS2环境配置
所使用到的文件目录结构如下所示: 1. 创建配置文件: 1.1. 创建目录: mkdir angular-quickstart cd angular-quickstart 1.2. 载入 ...
- php处理登录、添加数据、删除数据和修改数据
php 处理登录 :需要先建一个登录的页面,用form表单就可以很轻松的完成,(这里的示例是我根据数据库现成的表做的 是一个teacher表格 根据老师的工号和姓名登录的) <form acti ...
- 我眼中的JAVA的那些数据结构应用
能沉淀下来的东西,往往都很基础,整理了下JAVA中遇到的数据结构 目录大纲: 到目前接触到的 有几个说明: 可扩容数组 ArrayList 扩容数组的实现, 满了后扩容,扩容在1.5倍,通过copy过 ...
- java(jdk1.7) IO系列01之InputStream和OutputStream解析
1.InputStream和OutputStream简介 在java中InputStream和OutputStream分别代表字节输入流和字节输出流,表示以字节的方式来实现进程或者程序的通信,Inpu ...
- Android 退出多Activity的application的方式
在开发过程中,我们常常需要一个退出功能,来退出该应用的所有Activity.下面,我们列举一些退出应用的几种方式.以下用的源码点击查看源码地址 欢迎star,欢迎fork 利用ActivityCont ...
- python爬虫利器Selenium使用详解
简介: 用pyhon爬取动态页面时普通的urllib2无法实现,例如下面的京东首页,随着滚动条的下拉会加载新的内容,而urllib2就无法抓取这些内容,此时就需要今天的主角selenium. Sele ...
- PCB行业版特色功能展示
普实PCB行业版,专为PCB行业需求而定制.秉承一体化.集团化.移动化为设计理念,采用互联网技术.云计算技术.移动应用技术开发的新一代系统帮助PCB企业创新管理模式.引领商业变革!系统从接到订单开始, ...
- 微信小程序怎样提高应用速度小技巧
作者:vicyao, 腾讯web前端开发 高级工程师商业转载请联系腾讯WeTest获得授权,非商业转载请注明出处. 原文链接:http://wetest.qq.com/lab/view/294.htm ...
- 或许是介绍Android Studio使用Git最详细的文章
欢迎访问我的个人博客转发请注明出处:http://www.wensibo.top/2017/03/12/GitOnAS/ 前言 本文较长,图片很多很多,流量党慎入 使用Git已经有一段时间了,但是之前 ...
- 图形化代码阅读工具——Scitools Understand
Scitools出品的Understand 2.0.用了很多年了,比Source Insight强大很多.以前的名字叫Understand for C/C++,Understand for Java, ...