发现H5好多新属性没有用过，为了测试，在以前的优化过的项目上直接测试，效果还挺理想，于是做了一个简单的demo，方便学习交流，废话不多说，直接上代码：

简单设置一下，这是样式部分

#div1 {

width:128px;

height:66px;

padding:10px;

border:1px solid #aaa;

}

请把下面的文字拖放到矩形中：

下面是JS部分

function allowDrop(event){

event.preventDefault();

}

function drag(event){

event.dataTransfer.setData("Text",event.target.id);

}

function drop(event){

event.preventDefault();

var data=event.dataTransfer.getData("Text");

event.target.appendChild(document.getElementById(data));

}

好了试试吧  具体效果如图

这是打开以后的页面

然后用鼠标去拖动“丁国庆  大帅比”放到矩形框里试试

完成以后

好了教程结束~谢谢大家的支持~