<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> <style> body { margin: 0; } #box { width: 300px; height: 300px; border: 1px solid red; margin:10px 100px 10px 100px ; } </ style > </ head > < body > < div ID = "Box" > </ div > < Script the src = "common.js" > </ Script > < Script > var Box = Document .getElementById ( ' box ' ); box.onclick = function (E) { // Get position in the box on the page // the console.log (this.offsetLeft); //the console.log (this.offsetTop); E = E || the window.event; // Get the mouse position in the box = coordinates of the mouse - the coordinates of the box // var X = e.pageX var X = the getPage (E) .pageX - the this .offsetLeft; var Y = the getPage (E) .pageY - the this .offsetTop; the console.log (X); the console.log (Y); } </ Script > </ body > </ HTML >