javascript - 按数据属性对 div 进行排序 - 类型错误

Question

尝试按数据属性值 (data-date) 对 div 元素进行排序；

获取类型错误 - a.attr 不是函数。

有什么帮助吗？

$('button').on('click', function() {
  $('.title').sort(function(a, b) {
    if (a.attr('data-date') < b.attr('data-date')) {return -1;}
	else {return 1;}
  }).appendTo('#titles');
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<div id='titles'>
  <div class='title' data-date="2017-11-05 07:29:35">lorem</div>
  <div class='title' data-date="2017-09-22 05:27:31">ipsum</div>
  <div class='title' data-date="2014-07-29 08:29:03">lorema</div>
  <div class='title' data-date="2016-12-04 05:04:14">ipsuma</div>
</div>

<button>CLICK</button>

Answer 1

使用Jquery调用.attr。这是固定代码。

$('button').on('click', function(){
		$('.title').sort(function(a, b) {
			if ($(a).attr('data-date') < $(b).attr('data-date')) {return -1;}
			else {return 1;}
		}).appendTo('#titles');
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<div id='titles'>
<div class='title' data-date="2017-11-05 07:29:35">lorem</div>
<div class='title' data-date="2017-09-22 05:27:31">ipsum</div>
<div class='title' data-date="2014-07-29 08:29:03">lorema</div>
<div class='title' data-date="2016-12-04 05:04:14">ipsuma</div>
</div>

<button>CLICK</button>