1、新建一个html页面,命名为test.html,用于讲解如何用js取得鼠标所在位置的html元素属性。
2、在test.html页面,使用table表格标签创建四个表格,每人表格有一个单元格。代码如下:
3、在table的下面,使用span创建鼠标位置显示区,并设置其id属性为show,方便下面获得该对象,把获得的元素属性显示在这里。
4、给body标签绑定onmousemove事件,当鼠标放在页面上时,执行pos()方法,获得元素对象并显示其id属性。
5、在js里,新建一个fnGetTable()函数,用于判断鼠标是否放在table表格的单元格上,如果是放在单元格上,则把当前的表格对象返回。
6、在pos()函数内,使用elementFromPoint通过鼠标的x,y坐标获得元玟姑岭箫素对象,通过fnGetTable()函数判断是否是单元格元素,如果是单元格元素,则获得当前的table表格的id属性,并把id的属性值显示在span标签内。
7、在浏览器打开test.html页面,把鼠标放在单元格上,获得鼠标所有位置的html元素的属性值,把table的id显示在span标签内。