为什么无法实现效果？

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"> 
<title>返回鼠标指针的位置</title>
<style type="text/css">
    .container{
        width: 200px;
        height: 200px;
        background: yellow;
    }
    .target{
        width: 100px;
        height: 100px;
        background: pink;
    }
</style>
<script src="https://cdn.bootcss.com/jquery/1.10.2/jquery.min.js">
</script>
<script>
$(document).ready(function(){
  // 此处补充代码
    var dragstart=function(e){
        e.dataTransfer.setData("Text",e.target.id);
    }
    var drop=function(e){
        e.preventDefault();
        var data=e.dataTransfer.getData("Text");
        e.target.appendChild(document.getElementById(data));
    }
    var dragover=function(e){
        e.preventDefault();
    }
});
</script>
</head>
<body>
    <div id="container" class="container" ondrop="drop(event)" ondragover="dragover(event)"></div>
    <div id="target" class="target" draggable="true" ondragstart="dragstart(event)"></div>
</body>
</html>

qq_鸭绿桥第一帅哥_0 2019-04-14

源自：HTML5拖拽上传 3-2 HTML5拖拽语法的小案例

收起

2回答

樱桃小胖子回答被采纳获得+3积分 2019-04-14 15:52:42

第一，从同学上传的代码来看，这里是原生js 的写法，因此不需要使用<script src="https://cdn.bootcss.com/jquery/1.10.2/jquery.min.js"> </script>，因为是原生js的写法，因此也不需要使用 $(document).ready(function() {})， $(document).ready(function() {})是jq的初始化代码

第二，放在head中也是可以实现的，这里老师是习惯性的放在了</body>前面。

祝学习愉快！

收起回答

樱桃小胖子 2019-04-14 12:00:29

希望可以帮到你！

收起回答

提问者 qq_鸭绿桥第一帅哥_0 #1

谢谢老师。两个问题。问题一：使用jquery时，为什么不用添加 <script src="https://cdn.bootcss.com/jquery/1.10.2/jquery.min.js"> </script> 问题二：为什么在head标签中写jquery代码无法实现效果？

2019-04-14 15:32:06