Bảng lịch học

Tài liệu tham khảo JS

JavaScript

Cửa sổ

HTML DOM

API Web

Đối tượng HTML

Tham khảo thêm

Khóa học tự chọn

Khuyến nghị khóa học:

Tủ đồ CodeW3C.com

Thuộc tính MouseEvent clientX

Sự kiện DOM MouseEvent

Định nghĩa và cách sử dụng

Khi sự kiện chuột được kích hoạt, thuộc tính clientX trả về tọa độ ngang của con trỏ chuột (theo khu vực khách hàng).

Khu vực khách hàng là cửa sổ hiện tại.

Lưu ý:Để lấy tọa độ thẳng của con trỏ chuột (theo khu vực khách hàng), hãy sử dụng Thuộc tính clientY.

Chú thích:Thuộc tính này chỉ đọc.

Mô hình

Ví dụ 1

In tọa độ con trỏ chuột khi nút chuột được nhấn trên phần tử:

var x = event.clientX;     // Lấy tọa độ ngang
var y = event.clientY;     // Lấy tọa độ thẳng
var coor = "tọa độ X: " + x + ", tọa độ Y: " + y;

Thử ngay

Ví dụ 2

In tọa độ con trỏ chuột khi con trỏ chuột di chuyển trên phần tử:

var x = event.clientX;
var y = event.clientY; 
var coor = "tọa độ X: " + x + ", tọa độ Y: " + y;
document.getElementById("demo").innerHTML = coor;

Thử ngay

Ví dụ 3

Giải thích sự khác biệt giữa clientX và clientY cũng như screenX và screenY:

var cX = event.clientX;
var sX = event.screenX;
var cY = event.clientY;
var sY = event.screenY;
var coords1 = "tọa độ khách hàng - X: " + cX + ", tọa độ Y: " + cY;
var coords2 = "tọa độ màn hình - X: " + sX + ", tọa độ Y: " + sY;

Thử ngay