简单拖拽事件实现

var div = document.getElementById("div");//通过ID找到你的目标元素
div.ondrag = function(evt){
			this.style.left = evt.detail.changedTouches[0].clientX - this.offsetWidth*0.5 + "px";
			this.style.top = evt.detail.changedTouches[0].clientY - this.offsetHeight*0.5 + "px";
		}

主要应用到的还是ondrag事件

当然你也可以用：

    var drage = false;    
    if("ontouchstart" in window){
            startEvt = "touchstart";
            moveEvt = "touchmove";
            endEvt = "touchend";
        }else{
            startEvt = "mousedown";
            moveEvt = "mousemove";
            endEvt = "mouseup";
        }
div.addEventListener(startEvt,()=>{
    //点击事件开始
    drage = true;
    div.addEventListener(moveEvt,function(){ 
        if(drage){
            //拖动事件开始你的操作
        }
    })
    div.addEventListener(endEvt,function(){
        //拖动结束时你的操作
        drage = false;
    })
})

不过你得自己写一段移动端适配的拖拽事件适配：

var drage = false;    
    if("ontouchstart" in window){
            startEvt = "touchstart";
            moveEvt = "touchmove";
            endEvt = "touchend";
        }else{
            startEvt = "mousedown";
            moveEvt = "mousemove";
            endEvt = "mouseup";
        }
div.addEventListener(startEvt,function(evt){
    //点击事件开始
    drage = true;
    var x;
    var y;
    div.addEventListener(moveEvt,function(evt){ 
        if(drage == true){//如果为true
            //拖动事件开始你的操作
            //例如下面：
            if("ontouchstart" in window){
                x = evt.touches[0].clientX;
                y = evt.touches[0].clientY;
            }else{
                x = evt.clientX;
                y = evt.clienttY;
            }
        }
    })
    div.addEventListener(endEvt,function(evt){
        //拖动结束时你的操作
        drage = false;//判定是否进行拖拽事件
    })
})

不过ondrag事件更加方便，代码量也非常少，并且兼容移动端，测试iphone没有问题。