代码如下：
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>获取鼠标在Canvas中的坐标位置</title>
<style>
#canvas{
border:1px solid #ccc
width:300px
height:300px
overflow:hidden
}
</style>
<script>
function get_canvas(ev,obj){
m_clientX = ev.clientX-obj.offsetLeft
m_clientY = ev.clientY-obj.offsetTop
document.getElementById("tips").innerHTML = "当前坐标：X："+ m_clientX + " ,Y：" +m_clientY
}
</script>
</head>
<body>
<div id="tips"></div>
<div id="canvas" onmousemove="get_canvas(event,this)"></div>
</body>
</html>
兼容IE8+
用 javascript 获取当前页面上鼠标（光标）位置在许多情况下都会用到，比如拖放，悬停提示（tooltip） 等等。当然，这里我们依然要面对浏览器的兼容问题，在不同的浏览器下，对这些相关的属性处理方式也不同。
参考资料
首页 → 网络编程 → JavaScript → javascript技巧 → js获取鼠标位置实例详解.脚本之家[引用时间2018-1-18]
<!DOCTYPE html><html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<script src="js/jquery-3.2.1.min.js"></script>
</head>
<body>
<ul>
<li>1234</li>
<li>12345</li>
<li>123456</li>
<li>1234567</li>
</ul>
<script>
$('ul').on('click','li',function (e) {
console.log(e.clientX)
console.log(e.clientY)
})
</script>
</body>
</html>
多端阅读《javascript教程》:
在PC/MAC上查看：下载w3cschool客户端，进入客户端后通过搜索当前教程手册的名称并下载，就可以查看当前离线教程文档。下载javascript教程离线版客户端
在手机APP上查看：请从各大安卓应用商店、苹果App Store搜索并下载w3cschool手机客户端，在App中搜索当前教程手册的名称查看。下载w3cschool手机App端
在手机上查看文档：https://m.w3cschool.cn/javascript/
手册简介:
JavaScript 是世界上最流行的脚本语言。 JavaScript 是属于 web 的语言，它适用于 PC、笔记本电脑、平板电脑和移动电话。 JavaScript 被设计为向 HTML 页面增加交互性。 许多 HTML 开发者都不是程序员，但是 JavaScript 却拥有非常简单的语法。几乎每个人都有能力将小的 JavaScript 片段添加到网页中。
手册说明:
Javascript，从“最被误解的语言”，最后神奇地转变成为“最流行的语言”，证明它经受得起时间的考验。虽然单独来看，它的交互设计有些失败，但是加上Ajax的完美配合，javascript就成了一款轻便并且又实用的好语法。
如果您想要更高效、更系统地学会javascript，您最好采用边学边练（javascript微课）的学习模式。
如果您觉得javascript的学习难度较高，不易理解，建议您采用视频教程进行学习：javascript视频课程
接下来让我们静下心来，翻开这本关于Javascript的教程，你可以学习到JavaScript 代码规范、JavaScript 函数撰写、javascript 正则表达式、JavaScript 逻辑运算等基础内容，除此之外，本书还有进阶的Javascript高级教程，最好在熟读前面的基础知识之后，再考虑继续之后的教程。
高级教程当中包含的内容有很重要的JavaScript 对象介绍，JavaScript Window对象模型介绍，JavaScript 库以及JavaScript 实例等等，每一个章节都值得细细研读。
学完本教程之后，建议您进行javascript实战来巩固您学到的知识。
