<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>选项卡-vue</title>

   <link rel="stylesheet" type="text/css" href="public.css">

</head>

<body>

<div id='app'>

    <ul >

        <li data-i='0'>0</li>

        <li data-i='1'>1</li>

        <li data-i='3'>3</li>

        <li data-i='5'>5</li>

    </ul>

</div>

<script type="text/javascript" src="vue2.js"></script>

<script type="text/javascript">

var lis = document.querySelectorAll('ul li');

var lis = Array.prototype.slice.call(lis);

lis.sort(function(a,b){

     //return a.getAttribute("data-i")-b.getAttribute("data-i");

    // 根据data-i进行降序排序

      return b.dataset.i-a.dataset.i;

})

var ul =  document.querySelector('ul');

ul.innerHTML='';

for(var i=0;i<lis.length;i++){

    ul.appendChild(lis[i]);

}

</script>

</body>

</html>

js 根据data-i 降序排列的更多相关文章

  1. js学习篇--数组按升序降序排列

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  2. 转<<C#集合Dictionary中按值的降序排列

    转载地址:http://blog.sina.com.cn/s/blog_5c5bc9070100pped.html C#集合Dictionary中按值的降序排列 static void Main(st ...

  3. MSSQL 随机查询且降序排列

    --随机查询且降序排列 * FROM dbo.COMPANY_USER_INFO ORDER BY NEWID()) AS T ORDER BY T.cu_id DESC

  4. Shell练习 统计单词个数，降序排列

    原文:https://leetcode.com/problems/word-frequency/ Write a bash script to calculate the frequency of e ...

  5. Linux显示按文件大小降序排列

    Linux显示按文件大小降序排列 youhaidong@youhaidong-ThinkPad-Edge-E545:~$ ls -ls 总用量 56 12 -rw-r--r-- 1 youhaidon ...

  6. python小练习： 给定一个数组 按重复次数 降序排列输出 数组非空且为正整数

    假设有个列表  a=[1,1,1,2,2,4,5,5,5,5] (非空且为正整数) 那么根据要求 最终输出的形式为  5,1,2,4  (按重复次数 降序排列输出) 代码实现及解释: a=[1,1,1 ...

  7. 给定一个只包含正整数的非空数组,返回该数组中重复次数最多的前N个数字 ,返回的结果按重复次数从多到少降序排列(N不存在取值非法的情况)

    """ #给定一个只包含正整数的非空数组,返回该数组中重复次数最多的前N个数字 #返回的结果按重复次数从多到少降序排列(N不存在取值非法的情况) 解题思路: 1.设定一个 ...

  8. ANY 和 IN 查询价格大于或等于"超级本"价格的商品，并且按价格降序排列

    -- 查询价格大于或等于"超级本"价格的商品,并且按价格降序排列 //ANY用法 //与比较操作符联合使用,表示与子查询返回的任何值比较为 TRUE ,则返回 TRUE //简单案 ...

  9. 笔记:mysql升序排列asc，降序排列desc

    经常会忘记mysql中升序和降序用什么字符来表示,现在就做个笔记:升序排列asc,降序排列desc,举个例子,下面是按时间降序调用栏目的文章,也即是栏目最新文章 [e:loop={"sele ...

  10. mapreduce程序的按照key值从大到小降序排列

    在近期的Hadoop的学习中,在学习mapreduce时遇到问题:让求所给数据的top10,们我们指导mapreduce中是有默认的排列机制的,是按照key的升序从大到小排列的 然而top10问题的求 ...

随机推荐

  1. 查看war包编译时使用的jdk版本

    第一种方式:找到war包的其中一个class文件,用UE打开,看第一行 34(对应十进制的50):JDK1.8 33(对应十进制的50):JDK1.7 32(对应十进制的50):JDK1.6 31(对 ...

  2. mysql之路4

    MYSQL之约束 2.主键约束 349行cnname换成cname

  3. Android开发模拟器（虚拟机）的连接等操作

    前10天一直在解决android开发环境的问题,我将Androidstudio下载并安装好之后,进入IDE之后,下载AVDmanger中的虚拟机以及SDK等等.之后发现并不能运行虚拟机,根本无法打开虚 ...

  4. webpack4.41.0配置三（插件minCssExtract/ DefinePlugin/Html）

    (注:如无特殊说明这里的配置文件都指的是webpack.config.js) minCssExtract 我们通常期望js和js文件一起,css和css文件一起.该插件将CSS提取到单独的文件中.它为 ...

  5. H5实现查看图片和删除图片的效果

    在最近的项目中,H5需要实现查看图片和删除图片的效果,总结如下: 一.查看图片 查看图片使用weui的gallery.首先添加gallery的html,然后隐藏. <div class=&quo ...

  6. linux备忘命令

    1,安装vim以后把vim中的tab键设置为4个空格 vim ~/.vimrc一下,如果没有会创建新的, 然后添加下面两行: set ts=4 set expandtab 如果第二行内容是noexpa ...

  7. 普及C组第四题（8.9）

    2298. [noip普及组2T4]异或 (File IO): input:gcdxor.in output:gcdxor.out 题目描述 SarvaTathagata是个神仙,一天他在研究数论时, ...

  8. 线性筛-euler，强大O(n)

    欧拉函数是少于或等于n的数中与n互质的数的数目 φ(1)=1(定义) 类似与莫比乌斯函数,基于欧拉函数的积性 φ(xy)=φ(x)φ(y) 由唯一分解定理展开显然,得证 精髓在于对于积性的应用: ){ ...

  9. C# 将DataGridView中显示的数据导出到Excel(.xls和.xlsx格式)—NPOI

    前言 https://blog.csdn.net/IT_xiao_guang_guang/article/details/104217491  本地数据库表中有46785条数据,测试正常  初次运行程 ...

  10. 主席树+二分 p4602

    题意:给出每一种果汁的美味度,价格,升数: m个询问,每个询问给出最高上限的钱g,以及给出最少的w 意思是,最多用g的钱去买最少l的果汁,问能得到的最大美味度: 美味度是取所有果汁中美味度的最小值: ...