onclick和addEventListener的区别,screenx影厅好吗
1、offsetX
offset表示偏移，即事件对象的左上角与原点的距离。 以元素框模型内容区域的左上角为基准点。 不包括边框。
2、clientX
事件对象相对于浏览器窗口显示区域的x、y坐标(窗口坐标)，显示区域不包含工具栏和滚动条
3、pageX
事件对象相对于整个文档的坐标以像素为单位。
4、screenX
当您更改屏幕分辨率时，事件对象相对于设备屏幕左上角的坐标会随之改变
上述除了screenX/Y是装置像素单位以外，所有都是css像素单位
举一个例子来说明
Title html，body{
边距： 0自动；
padding: 0；
}
#canvas{
border :20 px固态蓝；
边距-左： 300 px；
}
var canvas=document.getelementbyid (canvas )；
varCTX=canvas.getcontext('2d )；
CTX.arc (0，0，5，0，2 * math.pi )；
CTX.arc (200，200，5，0，2 * math.pi )；
ctx.font='20px Arial '；
ctx.textAlign='start '；
ctx.fillText (画布坐标200 200 )、200、200 )；
ctx.fill (；
canvas.nmusedwn=function(e ) {
console.log('e.offsetX='，e.offsetx )；
console.log('e.clientX='，e.clientx )；
console.log('e.pageX='，e.pagex )；
console.log('e.screenX='，e.screenx )；
}
如果没有滚动条，则pageX==clientX，offsetx=pagex(margin-left ) border
有滚动条的时候，pageX！=客户端tx