下面的代码介绍如何使用 Sortable JS 创建拖放排序列表，该控件在时尚的用户界面中提供了流畅的拖拽、移动列表项的功能，其主要功能在于动态排序列表项，通过轻松拖拽的方式来重新排列以增强用户的体验。
如何使用 Sortable JS 创建拖放排序列表
1.为列表创建 HTML 结构。使用以下代码作为模板，在 #team-members 容器内的 <article> 元素中自定义每个团队成员的姓名、角色和社交链接等详细信息。
<div id="team-members"> <article class="team-member"> </article> </div>
2.style.css中定义了列表项的样式，确保布局具有视觉吸引力。您可以根据自己网站的主题随意调整样式。提供的 CSS 样式包括布局、背景、阴影等属性。
3.最重要的在底部要引入 Sortable JS：
<script src='./js/Sortable.min.js'></script>
4.最后，在 HTML 文档末尾的 <script> 标记之间，也就是结尾的 </body> 标记之前，加入以下 JavaScript 代码，进行启动js
const dragAndDropItems = document.getElementById('team-members');
new Sortable(dragAndDropItems, {
animation: 350,
chosenClass: 'team-member-chosen',
dragClass: 'team-member-drag'
});
