我想知道我是否/如何能够存储我将可拖动div移动到表格上的位置，因此当页面重新加载时，它将返回到离开的位置（来自MySQL）数据库）。

我读过一些相关文章，但都是关于将 jquery（事件、ui）与 AJAX 结合使用的。

这是我的代码：

   var p = document.getElementsByTagName('p');
   var choice = document.getElementsByClassName('choice');
   var dragItem = null;
   
   for(var i of p){
        i.addEventListener('dragstart', dragStart);
        i.addEventListener('dragend', dragEnd);
   }
   function dragStart(){
        dragItem = this;
        setTimeout(()=>this.style.display = "none", 0);
   }
   function dragEnd(){
        setTimeout(()=>this.style.display = "block", 0);
        dragItem = null;
   }
   for(j of choice){
        j.addEventListener('dragover', dragOver);
        j.addEventListener('dragenter', dragEnter);
        j.addEventListener('dragleave', dragLeave);
        j.addEventListener('drop', Drop);
   }
   function Drop(){
        this.append(dragItem);
   }
   function dragOver(e){
        e.preventDefault();
        this.style.border = "2px dotted cyan";
   }
   function dragEnter(e){
        e.preventDefault();
   }
   function dragLeave(e){
        this.style.border = "none";
   }

   section{
      width: 1000px;
      height: 360px;
      margin: 100px auto;
      display: flex;
      justify-content: space-around;
   }
   h1{
      text-align: center;
   }
   div{
      width: 200px;
      height: 90%;
      padding: 20px;
      margin: 10px;
      background: #fafafa;
      box-sizing: border-box;
   }
   p{
      font-weight: bold;
      border-radius: 5px;
      padding: 5px;
      color: white;
      background: red;
   }
   table, th, td {
  border:1px solid black;
}
      button{
      width: 100px;
      height: 15px;
      padding: 15px;
      margin: 10px;
      background: gray;
      box-sizing: border-box;
   }

 it's just a test for js 


 

  

    
time
    
DIM
    
LUN
  
  

    
8:00 - 9:00
    
 S1-1
    
S1-2
  
  

    
9:00 - 10:00
    
S2-1
    
S2-2
  
 
save


     
MODULE 1
     
MODULE 2
     
MODULE 3
     
MODULE 4
     
MODULE 5