首页 新闻 搜索 专区 学院

写上<!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>

qianduanxueqi的主页 qianduanxueqi | 初学一级 | 园豆:100
提问于:2019-03-06 14:59
< >
分享
最佳答案
2

加上 <!DOCTYPE html> 标签,浏览器识别文档类型后,会去找body,但是你body没有内容,所以无法触发鼠标事件,你试试给body里面加个标签,就能触发了;
不加 <!DOCTYPE html> 标签,浏览器默认整个文档都是body内容,所以随便点击都能触发。

收获园豆:10
三人乐乐 | 老鸟四级 |园豆:3250 | 2019-03-06 15:24

我按你说的,给body里面加了一个button,运行后只有点击button才能出现坐标,点击其他位置还是不行呢?

qianduanxueqi | 园豆:100 (初学一级) | 2019-03-06 21:32

@qianduanxueqi: 因为你是触发body事件,body里面就一个button。你可以试着加一个div,然后设置全屏,这样就可以随便点了

三人乐乐 | 园豆:3250 (老鸟四级) | 2019-03-07 09:28
其他回答(2)
0
ycyzharry | 园豆:22507 (高人七级) | 2019-03-06 15:19
1

鼠标位置点击事件,可以绑在document的click上,body有高度和宽度,没有内容的时候,就没办法触发了。
用下面的语句即可:
window.document.onclick = show_coords;

_wxyz | 园豆:256 (菜鸟二级) | 2019-03-07 14:48
清除回答草稿
   您需要登录以后才能回答,未注册用户请先注册