以下是一个示例解决方案，使用JavaScript实现简单的拖放和排序，不依赖于任何外部库。

HTML代码：

  

    Item 1
  
  

    Item 2
  
  

    Item 3
  

JavaScript代码：

// 获取列表元素
var sortableList = document.getElementById("sortable-list");

// 设置拖动的元素的数据
function drag(event) {
  event.dataTransfer.setData("text/plain", event.target.id);
}

// 允许拖放
function allowDrop(event) {
  event.preventDefault();
}

// 完成拖放
function drop(event) {
  event.preventDefault();
  var data = event.dataTransfer.getData("text/plain");
  var draggableElement = document.getElementById(data);
  var dropzone = event.target;

  // 如果拖动的元素不是排序项，则找到其父级排序项
  if (!draggableElement.classList.contains("sortable-item")) {
    draggableElement = draggableElement.parentNode;
  }

  // 如果拖放目标是排序项，则插入到其前面
  if (dropzone.classList.contains("sortable-item")) {
    dropzone.parentNode.insertBefore(draggableElement, dropzone);
  }
  // 否则将元素追加到列表末尾
  else {
    sortableList.appendChild(draggableElement);
  }
}

通过以上代码，你可以实现一个简单的拖放和排序功能。每个可拖动的项都包含一个draggable属性和相应的拖放事件处理程序。当拖动项时，将其ID存储在dataTransfer中。当放置项时，根据拖放事件的目标元素和位置，将拖动项插入到正确的位置。