如何通过javascript获取特定坐标元素的ID

时间:2017-02-16 20:19:54

标签: javascript html

考虑在坐标(2,2)处的空白浏览器页面上有一个DIV(以像素为单位)和一个按钮。如果我点击该按钮,它必须将坐标(2,2)发送到将检测到的位置的功能(2,2)它是否是DIV,BUTTON等,并且还返回其ID。

这是我试过的:

<!DOCTYPE html>
<html lang="en">

<head>
    <title>elementFromPoint example</title>
    <script>
        function changeColor(newColor) {
            //To get  element from coordinate 2,2
            var elem = document.elementFromPoint(2, 2);
            //Here i wanted to print what i am getting  in var elem
            document.getElementById("status").innerHTML = elem;
            //next line changes color whatever is at 2,2
            elem.style.color = newColor;
            //But i want to know whats at 2,2 or get its ID or class.
        }
    </script>
</head>

<body>
    <p id="para1">Some text here</p> <button onclick="changeColor('blue');">blue</button> <span id="status"></span> </body>

</html>

但是通过这种方法,我只能改变它的颜色,但我仍然坚持如何获得它的ID或TYPE(div / button / para / etc)。

1 个答案:

答案 0 :(得分:2)

var elem = document.elementFromPoint(2, 2);为您提供元素引用,id是该元素的属性

尝试

console.log(elem.id);

表示

console.log(elem.tagName);

更新您的状态:

document.getElementById("status").innerHTML = 'ID:' +elem.id +' , Tag:' +elem.tagName;