SPEAKER 1: Bây giờ trong đó ví dụ cuối cùng, nhớ lại rằng chúng ta xen kẽ một số Mã JavaScript bên trong HTML của tôi, đặc biệt, bên trong giá trị của thuộc tính được gọi là Ngày Gửi cho rằng thẻ form. Bây giờ cho các trang nhỏ, điều này không phải là một việc lớn như vậy. Nhưng như là một trang web được lâu hơn và nhiều hơn nữa phức tạp, chỉ cần đặt của bạn JavaScript code đã có bên trong giá trị của các thuộc tính không phải là thiết kế tốt nhất. Tốt nhất nếu chúng ta yếu tố đó ra và ít nhất là đặt nó bên trong thẻ script trực thuộc Trung ương. 

Làm thế nào để làm điều này? Vâng chúng ta hãy quay trở lại thẻ hình thức của tôi và đầu tiên xóa thuộc tính này và nó giá trị hoàn toàn. Sau đó lên đây, chứ không phải là định nghĩa một chức năng gọi là Greet, hãy treo để các dòng mã mà cuối cùng chúng tôi vẫn muốn thực hiện và thay thế chức năng Greet như sau. Document.get tử bởi ID trích dẫn bản demo unquote - nơi demo, thu hồi, là độc đáo định danh cho các mẫu tự - dot trình, mà nhớ lại là tên của xử lý sự kiện trong đó chúng tôi quan tâm. Và chúng ta hãy gán vào trình xử lý giá trị mà thực sự là một hoạt động riêng của mình. 

Bây giờ nhận thấy rằng tôi không thực sự gọi một chức năng ở đây. Tôi thay vì định nghĩa một vô danh, nếu không được biết đến như là một hàm lambda, bằng cách xác định giữa các dấu ngoặc nhọn một loạt các mã mà nên thực sự được thực thi. Cụ thể, các mã mà tôi muốn để thực hiện là dòng mà tôi đã có trước, và sau đó chúng ta hãy thêm vào đó return false để hình thức này không phải là cuối cùng trình kết thúc web từ xa máy chủ theo cách truyền thống. 

Bây giờ hãy lưu tập tin này, mở nó lên trong trình duyệt, và xem những gì sẽ xảy ra. http://localhost/dom-1.html. Bây giờ hãy gõ vào tên của tôi, David, Submit. Và không có gì dường như đã xảy ra ngoại trừ URL của trang của tôi dường như đã thay đổi như hình thức là thực sự đệ trình lên cùng một tập tin. 

Bây giờ tại sao có thể được? Tôi cũng cần một số thông tin. Vì vậy, chúng ta hãy đi trước và mở Chrome Công cụ phát triển để tôi có thể thực sự nhìn vào cửa sổ giao diện điều khiển để xem nếu tôi đã làm điều gì sai. Tôi có thể truy cập thông qua một vài cách. Một trong số đó là thông qua trình đơn này đây, sau đó dưới Tools, sau đó xuống Công cụ phát triển. 

Và nhận thấy đây trong tab Console, có một lỗi uncaught loại, có thể không thiết lập thuộc tính trên trình null. Bây giờ tại sao có thể được? Cũng trở lại trong mã nguồn của tôi ở đây, thông báo mà trên submit tôi nghĩ là một tài sản của các yếu tố có định danh duy nhất là bản demo. Một yếu tố, một lần nữa, chỉ là một nút trong một cây. 

Vì vậy, có vẻ như trình duyệt của tôi không nghĩ rằng yếu tố đó hoặc nút tồn tại được nêu ra. Và quả thực, nó không. Nhớ lại rằng một trang web được phân tích cú pháp hoặc đọc bởi một trình duyệt web, trên xuống dưới, trái sang phải. Và như vậy khi mã JavaScript là gặp phải, thông thường, nó được thực hiện ngay lập tức. 

Nhưng trong trường hợp này, chúng tôi đã thậm chí không nhận được chưa đến một phần của dom, các HTML, trong đó có hình thức với một độc đáo bản demo nhận dạng đã được tuyên bố. Và vì vậy chúng tôi đang cố gắng để thực hiện của tôi Mã JavaScript trước khi nút đó thậm chí tồn tại trong cây đó, tất nhiên, là vấn đề bởi vì sau đó, chắc chắn, các yếu tố chính nó sẽ là vô giá trị tại thời điểm đó. 

Vậy làm thế nào để khắc phục? Vâng, chúng tôi có một vài giải pháp. Nhưng chúng ta hãy thử đơn giản bằng cách chuyển tag kịch bản của tôi từ đầu thẻ để cơ thể của tôi, nhưng cụ thể, hướng tới dưới cùng của cơ thể trang của tôi vì vậy rằng đó là bên dưới các nút và các câu hỏi. Cụ thể, chúng ta hãy làm nổi bật và cắt thẻ mở và thẻ đóng cho kịch bản và di chuyển mà toàn bộ khối mã để dưới cùng của các tập tin ở đây. 

Bây giờ điều này không nhất thiết phải là sạch thiết kế, nhưng ít nhất nó sẽ thực thi đúng thứ tự của các hoạt động. Hãy lưu các tập tin và tải lại trong trình duyệt của tôi. Hãy tải lại trang, tái đầu vào tên của tôi, và ở đó, Xin chào David trở lại.