Thuộc tính name của DOM Input Button trong HTML

Giới thiệu

Thuộc tính name của DOM Input Button (phần tử <input type="button|submit|reset|image">) đọc hoặc thay đổi giá trị thuộc tính name của nút. Tên này dùng để xác định nút khi submit form (nếu là submit) hoặc trong script.

Cú pháp

// Lấy
button.name
// Gán
button.name = "ten_moi"

Ví dụ minh họa

<!DOCTYPE html>
<html>
<head>
  <style>
    .btn { display:block; margin:1rem auto; background:#db133a; color:#fff; border:1px solid #db133a; padding:0.5rem; border-radius:50px; width:80%; }
    .show-name { font-weight:bold; font-size:1.4rem; color:#ffc107; }
  </style>
</head>
<body>
  <h1>Ví dụ name Property</h1>
  <input type="submit" onclick="setName()" class="btn" value="Nhấn để đổi Name" name="Red_Button">
  <div class="show-name"></div>
  <script>
    function setName() {
      var btn = document.querySelector(".btn");
      document.querySelector(".show-name").innerHTML = "Name cũ = " + btn.name;
      btn.name = "Round_Red_Button";
    }
  </script>
</body>
</html>

Kết quả hiển thị

Ban đầu hiển thị "Name cũ = Red_Button". Sau khi nhấp nút, name đổi thành "Round_Red_Button" (xem qua Inspect Element).