转: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 ...
随机推荐
- Javascript基本概念(一)
JavaScript基本语法: ECMAScript的语法大量借鉴了C以及其他类C语言的语法. ECMAScript中的一切(变量.函数名.操作符)都区分大小写. 标识符: 含义:指变量.函数.属性的 ...
- JavaWeb验证码的使用
在Java Web开发中,我们经常需要使用到验证码功能,一般情况下,我们可以将产生的验证码保存到服务器端中的session中,这种方式中,是使用服务器来保证验证码的功能.另外,我们也可以采用js产生验 ...
- PKUSC2015总结
突然发现这是自己第100篇博客...写下总结庆祝一下好啦 首先就是..D类狗果真没人权啊啊啊.考的辛辛苦苦结果因为D类拿不到一个好协议真的是哭瞎辣QAQ 然后就是..自己真的是太弱啊啊啊..各种傻逼题 ...
- JMeter使用简单教程
去Apache JMeter官网下载最新的Windows下的zip安装包并解压 进入JMeter安装目录下的bin目录,双击jmeter.bat,运行JMeter程序 打开测试计划主界 ...
- VFL(Visual Format Language)语言
VFL的使用 使用VFL来创建约束数组: +(NSArray *)constraintsWithVisualFormat:(NSString *)format options:(NSLayoutFor ...
- 使用GDI绘制一条直线
这个是绘制一条直线的代码 private void Form1_Load(object sender, EventArgs e) { //一根笔 颜色 一张纸 ...
- [干货来袭]C#7.0新特性(VS2017可用)
前言 微软昨天发布了新的VS 2017 ..随之而来的还有很多很多东西... .NET新版本 ASP.NET新版本...等等..太多..实在没消化.. 分享一下其实2016年12月就已经公布了的C#7 ...
- Json数据解析在Unity3d中的应用
最近做项目过程中因为Json文件名写错了一个字母Unity报错,找错误找到半夜,当时为了验错,写了一个小Demo,正好借此总结一下Json. 1.什么是Json JSON(JavaScript Obj ...
- OpenStack/devstack with Neutron on Ubuntu 14 (1)
安装前,推荐安装一个全新的Ubuntu Server14.04,如果使用之前的ubuntu, 中间可能遇到各种的python包依赖,以及软件版本不对应的问题 环境准备,新建stack用户,给予sudo ...
- Docker存储驱动之总览
简介 本文会介绍Docker存储驱动的特性,别列出现在已经支持的存储驱动,最后,会介绍如果选型适合你的存储驱动. 可插拔的存储驱动架构 Docker的存储驱动架构是可插拔的,可以让你很方便的将适合你环 ...