ページのDOM要素は、継承の方法により、2つの操作を達成するために
クラスドラッグ{
ビルダー（S）{
this.eleはそれを=。
this.m = this.move.bind（本）
this.u = this.up.bind（本）
this.addEvent（）;
}
addEvent（）{
this.ele.addEventListener（ "マウスダウン"、this.down.bind（本））
}
ダウン（イブ）{
VAR E =前夜|| window.event;
this.x = e.offsetX。
this.y = e.offsetY。
document.addEventListener（ "のMouseMove"、this.m）。
document.addEventListener（ "のmouseup"、this.u）。
}
ムーブ（イブ）{
VAR E =前夜|| window.event;
this.ele.style.left = e.clientX - this.x + "PX"。
this.ele.style.top = e.clientY - this.y + "PX"。
}
アップ（）{
document.removeEventListener（ "のMouseMove"、this.m）。
document.removeEventListener（ "のmouseup"、this.u）。
}
}
クラスSmallDragは{ドラッグを拡張します
ビルダー（S）{
スーパー（それ）
}
ムーブ（イブ）{
VAR E =前夜|| window.event;
VaRのL = e.clientX - this.x。
VARトン= e.clientY - this.y。
IF（L <0）{
L = 0。
}
もし（T <0）{
T = 0。
}
this.ele.style.left = L + "PX"。
this.ele.style.top = T + "PX"。
}
}
VaRのobox1 =のdocument.getElementById（ "BOX1"）
VaRのobox2 =のdocument.getElementById（ "BOX2"）
新しいドラッグ（obox1）。
新しいSmallDrag（obox2）。