Phương thức HTML DOM getElementById()

Phương thức getElementById() trả về phần tử duy nhất có id khớp với tham số truyền vào. Đây là phương thức phổ biến và đơn giản nhất để truy xuất phần tử nhằm thao tác sau này. Nếu id không tồn tại, trả về null.

Cú pháp

document.getElementById(elementID)

Ví dụ

Ví dụ thay đổi kiểu dáng của liên kết (anchor) có id "LINK1":

<!DOCTYPE html>
<html>
<head>
<script>
  function changeLink() {
    var link = document.getElementById("LINK1");
    link.style.color = "red";
    link.style.fontSize = "40px";
  }
</script>
</head>
<body>
<h1>Ví dụ getElementById()</h1>
<a id="LINK1" href="https://www.google.com">GOOGLE</a>
<p>Nhấn nút bên dưới để áp dụng kiểu dáng cho liên kết trên</p>
<button onclick="changeLink()">THAY ĐỔI</button>
</body>
</html>

Kết quả

Ban đầu liên kết "GOOGLE" hiển thị bình thường.

Sau khi nhấn "THAY ĐỔI", liên kết chuyển màu đỏ, cỡ chữ 40px.

Giải thích

• Liên kết <a> có id="LINK1" và href="https://www.google.com".
• Nút "THAY ĐỔI" gọi hàm changeLink().
• Hàm lấy phần tử qua document.getElementById("LINK1"), gán vào biến link.
• Thiết lập link.style.color và link.style.fontSize.