1.拖放？   何為拖放？

       拖放(拖拽)就是把抓取的物件拖動並防止在其他位置。如下圖所示。

 2.拖放的步驟

       1）將想要拖放的物件元素的draggable屬性值設定為'true'(img/a元素預設允許拖放)。

       2）編寫與拖放處理相關的事件程式碼。

 3.以上提到，拖放是要編寫拖放事件的程式碼的，那麼，拖放事件包含什麼呢？

     我們通過拖放事件，可以處理拖放相關的各個方面1）哪裡發生了拖放2）被拖動的元素有什麼事件觸發3）要放置被拖動的元素的元素有什麼事件觸發，拖放，有以下事件：

      1  .拖動事件：

                      ondragstart       開始拖動，元素預設不可拖放，設定元素的draggable的值為'true'，可實現可拖動（img/a除外）

                       ondrag           拖動

                       dragend         拖動結束

      2   .放置事件：

                    ondragenter      將元素拖動到放置元素觸發   拖出放置元素，觸發dragleave事件

                     ondragover       在放置元素內移動時觸發的事件

                     drop                   放置時觸發

           拖放的生命週期：dragstart  --->  drag  -->dragenter --->dragover --->drop--->dragend

    4.拖放的實現。

        1.拖放物件設定為可拖放，   元素--->draggable='true'.

        2.自定義放置目標，所有元素都支援放置目標事件，但這些元素預設是不允許放置。所以，可以自定義他們的放置事件

  使其成為有效的放置目標，方法是重寫drapenter和drapover事件的預設行為，阻止預設行為，以dropover為例，因為要實現

多個拖放事件，所以，以函式來實現    

function  dragOver(event){
         event.preventDefault();
}
    //呼叫
    item.ondragover =dragOver;

      3.以上，雖然阻止了預設行為，但是，還是無法放置，為什麼呢？把一個元素拖拽至令以元素中，他的資料沒放進去，怎麼會拖拽成功呢？事件物件有一個屬性event.dataTansfer,用於從被拖動元素向放置元素傳遞資料（以字串格式），所以事件物件處理程式中，拖動時設定該屬性的值，並在放置時獲取。即將dataTransfer物件setData()方法獲取的值，通過getData()方法獲取

function dragStrat(event){
    event.dataTransfer.setData(text/plain,'text');
}
    item.ondragstart= dragStart;
function drop(event){
    //getData()方法接收一個值
    event.dataTransfer.getData(text/plain);
}
    item.ondrop=drop;

以上，拖放事件的基本過程已實現。