html的ul中的li的位置移动

    <div class="divmain">
        <ul>
            <li draggable="true" ondragend="dragend(this);" ondragstart="dragstart(this);">
                <span class="spanword">这是一段文字内容1</span>
                <span class="spanline"></span>
            </li>
            <li draggable="true" ondragend="dragend(this);" ondragstart="dragstart(this);">
                <span class="spanword"><a>这是一段文字内容2</a></span>
                <span class="spanline"></span>
            </li>
            <li draggable="true" ondragend="dragend(this);" ondragstart="dragstart(this);">
                <span class="spanword"><a>china word help3</a></span>
                <span class="spanline"></span>
            </li>
            <li draggable="true" ondragend="dragend(this);" ondragstart="dragstart(this);">
                <span class="spanword">这是一段文字内容4</span>
                <span class="spanline"></span>
            </li>
            <li draggable="true" ondragend="dragend(this);" ondragstart="dragstart(this);">
                <span class="spanword">这是一段文字内容5</span>
                <span class="spanline"></span>
            </li>
        </ul>
    </div>

        function dragend(elc) {
            var event=window.event;
            if (moveinfo != null) {
                var moved = {
                    x: event.clientX - moveinfo.x,
                    y: event.clientY - moveinfo.y
                };

                console.log("相对移动：" + moved.x + "  " + moved.y);

                var ds = $(".divmain").find("li");

                var hitpoint = {
                    x: ($(ds[moveinfo.id])[0]).offsetLeft,
                    y: ($(ds[moveinfo.id])[0]).offsetTop
                };

                console.log("原项起始点:" + hitpoint.x + " " + hitpoint.y);

                var move = {
                    x: hitpoint.x + moved.x,
                    y: hitpoint.y + moved.y
                }

                console.log("目标点:" + move.x + " " + move.y);

                var hitindex = -1;
                for (var k = 0; k < ds.length; k++) {
                    var startpoint = {
                        x: ($(ds[k])[0]).offsetLeft,
                        y: ($(ds[k])[0]).offsetTop
                    };
                    var endpoint = {
                        x: startpoint.x + ($(ds[k])[0]).clientWidth,
                        y: startpoint.y + ($(ds[k])[0]).clientHeight
                    }

                    if (startpoint.x <= move.x && startpoint.y <= move.y) {
                        if (endpoint.x >= move.x && endpoint.y >= move.y) {
                            hitindex = k;
                            break;
                        }
                    }

                }
                console.log("命中了" + hitindex);

                if (hitindex != -1) {
                    var drag =ds[moveinfo.id];
                    var draged =ds[hitindex];
                    $(drag).insertAfter(draged);
                }

            }


        }

        var moveinfo = null;
        function dragstart(elc) {
            
            var event=window.event;
            moveinfo = {
                id: $(elc).index(),
                x: event.clientX,
                y: event.clientY
            }
            console.log("start:" + moveinfo.id + " " + moveinfo.x + "  " + moveinfo.y);
        }

需要引入jquery