Hướng dẫn alert e2 80 9cwow javascript run e2 80 9d - Arta '80 Qsoo Javascript Rune Iq 80 Qd

Tổng quan

Trong bài học này, bạn sẽ sử dụng JavaScript để hiển thị cảnh báo sau khi trang web được tải.

Kết quả người học

Khi hoàn thành bài tập này, bạn sẽ học được:

  1. Làm thế nào một tập lệnh phía máy khách phù hợp trong bối cảnh của trang HTML.
  2. Một số cú pháp JavaScript cơ bản.

Các hoạt động

Mỗi hoạt động trong mô -đun này sẽ liên quan đến việc viết mã JavaScript. Bạn sẽ bắt đầu bằng cách viết một tập lệnh đơn giản, sau đó dần dần xây dựng tập lệnh đó, thêm nhiều chức năng cho nó trong các bài học tiếp theo.

Bắt đầu bằng cách mở tệp danh mục đầu tư của bạn JavaScript.html bằng trình soạn thảo văn bản ưa thích của bạn.javascript.html using your preferred text editor.

Thêm mã JavaScript sau vào phần trang web của bạn: section of your web page:

  

Đây là một chức năng rất đơn giản. Lưu ý rằng nó trông rất giống các hàm showtop () và showbottom () của PHP () đã được giải thích trong tài liệu Beyond HTML mà bạn đã nghiên cứu trong bài học trước. Hầu hết các ngôn ngữ lập trình hoặc kịch bản đều tương tự nhau, bao gồm PHP và JavaScript, nhưng có sự khác biệt tinh tế trong cú pháp của chúng (các quy tắc về cách viết mã). Một hàm hữu ích có nguồn gốc từ JavaScript là hàm ALERT (). Hàm này sẽ hiển thị văn bản trong hộp thoại bật lên trên màn hình.syntax (the rules of how the code must be written). One useful function that's native to JavaScript is the alert() function. This function will display text in a dialog box that pops up on the screen.

Trước khi hàm này có thể hoạt động, trước tiên chúng ta phải gọi hàm showalert (). Các chức năng JavaScript được gọi để phản ứng với các sự kiện. Khi trang tải hoặc khi người dùng nhấp vào, lượn trên hoặc các tab đến một liên kết cụ thể, đây là tất cả các sự kiện. Chúng tôi có thể hướng dẫn JavaScript theo dõi các sự kiện này và nếu hoặc khi chúng xảy ra, hãy thực hiện chức năng được chỉ định.events. When the page loads, or when a user clicks on, hovers over, or tabs to a specific link, these are all events. We can instruct JavaScript to watch for these events, and if or when they occur, execute the specified function.

Ví dụ: giả sử chúng tôi muốn thực thi hàm showalert () sau khi phần thân của trang web được tải đầy đủ. Một cách để làm điều đó là thêm thuộc tính onload vào phần tử của trang web của chúng tôi, như thế này:onload attribute to the element of our web page, like this:

Hãy thử thêm phần trên vào trang web của bạn, sau đó tải trang và xem nó có hoạt động không. Nếu không, có lẽ bạn có một lỗi. Hãy chắc chắn rằng bạn đã gõ mọi thứ chính xác như nó xuất hiện, bao gồm viết hoa và dấu câu. Ngôn ngữ lập trình có thể rất kén chọn về những sai lầm dường như nhỏ. (Bài học tiếp theo sẽ nói thêm về gỡ lỗi). Khi bạn có nó hoạt động, hãy chuyển sang phần tiếp theo.

Biến

Như đã đề cập trong Beyond HTML, một biến trong ngôn ngữ lập trình hoặc kịch bản là một tên biểu tượng đại diện cho một giá trị. Trong ví dụ PHP trước đây của chúng tôi, chúng tôi đã sử dụng biến $ này để kiểm soát một số tính năng nhất định trong hàm showtop (). Trong PHP, các tên biến phải bắt đầu bằng $, nhưng đó không phải là trường hợp trong JavaScript. Hãy xem ví dụ sau, sử dụng một biến có tên MyText để tùy chỉnh văn bản được hiển thị trong hộp cảnh báo.variable in a programming or scripting language is a symbolic name that represents a value. In our earlier PHP example, we used the variable $thisPage to control certain features in the showTop() function. In PHP, variable names must start with a $, but that isn't the case in JavaScript. Take a look at the following example, which uses a variable named myText to customize the text that's displayed in the alert box.

  

Hãy thử sửa đổi tập lệnh showalert () của bạn với thông báo cảnh báo tùy chỉnh của riêng bạn. Sau đó kiểm tra nó để chắc chắn nó hoạt động.

Sử dụng sự kiện Onclick

Cho đến nay trong bài học này, chúng tôi đã gọi hàm showalert () khi phần thân của trang web được tải. Tuy nhiên, chúng tôi có thể kích hoạt nó bằng cách sử dụng các sự kiện khác thay thế. Ví dụ: chúng tôi chỉ có thể hiển thị cảnh báo nếu người dùng nhấp vào nút. Thử cái này:

  1. Xóa thuộc tính onload = "showalert ()" khỏi phần tử.onload="showAlert()" attribute from the element.
  2. Thêm phần tử HTML sau đây ở bất cứ đâu trong phần thân của trang web của bạn:

Mã mới này thêm một nút vào trang web của bạn. Nút bao gồm thuộc tính onclick, khiến showalert () được gọi khi người dùng nhấp vào nút. Sự kiện Onclick cũng hoạt động cho người dùng bàn phím. Nếu người dùng điều hướng đến nút bằng phím tab, thì nhấn ENTER, điều đó cũng sẽ kích hoạt cảnh báo.onclick attribute, which causes the showAlert() to be called when a user clicks the button. The onclick event also works for keyboard users. If a user navigates to the button using the tab key, then presses enter, that too will trigger the alert.

Sau khi bạn đã thêm nút, thêm một phần tử mới vào phần đầu của trang của bạn và thêm một kiểu mới cho phần tử nút. Sử dụng CSS Pseudo-Classes (: Hover,: Focus và: Active) để làm cho nút thay đổi ngoại hình khi người dùng di chuột qua nó bằng một con chuột hoặc tab với nó bằng bàn phím. Đây là một bảng kiểu ví dụ: