<button id="btn">sort!</button>
<ul id="list">
<li>6</li>
<li>7</li>
<li>3</li>
<li>1</li>
<li>12</li>
</ul>
var array = [];
var switching = true;
$('#list li').each(function(idx, val) {
array.push(val.innerText);
})
function toggleSort() {
switching = !switching;
var code = '',
list = $('#list');
list.empty();
if (switching) {
array.sort(function(a, b) {
return b - a; // reverse
})
console.log(array)
for (var i = 0; i < array.length; i++) {
code += '<li>' + array[i] + '</li>';
}
list.append(code)
} else {
array.sort(function(a, b) {
return a - b; // sort
})
for (var i = 0; i < array.length; i++) {
code += '<li>' + array[i] + '</li>';
}
list.append(code)
}
}
$('#btn').on('click', toggleSort)
더 간결하게 짤 수 있을거 같은데.. 일단 이렇게..
jsfiddle로 보기
반응형
'jQuery' 카테고리의 다른 글
DocumentFragment (0) | 2019.12.20 |
---|---|
jQuery로 간단한 todo 만들기 (0) | 2019.11.14 |
날씨 위젯 (0) | 2019.10.11 |
계산기 만들기 (0) | 2019.10.02 |
TweenMax 텍스트 애니메이션 (0) | 2019.10.02 |