Chạy Thử Sự kiện onmousemove không gán trực tiếp trong JavaScript

Trình soạn thảo - Chạy Thử Sự kiện onmousemove không gán trực tiếp trong JavaScript

Kết quả - Chạy Thử Sự kiện onmousemove không gán trực tiếp trong JavaScript

Tự code rồi chạy thử... Chạy Thử 
<!DOCTYPE html>
<html>
<head>
<title>Chạy Thử Sự kiện onmousemove không gán trực tiếp trong JavaScript</title>
</head>
<style>
#ktrai{width:49%;float:left;height:auto}
#kvuong{width:100%;height:200px;float:left;line-height:200px;text-align:center;background:red;margin-bottom:10px}
#kphai{width:49%;float:right;height:auto}
#kvuong2{width:100%;height:200px;float:left;line-height:200px;text-align:center;background:red;margin-bottom:10px}
</style>
<body>

<h1>Chạy Thử Sự kiện onmousemove không gán trực tiếp trong JavaScript</h1>
<p>Dùng để lấy tọa độ X và tọa độ Y của con trỏ chuột mỗi khi di chuyển con chuột:</p>

<div id="ktrai">
<div id="kvuong" onmousemove="layToaDo(event)">Di chuyển</div>
<p>Tọa độ X: <span id="x"></span> - Tọa độ Y: <span id="y"></span></p>
</div>

<div id="kphai">
<div id="kvuong2" onmousemove="layToaDo(event)">Di chuyển</div>
<p>Tọa độ X: <span id="x2"></span> - Tọa độ Y: <span id="y2"></span></p>
</div>

<script>
 var kvuong = document.getElementById('kvuong');
 kvuong.onmousemove = function(e){
 var x = e.clientX;
 var y = e.clientY;
 document.getElementById("x").innerHTML = x;
 document.getElementById("y").innerHTML = y;
 };
 
 var kvuong2 = document.getElementById('kvuong2');
 kvuong2.addEventListener('mousemove', function(e){
 var x = e.clientX;
 var y = e.clientY;
 document.getElementById("x2").innerHTML = x;
 document.getElementById("y2").innerHTML = y;
 }); 
</script>

</body>
</html>