drag拖拽

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <style>
        #div1{
            width:200px;
            height:100px;
            border: 1px solid red;
        }

    </style>
</head>
<body>
    <div id="div1"
         ondragover="dragOver(event);"
         ondrop="dropMyObject(event);">
    </div>
    <p id="myp"
       draggable="true"
       ondragstart="dragStart(event)">我被拖拽
    </p>
</body>
</html>
<script>
    function dragStart(ev){
        ev.dataTransfer.setData("objectId",ev.target.id);
    }
    function dragOver(ev){
        ev.preventDefault();
    }
    function  dropMyObject(ev) {
        var objId = ev.dataTransfer.getData("objectId");
        var obj = document.getElementById(objId);
        ev.target.appendChild(obj);
    }
</script>