61のネイティブJS：ドラッグ

： `` `htmlの実行
<！DOCTYPE HTML> 
<HTML LANG = "EN"> 
<HEAD> 
    <メタ文字コード= "UTF-8"> 
    <タイトル>拖拽</ TITLE> 
    <スタイル> 
        * { 
            マージン：0; 
            パディング：0; 
        } 
        DIV { 
            位置：絶対。
            左：0; 
            トップ：0; 
            幅：100ピクセル; 
            高さ：100pxに。
            背景：赤; 
        } 
    </スタイル> 
</ head> 
<body> 
<DIV ID = "DIV"> </ div> 
<スクリプト> 
    VAR oDiv =のdocument.getElementById（ 'DIV'）。
    oDiv。れるonmousedown =ダウン。
    関数processThis（FN、OBJ）{
        復帰機能（E）{ 
            fn.call（OBJ、E）
        } 
    } 
    関数ダウン（E）{ 
        E = E || window.event。
        this.x = this.offsetLeft。
        this.y = this.offsetTop。
        this.mx = e.clientX。
        this.my = e.clientY。
        （this.setCapture）{もし
            this.setCapture（）。
            this.onmousemove = processThis（移動、この）; 
            this.onmouseup = processThis（これを、アップ）。
        }他{ 
            document.onmousemove = processThis（移動、この）; 
            document.onmouseup = processThis（この、アップ）。
        } 

    } 
    関数move（E）{ 
        E = E || window.event。
        = + this.x this.style.left（e.clientX-this.mx）+ 'PX'で; 
        //this.x：フロントoffsetLeft値を移動させるステップと、（e.clientX-this.mx）：横方向の移動からマウス、即ち、横のボックスの移動距離
        +（e.clientY-this.my）+ 'PX'からthis.style.top = this.y; 
        //this.y：フロントoffsetTop値を移動させるステップと、（e.clientX-this.mx）：マウス長手方向の移動距離、即ち長手ボックスの移動距離
    } 
    （アップ機能）{ 
        IF（this.releaseCapture）{ 
            this.releaseCapture（）; 
            this.onmousemove = NULL; 
            this.onmouseup = NULL; 
        }そうでなければ{ 
            document.onmousemove = NULL; 
            document.onmouseup = NULL; 
        } 

    } 
</ SCRIPT> 
</ BODY> 
</ HTML> 
`` 

に取り付けられ、そしてのjqueryのzepto差：
図1は、移動端末プログラムに対して、Zeptoは、いくつかの基本的なタッチイベントは、ZeptoがIEブラウザでサポートされていないタッチスクリーン相互作用（タップイベント、スワイプイベント）のために使用することができるあります。
2、違いは、DOM操作：あなたがIDを追加するとZeptoが有効になりながら、jQueryが有効になりません。
図3に示すように、トリガ・イベントの間の差：jQueryのを使用する場合、負荷イベントハンドラが実行されない。Zeptoロードイベントハンドラを使用する場合には、実行されます。
4、イベントデリゲートの差：
5、幅（差）と高さ（）A：Zeptoボックスモデル（ボックスサイズ）によって決定される、.widthと割り当てを返す（）幅、戻りプラスの.css（「幅」）結果は次のように接する、jQueryのボックスモデルは、常に（ボーダー、パディングを含まない）幅/高さのコンテンツ領域を返し無視します。
区別6、（オフセット）がある：Zepto先頭{上、左、幅、高さ }; jQueryの戻り{幅、高さ}。
7、Zeptoは隠し要素の幅と高さ、jQueryの缶を取得することはできません。
8、Zeptoプロトタイプメソッドを定義するために延びていないのjQueryを有しています。
図9に示すように、それぞれの方法Zeptoは、アレイを介して、JSONオブジェクトを横切ることができません。
10、Zepto支柱は、選択されたDOMの操作方法を利用すると、読み出し値優先ATTR属性場合には、プロパティをチェックします。選択したプロパティの標準プロパティは、CSSではありませんので、Zeptoは、要素選択オプション同様のjQueryの$で（「[選択]オプションを」）を選択しないで取得します。$（ 'オプション'）。未使用すべきである （関数（）{返す！This.selected}）。
61のネイティブJS：ドラッグ

おすすめ
