Tại sao nên sử dụng document.getElementById khi tôi có thể tham chiếu trực tiếp đến id DOM trong JavaScript?

Question

thể trùng lặp:
IE/Chrome: are DOM tree elements global variables here?

Gần đây tôi phát hiện ra rằng tôi có thể sử dụng trong javascript bất kỳ đối tượng từ DOM với một tham chiếu trực tiếp đến id của nó:

<div id="layer">IM A LAYER</div> 
<script> 
    alert(layer.innerHTML); 
</script> 

Nếu đây là đúng, lợi ích gì tôi sẽ nhận được bằng cách sử dụng phương thức getElementById?

Answer 1

Truy cập trực tiếp vào phần tử DOM sẽ cho bạn lỗi nếu phần tử không tồn tại. Nếu bạn sử dụng getElementById, nó sẽ trả lại NULL.

Bạn cũng không thể truy cập trực tiếp vào tất cả các phần tử nếu chúng có dấu gạch ngang trong tên của chúng (some-id), vì biến JS không thể chứa dấu gạch ngang. Tuy nhiên, bạn có thể truy cập tthem bằng window['some-id'].

Answer 2

Điều này sẽ chỉ hoạt động đối với các chữ cái chứa id được phép cho các tên biến. Đối với id giống như text-11 hoặc item-key-21, nó sẽ không hoạt động.

Answer 3

ví dụ, nếu trong trang của bạn, bạn có ở đâu đó một kịch bản trước đó với

<script> 
var layer = false; // or any other assignment 
</script> 

layer sẽ là một tài liệu tham khảo để window.layer, sau đó layer.innerHTML sẽ thất bại. Với document.getElementById bạn sẽ tránh được các lỗi phức tạp này