JS 08 – Cách hiển thị dữ liệu ra màn hình trong JavaScript

0
669

Xin chào các bạn, trong bài học ngày hôm nay mình sẽ giới thiệu đến các bạn cách hiển thị dữ liệu ra màn hình trong JavaScript. Có 3 câu lệnh chính được sử dụng để in dữ liệu ra màn hình là alert, prompt, confirm. Bây giờ chúng ta sẽ đi vào chi tiết từng loại nhé.

Alert

Cú pháp:

No sẽ hiển thị dữ liệu trên một cửa sổ nhỏ và tạm dừng thực thi mã lệnh khi người dùng nhấn “OK“.

Ví dụ:

kết quả:

Cửa sổ nhỏ chứa thông báo được gọi là cửa sổ phương thức. Từ “phương thức” có nghĩa là khách truy cập không thể tương tác với phần còn lại của trang như nhấn các nút khác, v.v. cho đến khi họ xử lý cửa sổ. Trong trường hợp này – người dùng chỉ có thể thực hiện các thao tác khác cho đến khi họ nhấn “OK”.

Prompt

Hàm prompt nhận vào hai đối sô:

Nó sẽ hiển thị một cửa sổ phương thức với một đoạn tin nhắn, một trường đầu vào cho khách truy cập và các nút OK / CANCEL.

  • title: Văn bản hiển thị cho người dùng truy cập.
  • default: Đây là một tham số không bắt buộc, chứa giá trị ban đầu cho trường nhập.

Người dùng có thể nhập nội dung vào trường nhập và nhấn OK. Hoặc họ có thể hủy bỏ đầu vào bằng cách nhấn nút CANCEL hoặc nhấn phím Esc.

Hàm prompt sẽ trả về đoạn văn bản ở trong trường nhập hoặc null nếu đầu vào bị cancel.

Ví dụ:

kết quả:

Confirm

Cú pháp:

Hàm confirm sẽ hiển thị một cửa sổ phương thức với một câu hỏi và hai nút: OKCANCEL.

Kết quả là đúng nếu OK được nhấn và sai nếu thực hiện các thao tác khác.

Ví dụ:

Kết quả:

document.write

Khi bạn sử dụng hàm document.write(), nội dung bạn muốn hiển thị sẽ nằm ở đúng vị trí được đặt trong trang web.

Ví dụ:

Kết quả:

document.getElementById().innerHTML

Câu lệnh này được sử dụng khi bạn muốn hiển thị một nội dung bên trong một phần tử nhất định.

Cú pháp: 

Ví dụ:

Tổng kết

Như vậy trong bài ngày hôm nay chúng ta đã cùng nhau tìm hiểu về 3 cách hiển thị nội dung ra màn hình bao gồm:

  • alert: hiển thị nội dung một đoạn text.
  • prompt: hiển thị thông báo yêu cầu người dùng nhập vào dữ liệu. Nó trả về dữ liệu được nhận vào hoặc null nếu người dùng nhấn vào CANCEL hoặc Esc.
  • confirm: hiển thị thông báo và đợi người dùng nhấn “OK” hoặc “CANCEL”. Nó trả về true nếu người dùng nhấn OK và false cho CANCEL / Esc.

Trong bài học tiếp theo mình sẽ giới thiệu đến các bạn toán tử điều kiện trong JavaScript.

Chúc các bạn học tập tốt!

BÌNH LUẬN

Vui lòng nhập bình luận của bạn
Vui lòng nhập tên của bạn ở đây