Computer >> Máy Tính >  >> Lập trình >> Javascript

Cách getElementByID hoạt động trong JavaScript?

getElementById

getElementById () là một phương pháp DOM được sử dụng để trả về phần tử có thuộc tính ID với giá trị được chỉ định. Đây là một trong những phương pháp phổ biến nhất trong HTML DOM và được sử dụng hầu như mỗi khi chúng ta muốn thao tác một phần tử trên tài liệu của mình. Phương thức này trả về null nếu không có phần tử nào có ID được chỉ định tồn tại. ID phải là duy nhất trong một trang. Tuy nhiên, nếu tồn tại nhiều hơn một phần tử với ID được chỉ định, nó sẽ trả về phần tử cuối cùng trong mã javascript.

Ví dụ-1

Trong ví dụ sau, tồn tại một thẻ đoạn văn với nội dung bên trong là "GetElementById" và với một id được gọi là "phần tử". Sử dụng phương thức DOM "document.getElementById ()", văn bản bên trong thẻ đoạn văn được truy cập và giá trị được hiển thị trong đầu ra. Nếu không có ".innerHtml", document.getElementById không thể đọc phần văn bản bên trong của bất kỳ thẻ nào.

<html>
<body>
<p id="element">GetElementById</p>
<script>
   var s = document.getElementById("element").innerHTML;
   document.write(s);
</script>
</body>
</html>

Đầu ra

GetElementById
GetElementById

Ví dụ-2

Trong ví dụ sau, sử dụng phương thức DOM "getElementById", chúng tôi đã thay thế phần văn bản gốc "GetElementById" bằng văn bản "Tutorix" và kết quả được hiển thị trong đầu ra.

<html>
<body>
<p id="element">GetElementById</p>
<script>
   document.getElementById("element").innerHTML = "Tutorix";
</script>
</body>
</html>

Đầu ra

Tutorix