使用JS在Android手机上实现：点击后返回X、Y坐标

疑燃

已于 2023-04-20 22:25:08 修改

阅读量755

点赞数 2

分类专栏：原创教程文章标签： javascript android 前端

于 2023-04-09 00:11:29 首次发布

本文链接：https://blog.csdn.net/dannyxycheung9665/article/details/130036908

版权

原创教程专栏收录该内容

10 篇文章 2 订阅

订阅专栏

Android系统在部分界面是不允许截图的，也就不能很容易的获取到ID、name、xpath等信息来定位元素，这个时候就需要通过X、Y坐标来定位了。

获取X、Y坐标，相对容易一点的方法是使用javascript。不多说了，直接上代码：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, height=device-height, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
    <title>get xy</title>
    <style>
        html,body{
            width: 100%;
	        height: 100%;
        }
        body{
            margin: 0;
            padding: 0;
            box-sizing: border-box;
            background: blue;
        }
        .box{
            width: 100%;
            height: 100%;
            background: gray;
            float: left;
        }
    </style>
</head>
<body>

<div class="box">
请轻触需要获取坐标的位置<BR>
X坐标:<span id="s1"></span> 屏幕宽度: <span id="s3"></span><BR>
Y坐标:<span id="s2"></span> 屏幕高度: <span id="s4"></span>
</div>
<script>
    window.onload = function () {
        var box = document.querySelector('.box');
        box.addEventListener('touchstart',function (e) {            
            document.getElementById("s1").innerHTML = e.touches[0].screenX*3;
            document.getElementById("s2").innerHTML = e.touches[0].screenY*3;
            document.getElementById("s3").innerHTML = screen.width*3;
            document.getElementById("s4").innerHTML = screen.height*3;
        });
    }
</script>
</body>
</html>

使用方法：将以上代码保存成html文件，并放到web服务器，使用Android手机访问该页面。

点击需要获取的位置，页面显示X、Y坐标：