Thuộc tính sự kiện onclick trong HTML

Thuộc tính sự kiện onclick trong HTML được kích hoạt khi bạn nhấp chuột vào một phần tử HTML trong tài liệu HTML.

Cú pháp

Cú pháp như sau:

<tagname onclick="script"></tagname>

Ví dụ

Dưới đây là ví dụ minh họa thuộc tính sự kiện onclick trong HTML:

<!DOCTYPE html>
<html>
<head>
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <style>
    body {
      color: #000;
      height: 100vh;
      background-color: #FBAB7E;
      background-image: linear-gradient(62deg, #FBAB7E 0%, #F7CE68 100%);
      text-align: center;
      padding: 20px;
    }
    .btn {
      background: #db133a;
      border: none;
      height: 2rem;
      border-radius: 2px;
      width: 40%;
      display: block;
      color: #fff;
      outline: none;
      cursor: pointer;
      margin: 1rem auto;
    }
    .show {
      font-size: 1.2rem;
    }
  </style>
</head>
<body>
<h1>Demo thuộc tính sự kiện onclick trong HTML</h1>
<button class="btn" onclick='clickFn()'>Nhấn vào tôi</button>
<div class="show"></div>
<script>
  function clickFn() {
    var msg = document.querySelector('.show');
    msg.innerHTML = "";
    msg.innerHTML = "Hey! bạn vừa nhấn vào tôi";
  }
</script>
</body>
</html>

Kết quả

Nhấn vào nút "Nhấn vào tôi" để kích hoạt sự kiện nhấp chuột trên nó.