Drag_Drop1、拖拽哪个元素就在哪个元素上设置draggable="true" 2、设置和获取被拖动的数据不要写错

<style>
    #div1,
    #div2 {
      float: left;
      width: 198px;
      height: 66px;
      margin: 10px;
      padding: 10px;
      border: 1px solid #aaa;
    }
  </style>
  <body>
  <div id="div1" ondrop="drop(event)" ondragover="allowDrop(event)">
    <img src="./wy1.webp" 
    alt="新年平安" 
    draggable="true"// 为了元素可以拖放，此处设置true
    ondragstart="drag(event)"
    id="drag1"
    style="width: 100%;">
  </div>
  <div id="div2" ondrop="drop(event)" ondragover="allowDrop(event)">
  </div>

  <script>
    function allowDrop(e) {
      e.preventDefault()// 取消默认行为（默认数据、元素无法放置到其他元素）
    }
    function drag(e) {
      e.dataTransfer.setData('Text', e.target.id)// 设置被拖动数据的数据类型和值
    }
    function drop(e) {
      e.preventDefault()// 阻止数据的浏览器默认处理方式
      var data = e.dataTransfer.getData('Text')// 获得被拖的数据
      e.target.appendChild(document.getElementById(data))// 把被拖元素追加到放置元素中
    }
  </script>
</body>