<!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. sql查询——子查询

    -- 子查询 -- 一句查询语句内,再套一句查询语句 ,叫子查询 -- 查询班级类身高最高的人的名字 select name from students where high=(select max( ...

  2. mssql 数据库 基本知识

    数据库中禁用/启用标识列的自增长 SET IDENTITY_INSERT [ database_name . [ schema_name ] . ] table { ON | OFF } 恢复数据时要 ...

  3. 1015 Reversible Primes

    1. 题目 2. 抽象建模 无 3. 方法 无 4. 注意点 素数判断(1不是素数) 数值的倒转 5. 代码 #include<stdio.h> #include<math.h> ...

  4. Apache Kafka（十）Partitions与Replication Factor 调整准则

    Partitions与Replication Factor调整准则 Partition 数目与Replication Factor是在创建一个topic时非常重要的两个参数,这两个参数的取值会直接影响 ...

  5. Apache Kafka（一）- Kakfa 简介与术语

    Apache Kafka 1. Kafka简介.优势.以及使用场景 Kafka的优势: 开源 分布式,弹性架构,fault tolerant 水平扩展: 可以扩展到100个brokers 可以扩展到每 ...

  6. 第七章 类（class）7.1 笔记

    最好不要把对象的定义和类的定义放在一起,这么做无异于把两种不同实体的定义混在了一条语句里,一会定义类,一会又定义变量,显然这是一种不被建议的行为. 类的定义最后要加上分号(:) 成员函数的声明必须放在 ...

  7. DSP---TI CCSv5.5.x-Windows安装

    TI CCSv5.5.x(正式版)-Windows版本 国内2013年9月13日首发安装CCSv5.5图示 *请关掉防火墙及杀毒软件进行安装 第一步 第二步 安装程序检测到挂起的重新启动,这可能在安装 ...

  8. chrome firefox浏览器屏蔽百度热搜

    我是原文 操作 点击拦截元素,然后选择页面元素,添加

  9. SpringBoot图文教程4—SpringBoot 实现文件上传下载

    有天上飞的概念,就要有落地的实现 概念+代码实现是本文的特点,教程将涵盖完整的图文教程,代码案例 文章结尾配套自测面试题,学完技术自我测试更扎实 概念十遍不如代码一遍,朋友,希望你把文中所有的代码案例 ...

  10. vue后台模板推荐

    1.vue+iview后台管理模板 https://github.com/iview/iview-admin 2.vue+element 后台管理模板 https://github.com/PanJi ...