写上<!DOCTYPE html>后就无法输出
1
悬赏园豆：10
[已解决问题]
解决于 2019-03-25 16:18
<!DOCTYPE html>
<html lang="en">
<head>
</head>
<body onmousedown="show_coords(event)">
<script>
function show_coords(event) {
x = event.clientX;
y = event.clientY;
console.log("X coords: " + x + ", Y coords: " + y)
}
</script>
</body>
</html>
下面的代码和上面的一样，就是去掉了<!DOCTYPE html>，可以显示打印的结果，写上<!DOCTYPE html>就不显示打印结果，也不报错，什么原因？
<html lang="en">
<head>
</head>
<body onmousedown="show_coords(event)">
<script>
function show_coords(event) {
x = event.clientX;
y = event.clientY;
console.log("X coords: " + x + ", Y coords: " + y)
}
</script>
</body>
</html>
最佳答案
2
加上 <!DOCTYPE html> 标签，浏览器识别文档类型后，会去找body，但是你body没有内容，所以无法触发鼠标事件，你试试给body里面加个标签，就能触发了；
不加 <!DOCTYPE html> 标签，浏览器默认整个文档都是body内容，所以随便点击都能触发。
收获园豆：10
我按你说的，给body里面加了一个button，运行后只有点击button才能出现坐标，点击其他位置还是不行呢？
@qianduanxueqi: 因为你是触发body事件，body里面就一个button。你可以试着加一个div，然后设置全屏，这样就可以随便点了
其他回答(2)
1
鼠标位置点击事件，可以绑在document的click上，body有高度和宽度，没有内容的时候，就没办法触发了。
用下面的语句即可：
window.document.onclick = show_coords;
