Javascript: Phương thức addEventListener thêm xử lý sự kiện

Javascript: Phương thức addEventListener thêm xử lý sự kiện

Phương thức document.addEventListener() thêm một đoạn chương trình xử lý sự kiện vào đối tượng document.

Bạn cũng có thể sử dụng phương thức element.addEventListener() để đính kèm một trình xử lý sự kiện vào một phần tử được chỉ định.

Cú pháp

document.addEventListener(event, function)
event Bắt buộc.

Một chuỗi chỉ định tên của sự kiện.

Lưu ý: Không sử dụng tiền tố on. Ví dụ: sử dụng click thay vì onclick.

function Bắt buộc.

Chỉ định hàm để chạy khi sự kiện xảy ra.

Khi sự kiện xảy ra, một đối tượng sự kiện được truyền cho hàm dưới dạng tham số đầu tiên. Loại đối tượng sự kiện phụ thuộc vào sự kiện được chỉ định. Ví dụ: sự kiện click thuộc đối tượng MouseEvent.

Giá trị trả về

Không có giá trị trả về

Phiên bản DOM: DOM Level 2 Events

Ví dụ

Gắn sự kiện nhấp chuột vào document. Khi người dùng nhấp vào bất kỳ đâu trong trang HTML, xuất câu Hello World vào phần tử <p>id="demo":

<!DOCTYPE html>
<html>
<body>
	<p>This example uses the addEventListener() method to attach a click event to the document.</p>
	<p>Click anywhere in the document.</p>
	<p><strong>Note:</strong> The addEventListener() method is not supported in Internet Explorer 8 and earlier versions.</p>
	<p id="demo"></p>
	<script>
		document.addEventListener("click", function()
			{
				document.getElementById("demo").innerHTML = "Hello World!";
			});
	</script>
</body>
</html>

Bạn cũng có thể tham chiếu tới một hàm được đặt khai báo ở đâu đó:

<!DOCTYPE html>
<html>
<body>
	<p>This example uses the addEventListener() method to execute a function when a user clicks anywhere in the document.</p>
	<p id="demo"></p>
	<script>
		document.addEventListener("click", myFunction);
		function myFunction()
		{
			document.getElementById("demo").innerHTML = "Hello World";
		}
	</script>
</body>
</html>

Các tính năng mặc định của trang web

Các trang web được Đại Phố thiết kế luôn mặc định các tính năng sau:

  • Mã nguồn được tối ưu với các công cụ tìm kiếm.
  • Trang web hỗ trợ thiết bị di động, tương thích với mọi thiết bị: điện thoại, máy tính bảng, máy tính và laptop. Sử dụng công nghệ HTML5, CSS3 Mobile Responsive.
  • Dễ dàng thay đổi theo phong cách riêng của bạn.
  • Dễ dàng thêm bớt số lượng các trang, và chỉnh sửa nội hiển thị trên website tùy ý
  • Phần quản trị rõ ràng, trực quan, dễ sử dụng với cả những người không chuyên về IT.

Quản lí nội dung: có thể dễ dàng thêm, xóa, sửa các thông tin trên website

  • Thông tin sản phẩm và dịch vụ của công ty
  • Thông tin dự án, đối tác Giới thiệu – Liên hệ
  • Thông tin giới thiệu, thông tin liên hệ
  • Tin tức
  • Hình ảnh trên website, sửa các tag alt, descriotion, caption
  • Hình ảnh và caption trên Slideshow
Xin vui lòng liên hệ với chúng tôi nếu cần thêm thông tin