JavaScript 获取鼠标点击位置坐标
js获取位置坐标的方法
js获取位置坐标的方法一、概述JavaScript是一种广泛使用的编程语言，它允许开发人员创建动态、交互式的网页和应用程序。
在JavaScript中，获取位置坐标的方法可以帮助我们获取用户当前的位置信息。
本篇文章将介绍如何使用JavaScript获取位置坐标的方法。
二、方法介绍1. 使用`navigator.geolocation` API`navigator.geolocation` API是获取位置坐标的常用方法之一。
它允许浏览器获取用户的地理位置信息，包括经度、纬度等。
下面是一个使用`navigator.geolocation` API获取位置坐标的简单示例：```javascriptif (navigator.geolocation) {navigator.geolocation.getCurrentPosition(function(position) {// 获取位置坐标var lat = titude;var lon = position.coords.longitude;console.log("当前位置坐标：纬度：" + lat + ", 经度：" + lon);}, function(error) {console.log("获取位置信息失败：" + error.message);});} else {console.log("浏览器不支持获取位置信息");}```2. 使用第三方库除了使用浏览器的原生API外，还可以使用第三方库来获取位置坐标。
一些常用的JavaScript库包括`geo-location-js`和`simple-geolocation`等。
这些库提供了更简单、更方便的方法来获取位置坐标，通常还支持自动检测和切换不同的定位服务。
三、使用示例以下是一个使用第三方库`simple-geolocation`获取位置坐标的示例：首先，需要将库文件引入到HTML文件中：```html<script src="path/to/simple-geolocation.js"></script>```然后，在JavaScript代码中使用该库：```javascriptsimpleGeoLocation.getLocation(function(position) {// 获取位置坐标var lat = titude;var lon = position.coords.longitude;console.log("当前位置坐标：纬度：" + lat + ", 经度：" + lon);}, function(error) {console.log("获取位置信息失败：" + error);});```四、总结在本篇文章中，我们介绍了两种在JavaScript中获取位置坐标的方法：使用`navigator.geolocation` API和第三方库。
function(e)的用法
一、简介function(e)是JavaScript中常见的语法结构，用于定义函数和处理事件。
其中，e通常表示事件对象，可以在函数内部使用这个对象来获取触发事件的相关信息。
二、在函数中使用event对象1. 在事件处理函数中，可以通过function(e)来接收事件对象e，然后在函数内部使用这个对象来获取事件的相关信息，比如触发事件的元素、事件的类型等。
2. 通过event对象可以获取元素的相关信息，比如获取事件触发的元素，获取鼠标位置等。
这些信息可以帮助开发者更灵活地处理事件。
三、示例以下是一个简单的示例，演示了如何在函数中使用event对象来处理鼠标点击事件。
```// HTML部分<button id="btn">点击我</button>// JavaScript部分document.getElementById('btn').addEventListener('click',function(e) {console.log('触发了点击事件');console.log('事件类型：' + e.type);console.log('触发事件的元素：' + e.target);console.log('鼠标点击的X坐标：' + e.clientX);console.log('鼠标点击的Y坐标：' + e.clientY);});```四、在不同情况下的用法1. 在事件处理函数中，可以根据需要选择是否使用event对象。
如果需要获取事件相关的信息，就可以在函数中使用function(e)，然后通过e来获取相应的信息。
2. 在一些情况下，可能并不需要event对象，比如一些简单的事件处理函数，只需要执行一些特定的操作，不需要获取事件的相关信息。
快速获取鼠标位置的方法
快速获取鼠标位置的方法获取鼠标位置是在计算机编程和用户界面设计中常见的需求。
无论是为了实现鼠标操作的交互功能，还是为了监测和记录鼠标的移动轨迹或点击位置，都需要能够快速准确地获取鼠标的当前位置。
本文将介绍一些常用的方法和技术，帮助开发者快速获取鼠标位置。
1.使用系统API在不同的编程语言和操作系统中，都提供了相应的API函数来获取鼠标位置。
例如，在Windows平台上，可以使用Win32 API的GetCursorPos函数来获取鼠标的屏幕坐标。
在MacOS平台上，可以使用Cocoa框架提供的NSEvent类的locationInWindow方法来获取鼠标的窗口坐标。
2.监听鼠标事件除了主动地获取鼠标位置，还可以通过监听鼠标事件来实时获取鼠标位置。
这种方法适用于需要实时追踪鼠标移动的场景。
通过注册系统提供的鼠标事件回调函数或者使用第三方库来监听鼠标事件，可以获取鼠标移动和点击的事件信息，从中提取出鼠标位置。
3.使用JavaScript获取鼠标位置在Web开发中，可以使用JavaScript来获取鼠标位置。
通过监听鼠标移动事件或者点击事件，可以使用event对象提供的clientX和clientY属性来获取鼠标相对于浏览器窗口的坐标。
如果需要获取鼠标相对于整个文档页面的坐标，则可以使用event对象的pageX和pageY 属性。
需要注意的是，不同浏览器可能会有差异，需要进行兼容性处理。
4.使用跨平台工具为了跨平台地获取鼠标位置，可以使用一些针对多个操作系统的跨平台工具。
这些工具一般是基于底层系统API实现的，提供了一致的接口和方法来获取鼠标位置。
例如，AutoHotkey是一个Windows平台上常用的跨平台工具，可以通过编写脚本来实现鼠标位置的获取。
5.使用第三方库和框架为了简化开发过程和提供更高级的功能，可以使用一些专门的第三方库和框架。
这些库和框架往往提供了更抽象和易用的接口，封装了底层的API调用。
JavaScript实现浏览器网页自动滚动并点击的示例代码
JavaScript实现浏览器⽹页⾃动滚动并点击的⽰例代码1. 打开浏览器控制台窗⼝JavaScript通常是作为开发Web页⾯的脚本语⾔，本⽂介绍的JavaScript代码均运⾏在指定⽹站的控制台窗⼝。
⼀般浏览器的开发者窗⼝都可以通过在当前⽹页界⾯按F12快捷键调出，然后在上⾯的标签栏找到Console点击就是控制台窗⼝，在这⾥可以直接执⾏JavaScript代码，⽽chrome系浏览器的控制台界⾯可以使⽤快捷键Ctrl+Shift+J直接打开2. 实时查看⿏标坐标⾸先为了获取当前的⿏标位置的x、y坐标，需要先重写⼀个onmousemove函数来帮助我们实时查看光标处的x、y值，⽅便下⼀步编写代码时确定初始的y坐标和每次y⽅向滚动的距离// 在控制台输⼊以下内容并回车，即可查看当前⿏标位置// 具体查看⽅式：⿏标在⽹页上滑动时⽆效果，当⿏标悬停时即可在光标旁边看到此处的坐标document.onmousemove = function(e){var x = e.pageX;var y = e.pageY;e.target.title = "X is "+x+" and Y is "+y;};3. 编写⾃动滚动代码具体代码如下，将代码粘贴进控制台并回车，然后调⽤auto_scroll()函数（具体参数含义在代码注释查看）即可运⾏// y轴是在滚动的，每次不⼀样；x坐标也每次从这些⾥⾯随机⼀个var random_x = [603, 811, 672, 894, 999, 931, 970, 1001, 1037, 1076, 1094];// 初始y坐标var position = 200;// 最⼤执⾏max_num次就多休眠⼀下var max_num = 20;// 单位是秒，每当cnt%max_num为0时就休眠指定时间（从数组中任选⼀个），单位是秒var sleep_interval = [33, 23, 47, 37, 21, 28, 30, 16, 44];// 当前正在执⾏第⼏次var cnt = 0;// 相当于random_choice的功能function choose(choices){var index = Math.floor(Math.random() * choices.length);return choices[index];};// 相当于⼴泛的random，返回浮点数function random(min_value, max_value){return min_value + Math.random() * (max_value - min_value);};// 模拟点击⿏标function click(x, y){// x = x - window.pageXOffset;// y = y - window.pageYOffset;y = y + 200;try {var ele = document.elementFromPoint(x, y);ele.click();console.log("坐标 ("+x+", "+y+") 被点击");} catch (error) {console.log("坐标 ("+x+", "+y+") 处不存在元素，⽆法点击")}};// 定时器的含参回调函数function setTimeout_func_range(time_min, time_max, step_min, step_max, short_sleep=true){if(cnt<max_num){cnt = cnt + 1;if(short_sleep){// 短休眠position = position + random(step_min, step_max);x = choose(random_x);scroll(x, position);console.log("滚动到坐标("+x+", "+position+")");click(x, position);time = random(time_min, time_max)*1000;console.log("开始" + time/1000 + 's休眠');setTimeout(setTimeout_func_range, time, time_min, time_max, step_min, step_max);// console.log(time/1000 + 's休眠已经结束');}else{// 长休眠，且不滑动，的回调函数time = random(time_min, time_max)*1000;console.log("开始" + time/1000 + 's休眠');setTimeout(setTimeout_func_range, time, time_min, time_max, step_min, step_max);// console.log(time/1000 + 's休眠已经结束');}}else{cnt = 0;console.log("⼀轮共计"+max_num+"次点击结束");time = choose(sleep_interval)*1000;console.log("开始" + time/1000 + 's休眠');setTimeout(setTimeout_func_range, time, time_min, time_max, step_min, step_max, false);// console.log(time/1000 + 's休眠已经结束（长休眠且不滑动）');}};// ⾃动滚动⽹页的启动函数// auto_scroll(5, 10, 50, 200)表⽰每隔5~10秒滚动⼀次；每次滚动的距离为50~200⾼度function auto_scroll(time_min, time_max, step_min, step_max){time = random(time_min, time_max)*1000;console.log("开始" + time/1000 + 's休眠');setTimeout(setTimeout_func_range, time, time_min, time_max, step_min, step_max);// console.log(time/1000 + 's休眠已经结束');};/*---------以下内容⽆需⽤到，根据情况使⽤----------// ⾃定义click的回调函数// 若绑定到元素，则点击该元素会出现此效果function click_func(e){var a = new Array("富强","民主","⽂明","和谐","⾃由","平等","公正","法治","爱国","敬业","诚信","友善"); var $i = $("<span></span>").text(a[a_idx]);a_idx = (a_idx + 1) % a.length;var x = e.pageX,y = e.pageY;$i.css({"z-index": 999999999999999999999999999999999999999999999999999999999999999999999,"top": y - 20,"left": x,"position": "absolute","font-weight": "bold","color": "rgb("+~~(255*Math.random())+","+~~(255*Math.random())+","+~~(255*Math.random())+")" });$("body").append($i);$i.animate({"top": y - 180,"opacity": 0},1500,function() {$i.remove();});};// 在控制台输⼊以下内容，即可查看当前⿏标位置document.onmousemove = function(e){var x = e.pageX;var y = e.pageY;e.target.title = "X is "+x+" and Y is "+y;};*/代码运⾏效果如下以上就是JavaScript实现浏览器⽹页的⾃动滚动并点击的⽰例代码的详细内容，更多关于JavaScript 浏览器⾃动滚动点击的资料请关注其它相关⽂章！。
getpoint函数
getpoint函数在计算机程序设计中，获取鼠标点击坐标是非常常见的需求。
而getPoint函数便是一个能够获取鼠标坐标的函数。
下面，我们来详细了解一下如何使用getPoint函数。
1.理解getPoint函数的作用getPoint函数可以返回当前鼠标坐标的x，y值。
这意味着我们可以获取用户通过鼠标点击在屏幕上选择的位置，以进行进一步的操作。
2.定义getPoint函数在JavaScript中，我们需要使用以下代码来定义getPoint函数：```function getPoint(event){var x,y;x=event.clientX; //获取鼠标在窗口内的x坐标y=event.clientY; //获取鼠标在窗口内的y坐标return {“x”:x,“y”:y}; //返回x和y坐标}```在这个函数中，我们使用JavaScript的event对象，从中获取鼠标点击事件的坐标信息，并将其存储在变量x和y中。
我们然后将这些信息作为对象的属性返回，以便在编程中进一步使用。
3.使用getPoint函数一旦我们已经定义了getPoint函数，我们可以在我们的程序中使用它来获取鼠标点击坐标。
以下是一个基本的使用getPoint函数的示例代码：```document.addEventListener('click', function(event){var point = getPoint(event);console.log('点击坐标为：' + point.x + ', ' + point.y); });```这个示例代码将在文档中监听点击事件，当用户点击屏幕时，它将调用getPoint函数返回鼠标坐标。
这些坐标将被存储在一个名为“point”的变量中，并使用JavaScript的console.log函数输出在浏览器的控制台上。
4.其他应用getPoint函数也可以用于一些其他场景，如将鼠标点击坐标在浏览器窗口内进行可视化，或将其作为参数来控制应用中的某些元素等等。
Web前端开发基础之JavaScript程序设计知到章节答案智慧树2023年浙江工业职业技术学院
Web前端开发基础之JavaScript程序设计知到章节测试答案智慧树2023年最新浙江工业职业技术学院第一章测试1.下面不属于<script>标签属性的是（）。
参考答案:href2.下列选项中，可以接收用户输入的信息的是（）。
参考答案:prompt()3.下面关于JavaScript的概述不正确的是（）。
参考答案:依赖于操作系统4.下列选项中，可以实现警告框的是（）。
参考答案:alert()5.下面（）标签可在页面中直接嵌入JavaScript。
参考答案:<script>6.下面关于字符串的描述错误的是（）。
参考答案:单引号中使用单引号不需要转义7.下列选项中与++（后置）具有相同优先级的是运算符是（）。
参考答案:--（后置）8.表达式Math.PI.toFixed(2)的运行结果为（）。
参考答案:3.149.函数Object.prototype.toString.call('undefined')的返回值是（）。
参考答案:"[object String]"10.下列选项中，不属于赋值运算符的是（）。
参考答案:==11.下列选项中，在操作9和15时，结果为负数的是（）。
参考答案:“~”12.下面关于逻辑运算符的说法错误的是（）。
参考答案:逻辑运算的返回值是布尔型13.下列语句中可以重复执行一段代码的是（）。
参考答案:while14.下面关于运算符的说法错误的是（）。
参考答案:表达式中赋值运算符总是最后执行的15.以下选项中不属于选择结构语句的是（）。
参考答案:while语句16.以下选项中不属于基本数据类型的是（）。
参考答案:Object17.以下选项中可以保留2位小数的是（）。
参考答案:toFixed()18.下面关于变量的说法错误的是（）。
参考答案:保留字能够作为变量名称使用19.下面关于for语句描述错误的是（）。
参考答案:for循环语句小括号内的分号分割符可以省略20.下列选项中可以将null转换成字符型的是（）。
usemouseinelement解析-概述说明以及解释
usemouseinelement解析-概述说明以及解释1.引言1.1 概述usemouseinelement是一个用于在网页开发中获取鼠标相对于某个元素的位置信息的JavaScript函数。
它能够返回鼠标在该元素上的相对位置，包括鼠标在元素内的x坐标和y坐标，以及鼠标在元素内部的位置百分比。
在网页设计过程中，我们经常会遇到需要根据鼠标位置来实现一些特效或交互功能的情况。
比如，在网页中实现鼠标悬停效果时，我们通常需要获取鼠标相对于某个元素的位置，以便在特定位置触发相应的效果或动画。
而usemouseinelement就是一个强大且方便的工具，可以帮助我们轻松地实现这样的功能。
usemouseinelement的使用方法非常简单。
只需要在需要获取鼠标位置的元素上添加相应的事件监听器，并调用usemouseinelement函数即可。
函数会返回一个包含鼠标相对于元素位置信息的对象，我们可以根据这些信息来实现各种交互效果。
此外，usemouseinelement还具有一些独特的优势和应用场景。
首先，它可以帮助我们更精确地控制页面上的元素，使交互效果更加精细和准确。
其次，它可以方便地实现鼠标跟随效果，让页面更加生动和有趣。
此外，它还可以用于创建一些特殊效果，比如拖拽、放大镜等。
总之，usemouseinelement是一个非常实用的JavaScript函数，在网页开发中具有广泛的应用价值。
它能够帮助我们轻松获取鼠标相对于元素的位置信息，为实现各种交互效果提供了强有力的支持。
在接下来的正文中，我们将详细介绍usemouseinelement的使用方法、优势和应用场景，以及对其发展前景的展望。
1.2 文章结构本文主要分为引言、正文和结论三个部分。
引言部分主要介绍了本篇文章的背景和目的。
首先概述了usemouseinelement的概念和作用，为读者提供一个初步的认识。
接着说明了本文的整体结构，以帮助读者更好地理解和阅读文章。
cesium坐标拾取方法
cesium坐标拾取方法（原创版3篇）《cesium坐标拾取方法》篇1Cesium 是一个流行的开源JavaScript 库，用于在Web 上展示3D 地图和地理数据。
在使用Cesium 时，拾取坐标是非常常见的操作，以下是几种常用的坐标拾取方法：1. 使用Cesium 的内置功能拾取坐标：Cesium 提供了一个built-in feature 来拾取屏幕坐标，您可以使用以下代码来实现：```javascriptviewer.entities.add({name: "潘多拉星球",position: Cesium.Cartesian3.fromDegrees(121.485368, 31.245408, 100),enable Picking: true,highlight: true,click: function(event) {var pick = viewer.entities.getByName("潘多拉星球")[0];var position = pick.position;console.log(position);}});```在这个例子中，我们创建了一个名为"潘多拉星球" 的实体，并使用`enable Picking` 和`highlight` 属性来启用拾取和高亮显示。
当用户点击该实体时，会触发`click` 事件，并通过`pick` 变量获取拾取到的坐标。
2. 使用第三方插件拾取坐标：Cesium 的社区非常活跃，有很多第三方插件可以方便地拾取坐标。
例如，Cesium.GeoPicker 是一个用于拾取地图上点的插件，您可以使用以下代码来实现：```javascriptcesium.GeoPicker.install();viewer.entities.add({name: "潘多拉星球",position: Cesium.Cartesian3.fromDegrees(121.485368, 31.245408, 100),enable Picking: true,highlight: true,click: function(event) {var pick = viewer.entities.getByName("潘多拉星球")[0];var position = pick.position;console.log(position);}});```在这个例子中，我们使用了Cesium.GeoPicker 插件来拾取坐标，并使用了与上述示例相同的实体设置。
javascript触发模拟鼠标点击事件
javascript触发模拟⿏标点击事件事件触发器就是⽤来触发某个元素下的某个事件，IE下fireEvent⽅法，⾼级浏览器（chrome,firefox等）有dispatchEvent⽅法。
⼀般我们在元素上绑定事件后，是靠⽤户在这些元素上的⿏标⾏为来捕获或者触发事件的，或者⾃带的浏览器⾏为事件，⽐如click，mouseover，load等等，有些时候我们需要⾃定义事件或者在特定的情况下需要触发这些事件。
这个时候我们可以使⽤IE下fireEvent⽅法，⾼级浏览器（chrome,firefox等）有dispatchEvent⽅法。
例如在ie下看看这个例⼦：//document上绑定⾃定义事件ondataavailabledocument.attachEvent('ondataavailable', function (event) {alert(event.eventType);});var obj=document.getElementById("obj");//obj元素上绑定click事件obj.attachEvent('onclick', function (event) {alert(event.eventType);});//调⽤document对象的createEventObject⽅法得到⼀个event的对象实例。
var event = document.createEventObject();event.eventType = 'message';//触发document上绑定的⾃定义事件ondataavailabledocument.fireEvent('ondataavailable', event);//触发obj元素上绑定click事件document.getElementById("test").onclick = function () {obj.fireEvent('onclick', event);};fireEvent的createEventObject的再看看⾼级浏览器（chrome,firefox等）的例⼦：//document上绑定⾃定义事件ondataavailabledocument.addEventListener('ondataavailable', function (event) {alert(event.eventType);}, false);var obj = document.getElementById("obj");//obj元素上绑定click事件obj.addEventListener('click', function (event) {alert(event.eventType);}, false);//调⽤document对象的 createEvent ⽅法得到⼀个event的对象实例。
JavaScript焦点事件、鼠标事件和滚轮事件使用详解
window.onmousemove = function() { clickX = event.clientX; clickY = event.clientY; var div = document.createElement("img"); div.src = "hhh.gif" div.style.position = "absolute"; div.style.width = '100px'; div.style.left = clickX + "px"; div.style.top = clickY + "px"; document.body.appendChild(div);
};
页面坐标位置pageX与pageY；
window.onclick = function() { clickX = event.pageX; clickY = event.pageY; var div = document.createElement("img"); div.src = "ppp.png" div.style.position = "absolute"; div.style.width = '100px'; div.style.left = clickX + "px"; div.style.top = clickY + "px"; document.body.appendChild(div);
// if (!((the.tagName == "INPUT" && the.type.toLowerCase() == "text") || the.tagName == "TEXTAREA")) { // return false; // } // return true; // } catch (e) { // return false; // } return false; }
记录鼠标的轨迹并回放的js代码
记录⿏标的轨迹并回放的js代码遇到的问题：Question①：mousemove事件中，移动⽅法中会被记录很多的left和top，我只需要⼤概的⼏组数据就⾏，不需要那么多；Question②：回放的时候，在for循环⾥执⾏太快了，导致的效果就是直接看到开始跟结束位置，我想放慢中间的过程；搞了⼀个延迟的函数，但是还是没有实质性解决。
慢慢慢慢拖动⼩⽅块到⼀个新位置，然后松开⿏标，先点击“复位”，再点击“回放”查看所经过的路径，只有⼀次机会哦 - -|||复制代码代码如下://延迟⽅法sleep: function(n) {var start = new Date().getTime();while (true)if (new Date().getTime() - start > n)break;},//回看轨迹记录backTrack: function() {var oSlippage = document.getElementById("slippage");var len = this.X.length;for (var i = 0; i < len; i++) {oSlippage.style.left = this.X[i] - this.relativeX;oSlippage.style.top = this.Y[i] - this.relativeY;//延迟循环⽅法this.sleep(10);}}还是没有达到慢慢回放的效果，待解决。
啊哈，今早解决了~！不⽤for循环，通过定时器运⽤数组的下标来不断改变⼩⽅块的left和top复制代码代码如下://延迟⽅法sleep: function(n) {//var start = new Date().getTime();//while (true)// if (new Date().getTime() - start > n)// break;var oSlippage = document.getElementById("slippage");oSlippage.style.left = this.X[this.iNum] - this.relativeX; //iNum为数组下标oSlippage.style.top = this.Y[this.iNum] - this.relativeY;MOUSETRACKRECORD.iNum++;//如果下标⼤于了他的长度就停⽌回放if (this.iNum > this.X.length - 1) {clearInterval(this.timeID);}},//回看轨迹记录backTrack: function() {//var oSlippage = document.getElementById("slippage");//var len = this.X.length;//for (var i = 0; i < len; i++) {// oSlippage.style.left = this.X[i] - this.relativeX;// oSlippage.style.top = this.Y[i] - this.relativeY;// //延迟循环⽅法// this.sleep(10);//}this.timeID = setInterval("MOUSETRACKRECORD.sleep()", 10);}演⽰效果：全选注:引⼊外部Js需再刷新⼀下页⾯才能执⾏]⽅块 X: [], //X坐标 Y: [], //Y坐标 clickX: 0, //⿏标点击时的X坐标 clickY: 0, //⿏标点击时的Y坐标relativeX: 0, //⿏标相对⽅块的X坐标 relativeY: 0, //⿏标相对⽅块的Y坐标isCanMove: false, //是否可以移动 iNum: 0, //坐标XY数组的下标 timeID:null, //回放定时器 //⿏标按下的时候 mouseDown:function() { //⿏标点击时this.clickX =event.clientX; this.clickY= event.clientY; //获取⼩⽅块 var oSlippage =document.getElementById("slippage"); //获取div当前坐标(左边界和上边界)var divX =parseInt(oSlippage.style.left) || 0; var divY =parseInt(oSlippage.style.top) || 0; //获取⿏标相对div的坐标 this.relativeX =this.clickX - divX;this.relativeY =this.clickY - divY; //设置可以移动 this.isCanMove= true; }, //⿏标移动的时候 mouseMove:function() { if(this.isCanMove) { varoSlippage =document.getElementById("slippage");oSlippage.style.left =event.clientX -this.relativeX;oSlippage.style.top =event.clientY -this.relativeY; //移动就记录下⿏标的轨迹MOUSETRACKRECORD.startRecord(event.clientX, event.clientY); } }, //⿏标松开的时候 mouseUp:function() { //取消⼩⽅块。
使用高德地图JS获取当前位置和经纬度
使⽤⾼德地图JS获取当前位置和经纬度先看效果，我做的是这样的，可以按地图位置来返回当前你点的位置(图⼀，⼆)，也可以根据输⼊框的⾃动搜索(图三，四)HTML的代码：<div><input type="text" id="keyword" name="keyword" value="" onkeydown='keydown(event)'/><div id="result1" name="result1"></div><div>X：<input type="text" id="lngX" name="lngX" value=""/><br>Y：<input type="text" id="latY" name="latY" value=""/></div></div><div><a id='open'>地图定位</a></div>JS代码：<script type="text/javascript" src="/maps?v=1.3&key=您的Key值"></script><script>var windowsArr = [];document.getElementById('open').onclick = function() {if (document.getElementById('mapContainer').style.display == 'none') {document.getElementById('mapContainer').style.display = 'block';} else {document.getElementById('mapContainer').style.display = 'none';}}var mapObj = new AMap.Map("mapContainer", {resizeEnable: true,view: new AMap.View2D({resizeEnable: true,zoom:13//地图显⽰的缩放级别}),keyboardEnable:false});var marker = new AMap.Marker({map:mapObj,bubble:true})var clickEventListener=AMap.event.addListener(mapObj,'click',function(e){document.getElementById("lngX").value=e.lnglat.getLng();document.getElementById("latY").value=e.lnglat.getLat();AMap.plugin('AMap.Geocoder',function() {var geocoder = new AMap.Geocoder({city: "010"//城市，默认：“全国”});geocoder.getAddress(e.lnglat,function(status,result){if(status=='complete'){// marker.setPosition(e.lnglat);document.getElementById("keyword").value = result.regeocode.formattedAddressdocument.getElementById("result1").innerHTML = ''}else{document.getElementById("result1").innerHTML = '⽆法获取地址'}})})});document.getElementById("keyword").onkeyup = keydown;//输⼊提⽰function autoSearch() {var keywords = document.getElementById("keyword").value;var auto;//加载输⼊提⽰插件AMap.service(["AMap.Autocomplete"], function() {var autoOptions = {city: "" //城市，默认全国};auto = new AMap.Autocomplete(autoOptions);//查询成功时返回查询结果if ( keywords.length > 0) {auto.search(keywords, function(status, result){autocomplete_CallBack(result);});}else {document.getElementById("result1").style.display = "none";}});}//输出输⼊提⽰结果的回调函数function autocomplete_CallBack(data) {var resultStr = "";var tipArr = data.tips;if (tipArr&&tipArr.length>0) {for (var i = 0; i < tipArr.length; i++) {resultStr += "<div id='divid" + (i + 1) + "' onmouseover='openMarkerTipById(" + (i + 1)+ ",this)' onclick='selectResult(" + i + ")' onmouseout='onmouseout_MarkerStyle(" + (i + 1)+ ",this)' style=\"font-size: 13px;cursor:pointer;padding:5px 5px 5px 5px;\"" + "data=" + tipArr[i].adcode + ">" + tipArr[i].name + "<span style='color:#C1C1C1;'>"+ tipArr[i].district + "</span></div>"; }}else {resultStr = " π__π亲,⼈家找不到结果!<br />要不试试：<br />1.请确保所有字词拼写正确<br />2.尝试不同的关键字<br />3.尝试更宽泛的关键字";}document.getElementById("result1").curSelect = -1;document.getElementById("result1").tipArr = tipArr;document.getElementById("result1").innerHTML = resultStr;document.getElementById("result1").style.display = "block";}//输⼊提⽰框⿏标滑过时的样式function openMarkerTipById(pointid, thiss) { //根据id打开搜索结果点tipthiss.style.background = '#CAE1FF';}//输⼊提⽰框⿏标移出时的样式function onmouseout_MarkerStyle(pointid, thiss) { //⿏标移开后点样式恢复thiss.style.background = "";}//从输⼊提⽰框中选择关键字并查询function selectResult(index) {if(index<0){}if (erAgent.indexOf("MSIE") > 0) {document.getElementById("keyword").onpropertychange = null;document.getElementById("keyword").onfocus = focus_callback;}//截取输⼊提⽰的关键字部分var text = document.getElementById("divid" + (index + 1)).innerHTML.replace(/<[^>].*?>.*<\/[^>].*?>/g,"");var cityCode = document.getElementById("divid" + (index + 1)).getAttribute('data');document.getElementById("keyword").value = text;document.getElementById("result1").style.display = "none";//根据选择的输⼊提⽰关键字查询mapObj.plugin(["AMap.PlaceSearch"], function() {var msearch = new AMap.PlaceSearch(); //构造地点查询类AMap.event.addListener(msearch, "complete", placeSearch_CallBack); //查询成功时的回调函数msearch.setCity(cityCode);msearch.search(text); //关键字查询查询});}//定位选择输⼊提⽰关键字function focus_callback() {if (erAgent.indexOf("MSIE") > 0) {document.getElementById("keyword").onpropertychange = autoSearch;}}//输出关键字查询结果的回调函数function placeSearch_CallBack(data) {//清空地图上的InfoWindow和MarkerwindowsArr = [];marker = [];mapObj.clearMap();var resultStr1 = "";var poiArr = data.poiList.pois;var resultCount = poiArr.length;for (var i = 0; i < resultCount; i++) {resultStr1 += "<div id='divid" + (i + 1) + "' onmouseover='openMarkerTipById1(" + i + ",this)' onmouseout='onmouseout_MarkerStyle(" + (i + 1) + ",this)' style=\"font-size: 12px;cursor:pointer;padding:0px 0 4px 2px; border-bottom:1px s resultStr1 += TipContents(poiArr[i].type, poiArr[i].address, poiArr[i].tel) + "</td></tr></table></div>";addmarker(i, poiArr[i]);}mapObj.setFitView();}//⿏标滑过查询结果改变背景样式，根据id打开信息窗体function openMarkerTipById1(pointid, thiss) {thiss.style.background = '#CAE1FF';windowsArr[pointid].open(mapObj, marker[pointid]);}//添加查询结果的marker&infowindowfunction addmarker(i, d) {var lngX = d.location.getLng();var latY = d.location.getLat();var markerOption = {map:mapObj,icon:"/images/" + (i + 1) + ".png",position:new AMap.LngLat(lngX, latY)};var mar = new AMap.Marker(markerOption);marker.push(new AMap.LngLat(lngX, latY));var infoWindow = new Window({content:"<h3><font color=\"#00a6ac\"> " + (i + 1) + ". " + + "</font></h3>" + TipContents(d.type, d.address, d.tel),size:new AMap.Size(300, 0),autoMove:true,offset:new AMap.Pixel(0,-30)});windowsArr.push(infoWindow);var aa = function (e) {var nowPosition = mar.getPosition(),lng_str = nowPosition.lng,lat_str = t;infoWindow.open(mapObj, nowPosition);document.getElementById("lngX").value = lng_str;document.getElementById("latY").value = lat_str;};AMap.event.addListener(mar, "mouseover", aa);}//infowindow显⽰内容function TipContents(type, address, tel) { //窗体内容if (type == "" || type == "undefined" || type == null || type == " undefined" || typeof type == "undefined") {type = "暂⽆";}if (address == "" || address == "undefined" || address == null || address == " undefined" || typeof address == "undefined") {address = "暂⽆";}if (tel == "" || tel == "undefined" || tel == null || tel == " undefined" || typeof address == "tel") {tel = "暂⽆";}var str = " 地址：" + address + "<br /> 电话：" + tel + " <br /> 类型：" + type;return str;}function keydown(event){var key = (event||window.event).keyCode;var result = document.getElementById("result1")var cur = result.curSelect;if(key===40){if(cur + 1 < result.childNodes.length){if(result.childNodes[cur]){result.childNodes[cur].style.background='';}result.curSelect=cur+1;result.childNodes[cur+1].style.background='#CAE1FF';document.getElementById("keyword").value = result.tipArr[cur+1].name;}}else if(key===38){if(cur-1>=0){if(result.childNodes[cur]){result.childNodes[cur].style.background='';}result.curSelect=cur-1;result.childNodes[cur-1].style.background='#CAE1FF';document.getElementById("keyword").value = result.tipArr[cur-1].name;}}else if(key === 13){var res = document.getElementById("result1");if(res && res['curSelect'] !== -1){selectResult(document.getElementById("result1").curSelect);}}else{autoSearch();}}基本就是这样了。
js获取鼠标点击位置
js获取鼠标点击位置js获取鼠标点击的位置常用的是event.clientX和event.clientY分别获取横向的和纵向的位置，但仅使用这个方法是不够的，因为event.clientX和event.clientY获取的鼠标位置是相对于当前屏幕的，而不考虑页面的滚动条所滚动的距离。
对于这种情况可以使用以下方法(C来的-_-!)：1. function pointerX()2. {3. return event.pageX || (event.clientX + (document.documentElement.scrollLeft || document.body.scrollLeft));4. }5.6. function pointerY()7. {8. return event.pageY || (event.clientY + (document.documentElement.scrollTop || document.body.scrollTop));9. }两个方法分别获得相对整个页面(而不是屏幕)的鼠标位置event.pageX是在FF中所支持的，这样就实现了跨浏览器操作只需在其他方法中调用这两个函数就可1. function getPointPosition()2. {3. var x_px_scr = event.clientX;4. var y_px_scr = event.clientY;5. alert("相对于当前屏幕的X轴偏移量" + x_px_scr);6. alert("相对于当前屏幕的Y轴偏移量" + y_px_scr);7.8. var x_Px_page = pointerX();9. var y_Px_page = pointerY();10. alert("相对于整个页面的X轴偏移量" + x_Px_page);11. alert("相对于整个页面的Y轴偏移量" + y_Px_page);12. }JS获取鼠标的坐标和滚动条的位置一、相对窗口，当然是以浏览器窗口为主了，即浏览器中可见部分（即包含文档部分）的左上角为坐标原点。
js取路径的方法
js取路径的方法在JavaScript中，您可以使用以下方法来获取路径：1. 使用window.location对象您可以使用window.location对象来获取当前文档的路径信息。
例如，要获取完整的URL路径，可以使用`window.location.href`。
如果只想获取路径部分而不包括协议和域名，可以使用`window.location.pathname`。
示例：javascriptconsole.log(window.location.href); // 输出完整的URL路径console.log(window.location.pathname); // 输出路径部分2. 使用document对象您还可以使用document对象来获取当前文档的路径信息。
通过document对象的属性可以获得URL的各个部分。
示例：javascriptconsole.log(document.URL); // 输出完整的URL路径console.log(document.location.href); // 输出完整的URL路径（与document.URL相同）console.log(document.location.pathname); // 输出路径部分3. 使用location对象JavaScript还提供了一个location对象，它包含了有关当前页面的URL信息。
通过location对象，您可以获取路径、搜索参数、哈希等信息。
示例：javascriptconsole.log(location.href); // 输出完整的URL路径console.log(location.pathname); // 输出路径部分这些是在JavaScript中获取路径信息的常用方法。
根据您的具体需求，选择适合的方法来获取路径。
js获取光标位置几种方法
js获取光标位置几种方法js文章2009-04-01 15:41:56 阅读303 评论0 字号：大中小订阅1。
==================使用TextRange获取输入框中光标的位置===================TextRange是用来表现H TML元素中文字的对象，虽然我们平时不太常用这个对象，可是它却在IE4.0中就已提供了。
不过TextRange提供的调用方法却都比较晦涩，那么我们能拿它做些什么呢？TextRange的传统用途是对用户在Web页上用鼠标圈选的文字内容的操作，比如变化、删除、新增等。
但其经典的用途却是，在Web页面中查找文字(这个比较简单)和获取输入框光标的位置。
其中后者又有可以衍生出很多更有用的用途，比如：限制输入的MaskTextBox，其核心技术点就是获取输入框的光标位置，然后使用正则表达式判断输入内容。
还有我后面会介绍的"使用方向键在输入框矩阵中自然的导航"，核心技术点也是获取输入框中的光标位置。
获取输入框中的光标位置的整个代码其实很短，只是这些对象和方法不太常用而已。
<script language="javascript">function GetCursorPsn(txb){var slct = document.selection;var rng = slct.createRange();txb.select();rng.setEndPoint("StartToStart", slct.createRange());var psn = rng.text.length;rng.collapse(false);rng.select();return psn;}</script>要彻底的弄清楚TextRange的具体用法，需要了解与其相关的一些内容，请参考MSDN。
怎么用js获取鼠标移动坐标
怎么用js获取鼠标移动坐标学习前端的同学你们知道怎么用js获取鼠标移动坐标吗?不知道的话跟着店铺一起来学习了解用js获取鼠标移动坐标的方法。
用js获取鼠标移动坐标的实例介绍1、文字描述起来挺拗口的，看图大部分源码：【注意：】实用jQuery之前必须导入：<script type="text/javascript" src="/langfei520@yeah/blog/../js/jquery-1.6.4.js"></script><body><input type="checkbox" value="篮球"> 篮球<input type="checkbox" value="排球"> 排球<input type="checkbox" value="羽毛球"> 羽毛球<input type="checkbox" value="乒乓球"> 乒乓球<input type="button" value="选中的个数"><input type="button" value="依次显示选中的value"><script type="text/javascript">$("input[value='选中的个数']").click(function() {var size = $(":checkbox:checked").size();//显示alert(size);});$("input[value='依次显示选中的value']").click(function() {$(":checkbox:checked").each(function() {var txt = $(this).val();alert(txt);});});</script></body>2、显示鼠标移动坐标源码<body>x=<input type="text" id="xID" readonly="readonly"/><br/> y=<input type="text" id="yID" readonly="readonly"/><script type="text/javascript">$(document).mousemove(function(){$("#xID").val(event.clientX);$("#yID").val(event.clientY);});</script></body>。
JavaScript中的鼠标事件
JavaScript中的⿏标事件昨天突发奇想，想做⼀个模拟的⿏标点击⽣成⼩球往下掉的效果。
于是涉及到了js中⼀些⿏标点击事件，接下来我来总结顺便复习⼀下。
⿏标事件包括七个：1. mousedown ⿏标点击按下2. mouseup ⿏标点击抬起3. mouseover ⿏标悬浮4. mouseout ⿏标移出5. mouseenter ⿏标进⼊6. mouseleave ⿏标移出7. mousemove ⿏标移动问题1: mouseout和mouseleave代表的都是⿏标移出事件，那么它们有什么区别呢？接下来准备⼀份html⽂件来做个例⼦HTML部分<div class="big" onmouseout="handleMouseout()" onmouseleave="handleMouseleave()"><div class="sub1">⼦元素1</div><div class="sub2">⼦元素2</div></div>CSS部分.big {width: 400px;height: 400px;background: #aaa;}.sub1 {width: 100px;height: 100px;background: #666;}.sub2 {position: relative;top: 50px;left: 50px;width: 100px;height: 100px;background: #666;}JS部分function handleMouseout () {console.log("mouse out of the {big}")}function handleMouseleave () {console.log("mouse leave of the {big}")}可以看到，当⿏标从「class="big"」的元素中离开时，触发了两个事件mouseout&mouseleave,仅仅如此还不⾜以看出它俩的区别。
实时js获取鼠标坐标位置的方法
实时js获取鼠标坐标位置的方法实时获取鼠标坐标位置是前端开发中经常会遇到的需求之一，可以通过鼠标事件来实现。
在JavaScript中，我们通常使用mousemove 事件来获取鼠标的实时坐标位置。
首先，我们可以为页面的整个文档添加一个mousemove事件监听器。
这样，无论鼠标在文档的任何位置移动，都可以触发事件，从而获取鼠标的坐标。
```javascriptdocument.addEventListener('mousemove', function(event) { var x = event.clientX; //获取鼠标相对于视口的水平坐标var y = event.clientY; //获取鼠标相对于视口的垂直坐标console.log('鼠标位置：' + x + ', ' + y);});```在上述代码中，我们使用了event.clientX和event.clientY分别获取鼠标在视口的坐标位置。
这里需要注意的是，clientX和clientY会根据滚动条的位置而改变，即使页面有滚动。
如果需要获取鼠标在文档的坐标位置，可以使用event.pageX和event.pageY。
这两个属性同样会受到滚动条的影响。
```javascriptdocument.addEventListener('mousemove', function(event) { var x = event.pageX; //获取鼠标相对于文档的水平坐标var y = event.pageY; //获取鼠标相对于文档的垂直坐标console.log('鼠标位置：' + x + ', ' + y);});```除了mousemove事件，我们还可以使用mouseenter和mouseleave 事件来实时获取鼠标的坐标位置。
js获取鼠标当前的位置
js获取⿏标当前的位置 有时候，我们需要得到窗⼝拖动或者⿏标移动的距离，此时可以通过计算⿏标前后在页⾯中的位置来得到想要的结果，下⾯介绍⼏个事件属性:1、客户区坐标位置 ⿏标事件都是在浏览器视⼝中的特定位置上发⽣的。
这个位置信息保存在事件对象的clientX和clientY属性中。
它们的值表⽰事件发⽣时⿏标指针在视⼝中的⽔平和垂直坐标（不包括页⾯滚动的距离）。
如下图所⽰：var div = document.getElementById("myDiv"); //获取元素EventUtil.on(div, "click", function(event){event = EventUtil.getEvent(event);alert("Screen coordinates: " + event.screenX + "," + event.screenY);});注：其中，EventUtil.on()表⽰为元素绑定事件，EventUtil.getEvent(event)表⽰获取事件对象。
EventUtil是⾃定义的事件对象（使⽤JavaScript实现），⾥⾯包含了⼀些跨浏览器的⽅法，具体实现，请看另⼀篇⽂章。
如果项⽬使⽤了jQuery插件，可相应的替换成对应的⽅法。
2、页⾯坐标位置 事件对象属性pageX和pageY，能告诉你事件是在页⾯中的什么位置发⽣的。
换句话说，这两个属性表⽰⿏标光标在页⾯中的位置（相当于⿏标在窗⼝中的位置坐标 + 页⾯滚动的距离）。
var div = document.getElementById("myDiv");//获取id为"myDiv"的元素EventUtil.on(div, "click", function(event){//为元素绑定click事件event = EventUtil.getEvent(event);//获取event事件对象var pageX = event.pageX,pageY = event.pageY;if (pageX === undefined){//IE8及更早版本pageX = event.clientX + (document.body.scrollLeft || document.documentElement.scrollLeft);}if (pageY === undefined){pageY = event.clientY + (document.body.scrollTop || document.documentElement.scrollTop);}alert("Page coordinates: " + pageX + "," + pageY);});3、屏幕坐标位置 通过screenX和screenY属性就可以确定⿏标事件发⽣时⿏标指针相对于整个屏幕的坐标信息。
js获取元素 绝对位置坐标 的方法
js获取元素绝对位置坐标的方法文章标题：深度剖析：JavaScript获取元素绝对位置坐标的方法在网页开发中，经常会遇到需要获取元素在页面中的绝对位置坐标的情况，以便进行一些定位或者交互操作。
本文将从简单到深入，逐步剖析JavaScript获取元素绝对位置坐标的方法，以便读者能够全面、深刻理解这一重要的知识点。
一、基础知识点：理解页面布局和坐标系统在开始讨论JavaScript获取元素绝对位置坐标的方法之前，首先需要理解页面的布局和坐标系统。
页面布局通常采用盒模型，而坐标系统是以页面的左上角为原点，向右为x轴正方向，向下为y轴正方向。
这一基础知识对于后续的内容非常重要。
二、方法一：offsetTop和offsetLeft属性JavaScript提供了元素对象的offsetTop和offsetLeft属性，这两个属性分别表示了元素相对于其offsetParent元素的上边缘和左边缘的距离。
通过递归遍历offsetParent元素，可以计算出元素在页面中的绝对位置坐标。
但需要注意的是，offsetTop和offsetLeft属性受到元素的定位、边距、边框等因素的影响，需要综合考虑才能得到准确的结果。
三、方法二：getBoundingClientRect方法除了offsetTop和offsetLeft属性，JavaScript还提供了getBoundingClientRect方法来获取元素的位置信息。
这个方法返回一个DOMRect对象，包含了元素的上下左右边界的位置信息。
通过这些信息，可以轻松计算出元素在页面中的绝对位置坐标。
四、方法三：pageX和pageY属性当需要获取鼠标事件的绝对位置坐标时，可以使用鼠标事件对象的pageX和pageY属性。
这两个属性表示了鼠标相对于页面左上角的位置坐标，可以直接获取到鼠标点击位置的绝对坐标。
五、总结回顾通过本文的介绍，我们深入了解了JavaScript获取元素绝对位置坐标的方法。
- 1、下载文档前请自行甄别文档内容的完整性，平台不提供额外的编辑、内容补充、找答案等附加服务。
- 2、"仅部分预览"的文档,不可在线预览部分如存在完整性等问题,可反馈申请退款(可完整预览的文档不适用该条件!)。
- 3、如文档侵犯您的权益，请联系客服反馈,我们会尽快为您处理(人工客服工作时间：9:00-18:30)。
JavaScript 获取鼠标点击位置坐标
在一些DOM操作中我们经常会跟元素的位置打交道，鼠标交互式一个经常用到的方面，令人失望的是不同的浏览器下会有不同的结果甚至是有的浏览器下没结果，这篇文章就上鼠标点击位置坐标获取做一些简单的总结，没特殊声明代码在IE8，FireFox，Chrome下进行测试兼容
鼠标点击位置坐标相对于屏幕
如果是涉及到鼠标点击确定位置相对比较简单，获取到鼠标点击事件后，事件screenX，screenY获取的是点击位置相对于屏幕的左边距与上边距，不考虑iframe因素，不同浏览器下表现的还算一致。
function getMousePos(event) {
var e = event || window.event;
return {'x':e.screenX,'y':screenY}
}
相对浏览器窗口
简单代码即可实现，然而这是还不够，因为绝大多数情况下我们希望获取鼠标点击位置相对于浏览器窗口的坐标，event的clientX，clientY属性分别表示鼠标点击位置相对于文档的左边距，上边距。
于是类似的我们写出了这样的代码function getMousePos(event) {
var e = event || window.event;
return {'x':e.clientX,'y':clientY}
}
相对文档
简单测试也没什么问题，但是clientX与clientY获取的是相对于当前屏幕的坐标，忽略页面滚动因素，这在很多条件下很有用，但当我们需要考虑页面滚动，也就是相对于文档（body 元素）的坐标时怎么办呢？加上滚动的位移就可以了，下边我们试试怎么计算页面滚动的位移。
其实在Firefox下问题会简单很多，因为Firefox支持属性pageX,与pageY属性，这两个属性已经把页面滚动计算在内了。
在Chrome可以通过document.body.scrollLeft，document.body.scrollTop计算出页面滚动位移，而在IE下可以通过document.documentElement.scrollLeft ，document.documentElement.scrollTop
function getMousePos(event) {
var e = event || window.event;
var scrollX = document.documentElement.scrollLeft || document.body.scrollLeft;
var scrollY = document.documentElement.scrollTop || document.body.scrollTop;
var x = e.pageX || e.clientX + scrollX;
var y = e.pageY || e.clientY + scrollY;
//alert('x: ' + x + '\ny: ' + y);
return { 'x': x, 'y': y };
}
getBoundingClientRect() 来获取页面元素的位置
document.documentElement.getBoundingClientRect
下面这是MSDN的解释：
SyntaxoRect = object.getBoundingClientRect()
Return Value
Returns a TextRectangle object. Each rectangle has four integer properties (top, left, right, and bottom) that represent a coordinate of the rectangle, in pixels.
Remarks
This method retrieves an object that exposes the left, top, right, and bottom coordinates of the union of rectangles relative to the client's upper-left corner. In Microsoft Internet Explorer 5, the window's upper-left is at 2,2 (pixels) with respect to the true client.
还是实际解释下，该方法获得页面中某个元素的左，上，右和下分别相对浏览器视窗的位置。
也不好理解，下面用图说明下。
该方法已经不再是IE Only了，FF3.0+和Opera9.5+已经支持了该方法，可以说在获得页面元素位置上效率能有很大的提高，在以前版本的Opera和Firefox中必须通过循环来获得元素在页面中的绝对位置。
下面的代码举了个简单的例子，可以滚动滚动条之后点红色区域看各个值的变化。
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Demo</title>
</head>
<body style="width:2000px; height:1000px;">
<div id="demo" style="position:absolute; left:518px; right:100px; width:500px; height:500px; background:#CC0000; top: 114px;">Demo为了方便就直接用绝对定位的元素</div>
</body>
</html>
<script>
document.getElementById('demo').onclick=function (){
if (document.documentElement.getBoundingClientRect) {
alert("left:"+this.getBoundingClientRect().left)
alert("top:"+this.getBoundingClientRect().top)
alert("right:"+this.getBoundingClientRect().right)
alert("bottom:"+this.getBoundingClientRect().bottom)
var X= this.getBoundingClientRect().left+document.documentElement.scrollLeft;
var Y = this.getBoundingClientRect().top+document.documentElement.scrollT op;
alert("Demo的位置是X:"+X+";Y:"+Y)
}
}
</script>
有了这个方法，获取页面元素的位置就简单多了，var X= this.getBoundingClientRect().left+document.documentElement.scrollLeft;
var Y =this.getBoundingClientRect().top+document.documentElement.scrollT op;
//获取元素的中心点方法：
function getMousePos(obj) {var ro = obj.getBoundingClientRect();var pwc = parseInt(ro.right - ro.left)/2;var phc = parseInt(ro.bottom - ro.top)/2;var posX = ro.left+document.documentElement.scrollLeft+pwc; var posY = ro.top+document.documentElement.scrollTop+phc;return {x:posX, y:posY}; }。