js点击排序

// 假设有一个HTML列表
<ul id="sortableList">
  <li>Apple</li>
  <li>Banana</li>
  <li>Orange</li>
  <li>Pear</li>
</ul>

// JavaScript代码
document.getElementById('sortableList').addEventListener('click', function(event) {
  if (event.target.tagName === 'LI') {
    const list = Array.from(this.children);
    list.sort((a, b) => a.textContent.localeCompare(b.textContent));
    this.innerHTML = '';
    list.forEach(item => this.appendChild(item));
  }
});

list.sort((a, b) => {
  const comparison = a.textContent.localeCompare(b.textContent);
  return comparison !== 0 ? comparison : a.dataset.index - b.dataset.index;
});

// 使用DocumentFragment进行批量更新
const fragment = document.createDocumentFragment();
list.forEach(item => fragment.appendChild(item));
this.innerHTML = '';
this.appendChild(fragment);

list.sort((a, b) => {
  const nameComparison = a.textContent.localeCompare(b.textContent);
  if (nameComparison !== 0) return nameComparison;
  return a.dataset.value - b.dataset.value; // 假设还有数值类型的排序条件
});