雖然題目很簡單,但仍是感受本身敲的代碼很少,對於JS方法的使用及規則仍是不夠熟練,收穫仍是不少的,至少認識到了,本身編碼速度仍是太慢,思路,邏輯仍是不夠清楚。javascript
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>JS兩點間距</title>
</head>
<body>
<script type="text/javascript">
var p1,p2;
document.addEventListener("mousedown",function(e){
//思路:爲了實現計算兩點之間的間距,首先須要設置兩個變量p1和p2用於接收
//兩次按下鼠標時所產生的事件參數對象,爲網頁文檔對象Document註冊鼠標按下事件
//經過:Math.abs()獲取兩點之間橫縱座標差的絕對值
//經過Math.sqrt()函數計算出兩點間的直線距離
if(!p1){
p1 = e;
return;
}
p2 = e;
dx = Math.abs(p2.clientX - p1.clientX);
dy = Math.abs(p2.clientY - p1.clientY);
var dis = Math.sqrt(Math.pow(dx,2)+Math.pow(dy,2));
//去除小數點後的數字,這樣看起來舒服
console.log("這兩點之間的直線距離爲:"+parseInt(dis)+"px");
},false);
</script>
</body>
</html>html