开发者社区

文档建议反馈控制台

最新优惠活动

文章/答案/技术大牛

发布

如何按2个数据属性对div进行排序？

按照两个数据属性对div进行排序可以通过JavaScript来实现。以下是一个示例代码：

<!DOCTYPE html>
<html>
<head>
  <style>
    .box {
      width: 100px;
      height: 100px;
      border: 1px solid black;
      margin: 5px;
    }
  </style>
</head>
<body>
  <div class="box" data-attr1="3" data-attr2="5">Box 1</div>
  <div class="box" data-attr1="1" data-attr2="2">Box 2</div>
  <div class="box" data-attr1="2" data-attr2="4">Box 3</div>
  <div class="box" data-attr1="4" data-attr2="3">Box 4</div>

  <script>
    var boxes = document.querySelectorAll('.box');
    var sortedBoxes = Array.from(boxes).sort(function(a, b) {
      var attr1A = parseInt(a.getAttribute('data-attr1'));
      var attr1B = parseInt(b.getAttribute('data-attr1'));
      var attr2A = parseInt(a.getAttribute('data-attr2'));
      var attr2B = parseInt(b.getAttribute('data-attr2'));

      if (attr1A === attr1B) {
        return attr2A - attr2B;
      } else {
        return attr1A - attr1B;
      }
    });

    var container = document.body;
    sortedBoxes.forEach(function(box) {
      container.appendChild(box);
    });
  </script>
</body>
</html>

这段代码首先定义了一些带有data-attr1和data-attr2属性的div元素，每个属性都代表一个数据属性。然后使用querySelectorAll方法选择所有的div元素，并将其转换为数组。接下来，使用sort方法对数组进行排序，排序函数首先比较data-attr1属性，如果相等则比较data-attr2属性。最后，使用forEach方法将排序后的div元素依次添加到页面中。

这种方法可以根据两个数据属性对div进行排序，可以根据实际需求进行修改。

相关搜索:Vue js:按属性对单词进行排序使用jquery排序按两个数据属性对元素进行排序使用数据属性和jQuery对div进行排序如何对Ul和Li div数据进行排序如何对自定义数据使用排序对div进行排序如何按姓氏对姓名进行排序如何按字母顺序对div的内容进行排序？如何按对象属性vbscript对字典进行排序如何按对象的枚举属性对Map进行排序如何按属性对HashMap进行排序

相关搜索:

页面内容是否对你有帮助？

有帮助

没帮助

相关·内容

对list中对象按某属性排序

item.setParentId("0271f6d5ffbbf5a3a447e16274b7bfc8"); List children = item.getParent().getChildren(); //根据orderNum对list...中的sdict对象排序 children.sort(Comparator.comparing(SDict::getOrderNum)); 实际上只要一句话children.sort(Comparator.comparing...public int compareTo(TestA o) { return this.age.compareTo(o.getAge()); } } 然后在需要排序的地方...，进行比较排序 Collections.sort(list, new Comparator() { @Override public int...，进行比较排序 Collections.sort(list, new Comparator() { @Override public int

3.7K3 0

使用 Python 按行和按列对矩阵进行排序

在本文中，我们将学习一个 python 程序来按行和按列对矩阵进行排序。假设我们采用了一个输入的 MxM 矩阵。我们现在将使用嵌套的 for 循环对给定的输入矩阵进行逐行和按列排序。...− 创建一个函数sortingMatrixByRow（）来对矩阵的每一行进行排序，即通过接受输入矩阵m（行数）作为参数来逐行排序。在函数内部，使用 for 循环遍历矩阵的行。...创建一个函数 sortMatrixRowandColumn（）通过接受输入矩阵 m（行数）作为参数来对矩阵行和列进行排序。...Python 对给定的矩阵进行行和列排序。...此外，我们还学习了如何转置给定的矩阵，以及如何使用嵌套的 for 循环（而不是使用内置的 sort（）方法）按行对矩阵进行排序。

5.9K5 0

JavaScript 如何对 JSON 数据进行冒泡排序？

在本文中，我们将探讨如何使用 JavaScript 对 JSON 数据进行冒泡排序，以实现按照指定字段排序的功能。了解冒泡排序算法冒泡排序是一种简单但效率较低的排序算法。...解析 JSON 数据首先，我们需要解析 JSON 数据并将其转换为 JavaScript 对象或数组，以便进行排序操作。...如果要按照 JSON 数据中的特定字段进行排序，我们可以修改冒泡排序函数来比较指定字段的值。...、解析 JSON 数据、实现冒泡排序函数以及根据指定字段进行排序，我们可以使用 JavaScript 对 JSON 数据进行冒泡排序。...这使得我们能够按照指定的顺序对数据进行排序，并满足特定的需求。通过掌握这个技巧，我们能够更好地处理和操作 JSON 数据。

1581 0

flutter - 如何在DartFlutter中按字母顺序对Set String进行排序？

有没有一种方法可以按字母顺序对其进行排序？

6.7K3 0

如何对python的字典进行排序

可是有时我们需要对dictionary中的item进行排序输出，可能根据key，也可能根据value来排。到底有多少种方法可以实现对dictionary的内容进行排序输出呢？...python对容器内数据的排序有两种，一种是容器自己的sort函数，一种是内建的sorted函数。...= adict.keys() keys.sort() return [dict[key] for key in keys] #还是按key值排序，据说更快。。。...： # 按照value进行排序 print sorted(dict1.items(), key=lambda d: d[1]) 知识点扩展：准备知识：在python里，字典dictionary是内置的数据类型...到此这篇关于如何对python的字典进行排序的文章就介绍到这了,更多相关python的字典进行排序方法内容请搜索ZaLou.Cn以前的文章或继续浏览下面的相关文章希望大家以后多多支持ZaLou.Cn！

5.5K1 0

MySQL | 如何对查询结果集进行排序

数据操作语言：结果集排序如果没有设置，查询语句不会对结果集进行排序。也就是说，如果想让结果集按照某种顺序排列，就必须使用 ORDER BY 子句。 SELECT .........ASC 代表升序（默认），DESC 代表降序如果排序列是数字类型，数据库就按照数字大小排序，如果是日期类型就按日期大小排序，如果是字符串就按照字符集序号排序。...默认情况下，如果两条数据排序字段内容相同，那么排序会是什么样子？...type);SHOW INDEX FROM t_message;ALTER TABLE t_message ADD INDEX idx_type(type);SQL 我们可以使用 ORDER BY 规定首要排序条件和次要排序条件...数据库会先按照首要排序条件排序，如果遇到首要排序内容相同的记录，那么就会启用次要排序条件接着排序。

6.2K1 0

如何对Scala中集合(Collections)进行排序

文章标题：《如何对Scala中集合(Collections)进行排序》本文链接： http://www.iteblog.com/archives/1171 下面是一系列对 Scala 中的Lists...、Array进行排序的例子，数据结构的定义如下： // data structures working with val s = List( "a", "d", "F", "B", "e") val n...function (Thanks Rahul) */ s.sortWith(_.toLowerCase < _.toLowerCase) res4: List = List(a, B, d, e, F) 如何对...case (key, value) => println(key + " = " + value) } 0 = -16 -1 = -4 1 = 2 -2 = 5 2 = 6 5 = 9 对源数据排序...上面的排序并不对原始的数据产生影响，排序的结果被存储到别的变量中，如果你的元素类型是数组，那么你还可以对数组本身进行排序，如下： scala> val a = Array(2,6,1,9,3,2,1,

1.8K5 0

如何对 1 千万个整数进行快速排序

没有其他数据与该正数相关联。输出：按升序排列的输入整数的列表。约束：最多有（大约）1MB的内存空间可用，有充足的磁盘存储空间可用。运行时间最多几分钟，运行时间为10秒就不需要进一步优化。...一种思路是，既然总的内存不够，我们可以读取40次，例如，第一次读取0至249 999之间的数，并对其进行排序输出，第二次读取250 000 至499 999之间的数，并对其排序输出。...以次类推，在进行了多次排序之后就完成了对所有数据的排序，并输出到文件中。另外一种思路是，既然有充足的磁盘存储空间可用，那么我们可以借助中间文件。...如何将第n个比特位置1？先将1左移n位（n小于8），得到一个值，再将这个值与该字节进行相或即可。...这一切都基于输入数据都是正确的，但这丝毫不影响我们对该算法思想的理解。总结位图法适用于大规模数据，但数据状态又不是很多的情况。对于上面的程序，几乎是做完读取操作之后，排序就完成了，效率惊人。

2K8 0

如何对1千万个整数进行快速排序

没有其他数据与该正数相关联。输出：按升序排列的输入整数的列表。约束：最多有（大约）1MB的内存空间可用，有充足的磁盘存储空间可用。运行时间最多几分钟，运行时间为10秒就不需要进一步优化。...一种思路是，既然总的内存不够，我们可以读取40次，例如，第一次读取0至249 999之间的数，并对其进行排序输出，第二次读取250 000 至499 999之间的数，并对其排序输出。...以次类推，在进行了多次排序之后就完成了对所有数据的排序，并输出到文件中。另外一种思路是，既然有充足的磁盘存储空间可用，那么我们可以借助中间文件。...如何将第n个比特位置1？先将1左移n位（n小于8），得到一个值，再将这个值与该字节进行相或即可。...这一切都基于输入数据都是正确的，但这丝毫不影响我们对该算法思想的理解。总结位图法适用于大规模数据，但数据状态又不是很多的情况。对于上面的程序，几乎是做完读取操作之后，排序就完成了，效率惊人。

2.2K2 0

使用Python对Excel数据进行排序，更高效！

标签：Python与Excel,pandas 表排序是Excel中的一项常见任务。我们对表格进行排序，以帮助更容易地查看或使用数据。...然而，当你的数据很大或包含大量计算时，Excel中的排序可能会非常慢。因此，这里将向你展示如何使用Python对Excel数据表进行排序，并保证速度和效率！...但是，注意，由于默认情况下inplace=False，此结果数据框架不会替换原始df。图2 按索引对表排序我们还可以按升序或降序对表进行排序。...图3 按指定列排序我们已经看到了如何按索引排序，现在让我们看看如何按单个列排序。让我们按购买日期对表格进行排序。默认情况下，使用升序，因此我们将看到较早的日期排在第一位。...图4 按多列排序我们还可以按多列排序。在下面的示例中，首先对顾客的姓名进行排序，然后在每名顾客中再次对“购买物品”进行排序。

4.4K2 0

Django 数据查询中对字段进行排序

方法一：order_by 排序 # 更新时间字段，倒序排序 articles = Article.objects.filter(show_status=True).order_by('-time_created...') # 更新时间字段，正序排序 articles = Article.objects.filter(show_status=True).order_by('time_created') # 更新时间字段...，正序排序 articles = Article.objects.order_by('time_created') 也可以使用两个字段进行排序，当第一个字段值相等时，再用第二个字段值来排序 articles...time_updated", ] 或 admin.py class ArticleAdmin(admin.ModelAdmin): ordering = ["time_updated", ] 每次查询数据库都会默认使用该字段来排序...，除非你显示的使用 order_by 语句来排序

2.7K3 0

多个字段中如何按其中两个进行排序（二次排序）

多个字段中如何按其中两个进行排序（二次排序） 1 原理二次排序就是首先按照第一字段排序，然后再对第一字段相同的行按照第二字段排序，注意不能破坏第一次排序的结果。 ...这里主要讲如何使用一个Mapreduce就可以实现二次排序。Hadoop有自带的SecondarySort程序，但这个程序只能对整数进行排序，所以我们需要对其进行改进，使其可以对任意字符串进行排序。...在reduce阶段，reducer接收到所有映射到这个reducer的map输出后，也是会调用job.setSortComparatorClass设置的key比较函数类对所有数据对排序。...，同时完成两列数据的相关操作，这里是对二者进行比较 * */ public static class IntPair implements WritableComparable...super(IntPair.class, true); } // Compare two WritableComparables. // 重载 compare：对组合键按第一个自然键排序分组

4.8K8 0

Mysql 如何实现对某个字段进行排序？

mysql实现对单个字段进行排序 Mysql对单个字段执行排序使用的语句是order by 语句。跟在order后面的关键字是asc或desc。

2.6K2 0

C语言实例：实现对英文的12个月份按字母进行排序

需求 C语言实现对英文的12个月份按字母进行排序源码 // // @author: 冲哥 // @date: 2021/6/3 20:38 // @description:C语言实现对英文的12个月份按字母进行排序...March","April","May","June","July","August","September","October","November","December"}; printf("排序前...{ printf("%s ", month[i]); } printf("\n"); p = month; sort(p); printf("排序后...作比较时使用到了strcmp()函数这里简单说下这个函数「函数原型」：int strcmp(const char* stri1，const char* str2); 用于对两个字符串进行比较（区分大小写

2.7K2 0

如何对增广试验数据进行分析

之前发了增广数据或者间比法的分析方法，R语言还是有点门槛，有朋友问能不能用Excel或者SPSS操作？我试了一下，Excel肯定是不可以的，SPSS我没有找到Mixed Model的界面。...矫正值校正值即是对原来的观测值去掉区组效应后的值，这个值更接近于品种的真实值，可以根据它来进行排序，进行品种筛选。 ?...更好的解决方法：GenStat 我们可以看出，我们最关心的其实是矫正产量，以及LSD，上面的算法非常繁琐，下面我来演示如果这个数据用Genstat进行分析：导入数据 ? 选择模型：混合线性模型 ?...LSD 因为采用的是混合线性模型，它假定数据两两之间都有一个LSD，因此都输出来了，我们可以对结果进行简化。...结论文中给出的是如何手动计算的方法，我们给出了可以替代的方法，用GenStat软件，能给出准确的、更多的结果，如果数据量大，有缺失值，用GenStat软件无疑是一个很好的选择。

1.5K3 0

如何对minist数据进行预处理

1 问题深度学习中，数据很多，不能一次性把数据全都放到模型中进校训练，所以利用数据加载，进行顺序打乱，分批，预处理之类的操作 2 方法使用pytorch提供的 Dataset(数据集类)（获取数据位置和个数...DataLoader(数据加载器类)： 1.传入dataset 2.batch_size 批大小 3.shuffle 数据打乱 train_loader=DataLoader(dataset=train...batch_size=128,shuffle=True) test_loader = DataLoader(dataset=test, batch_size=128) 构造一个两到三层的神经网络，因为minsit数据不是很复杂...，所以层数对数据的效果没有太大的影响。...经过以上的操作就是对minsit数据的一个简单处理，为接下来的深度学习做准备。

1.2K1 0

对无限级分类数据进行重新排序（非树形结构）

本文记录的方式是先将所有数据查出来，再使用递归对数据进行排序，并附加层级字段（level）。此方式仅仅对无限级的数据进行排序，并没有将子级内容放入父级。 1. 先看效果图 ---- 2....在 TP6.0 中使用的对无限级分类进行排序，并附加层级字段 ---- <?...CategoryModel::field('id,pid,name') ->order('sort desc') ->select(); $data = $this->_sort($data);//对无限级分类重新排序...dump($data); } /** * 无限级分类递归排序 */ private function _sort($data, $pid = 0, $level = 0) { static $arr...其他写法 ---- /** * 无限级分类排序 */ private function getTree($array, $pid = 0, $level = 0) { // 声明静态数组,避免递归调用时

1.5K4 0

redis 读取数据，并且对里面的时间进行排序读取。

result[addr]['description'] = description except Exception,e: print e # 拼接数据...['address']]['device'] = device result[d['address']]['description'] = description # 拼接数据...address']]['val'].append(d['val']) result[d['address']]['timeStamp'].append(d['timeStamp']) # 拼接数据

9622 0

抖音二面，内存只有 2G，如何对 100 亿数据进行排序？

之前我其实不是很能理解这座墙的意义，见证了俄乌战争、美利坚发动的铺天盖地的舆论攻势之后，我大概能够明白，这座墙，抵御的到底是谁了大数据小内存排序问题，很经典，很常见，类似的还有比如 “如何对上百万考试的成绩进行排序...” 等等大概有这么三种方法：数据库排序（对数据库设备要求较高）分治法（常见思路）位图法（Bitmap） 1....数据库排序将存储着 100 亿数据的文本文件一条一条导入到数据库中，然后根据某个字段建立索引，数据库进行索引排序操作后我们就可以依次提取出数据追加到结果集中。...，可以用快速排序，归并排序，堆排序等等 3）1000 个小文件内部排好序之后，就要把这些内部有序的小文件，合并成一个大的文件，可以用堆排序来做 1000 路合并的操作（假设是从小到大排序，用小顶堆）：...要想定义存储空间大小就需要实现知道存储的元素到底有多少对于有符号类型的数据，需要用 2 位来表示，比如第 0 位和第 1 位表示 0 这个数据，第 2 位和第 3 位表示 1 这个数据......

3.8K1 0

如何根据函数返回的值对dart中的List进行排序

# 关于排序：如何根据函数返回的值对dart中的List进行排序 void main(){ List pojo = [POJO(5), POJO(3),POJO(7),POJO(1)

11.5K1 0

点击加载更多

扫码

添加站长进交流群

领取专属 10元无门槛券

手把手带您无忧上云

扫码加入开发者社群

相关资讯

热门标签

活动推荐

运营活动

活动名称

广告关闭