用JS实现计算两点之间的距离

最新推荐文章于 2023-06-01 15:35:11 发布

YXB413

最新推荐文章于 2023-06-01 15:35:11 发布

阅读量2.1w

点赞数 1

本文链接：https://blog.csdn.net/YXB413/article/details/82824031

版权

虽然题目很简单，但还是感觉自己敲的代码不多，对于JS方法的使用及规则还是不够熟练，收获还是很多的，至少认识到了，自己编码速度还是太慢，思路，逻辑还是不够清楚。

<!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>