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++;
});

赞 (0)

相关推荐

  • js,jQuery 排序的实现代码,网页标签排序的实现,标签排序

    js,jQuery 排序的实现: 重点: 想要实现排序,最简单的方法就是 先把标签用jQuery读进对象数组 用js排序好对象数组 (针对对象数组进行排序, 不要试图直接对网页的内容进行直接更改) 用对象数组内容覆盖网页上的标签数组; //排序从文字短的到长的 复制代码 代码如下: //排序从文字短的到长的 var arr_a=new Array(); var i=0; $(".type_list_txt > span:contains('T恤')").parent().chil

  • js实现网页的两个input标签内的数值加减(示例代码)

    js实现网页的两个input标签内的数值加减(示例代码)

    实例如下所示: <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> <script> window.onload=function(){ var oIput1=document.getElementById('put1'); var oIput2=document.getElementById('put2'); var

  • JS+CSS实现自动切换的网页滑动门菜单效果代码

    JS+CSS实现自动切换的网页滑动门菜单效果代码

    本文实例讲述了JS+CSS实现自动切换的网页滑动门菜单效果代码.分享给大家供大家参考.具体如下: 这是一款支持自动切换功能的网页滑动门菜单,JS与CSS结合的技术成果,有人说它是自己会切换的网页选项卡标签面板,QQ登录后弹出的每日要闻迷你窗口中有类似效果,但是代码写法却是截然不同的,每一位作者的思路是不同的,因此您多了一份参考. 运行效果截图如下: 在线演示地址如下: http://demo.jb51.net/js/2015/js-css-auto-cha-tab-menu-style-code

  • 基于jquery的使ListNav兼容中文首字拼音排序的实现代码

    基于jquery的使ListNav兼容中文首字拼音排序的实现代码

    效果图如下所示: 复制代码 代码如下: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title>中

  • JS实现仿Windows7风格的网页右键菜单效果代码

    JS实现仿Windows7风格的网页右键菜单效果代码

    本文实例讲述了JS实现仿Windows7风格的网页右键菜单效果代码.分享给大家供大家参考.具体如下: 这是一款JS仿Windows7风格的网页右键菜单,可以多级展开的右键菜单,原生JS.可参考性强,学习JavaScript的朋友不可错过.本菜单用户体验极佳,兼容性良好,无jQuery. 运行效果截图如下: 在线演示地址如下: http://demo.jb51.net/js/2015/js-win7-style-web-right-menu-codes/ 具体代码如下: <!DOCTYPE htm

  • JS+CSS制作DIV层可(最小化/拖拽/排序)功能实现代码

    复制代码 代码如下: <HTML> <HEAD> <TITLE>JS+CSS制作的DIV层最小化和随意拖拽排序功能</TITLE> <style type="text/css"> body { margin:10px; } #dragHelper { position:absolute;/*重要*/ border:2px dashed #000000; background-color:#FFFFFF; filter: alp

  • jQuery使用load()方法载入另外一个网页文件内的指定标签内容到div标签的方法

    本文实例讲述了jQuery使用load()方法载入另外一个网页文件内的指定标签内容到div标签的方法.分享给大家供大家参考.具体分析如下: jQuery通过load()方法载入另外一个网页文件内的指定标签内容到div标签,如果我们可以加载网页b.html中的id为p1的标签内容到网页a.html的div标签内 <!DOCTYPE html> <html> <head> <script src="js/jquery.min.js"> <

  • Bootstrap jquery.twbsPagination.js动态页码分页实例代码

    Bootstrap jquery.twbsPagination.js动态页码分页实例代码

    Bootstrap风格的分页控件自适应的: 参考网址:分页参考文档 1.风格样式: 2.首先引入js文件jQuery.twbsPagination.js <span style="font-size:14px;"><script type="text/javascript" src="plugins/page/jquery.twbsPagination.js"></script></span> 3.

  • js通过iframe加载外部网页的实现代码

    今天从别的网站看到的,不需要跳转到别的页面直接本域名下调用外部网页.里面用js控制iframe的大小,确实不错. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml&q

  • JS实现完全语义化的网页选项卡效果代码

    JS实现完全语义化的网页选项卡效果代码

    本文实例讲述了JS实现完全语义化的网页选项卡效果代码.分享给大家供大家参考.具体如下: 这是一款完全语义化的JS网页选项卡,包括了两种用法,一种是点击式,另一种是滑动门式,具体用哪一种要根据你自己的需要了,滑动门是在鼠标经过时触发,选项卡则是需要鼠标点击的. 运行效果截图如下: 在线演示地址如下: http://demo.jb51.net/js/2015/js-yyh-web-tab-cha-nav-codes/ 具体代码如下: <!DOCTYPE html PUBLIC "-//W3C/

随机推荐