JavaScript là gì?JavaScript (JS) là một ngôn ngữ lập trình phía client: mã được thực thi bởi trình duyệt của người dùng, sau khi trang web gửi về từ server. Show
JavaScript được sử dụng để tạo ra các trang web có tính tương tác:
JavaScript là ngôn ngữ lập trình phổ biến bậc nhất thế giới, và là một trong ba ngôn ngữ (HTML, CSS, JavaScript) mà tất cả lập trình viên web nhất định phải học. JavaScript được nhúng vào trang web để kết hợp với HTML/CSS.
Với JavaScript ta có thể làm được những gì?Ứng dụng của JavaScript đối với trang web là vô cùng đa dạng, khó mà đong đếm được. Dưới đây là một số ít chức năng được viết bằng JavaScript: Tạo máy tính tay Tạo hiệu ứng chuyển động cho phần tử Lấy thông tin ngày tháng hiện tại Hôm nay là , ngày tháng năm Tác giả: Dương Nguyễn Phú Cường Ngày đăng: Hồi xưa đó Video hướng dẫn
Cách 1: sử dụng file JavaScript rời (External File)
Cách 2: sử dụng code JavaScript bên trong file HTML (Internal File)
Cách 1: sử dụng file JavaScript rời (External File)Ưu điểm và Nhược điểm
Step 1: tạo cấu trúc thư mục như sau
\---ex1 <- thư mục gốc dự án | index.html <- trang chủ | \---js <- thư mục chứa các file JavaScript của dự án app.js <- file javascript dự án
Step 2: viết code xử lý cho index.html và app.js
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Nền tảng | JavaScript căn bản</title> </head> <body> <h2>Học JavaScript căn bản</h2> </body> </html>
// Gọi hàm alert('') để hiển thị thông báo alert('Chào mừng đến với JavaScript. Tôi là code JS trong file rời...'); Step 3: Nhúng/Liên kết code JavaScript vào trong file HTML
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Nền tảng | JavaScript căn bản</title> <!-- Nhúng/Liên kết code JavaScript vào trong file HTML --> <script src="js/app.js"></script> </head> <body> <h2>Học JavaScript căn bản</h2> </body> </html> Step 4: mở trang index.html bằng trình duyệt để xem kết quả
Cách 2: sử dụng code JavaScript bên trong file HTML (Internal File)Ưu điểm và Nhược điểm
Step 1: tạo cấu trúc thư mục như sau
\---ex1 <- thư mục gốc dự án | index.html <- trang chủ | \---js <- thư mục chứa các file JavaScript của dự án app.js <- file javascript dự án
Step 2: viết code xử lý cho index.html và app.js
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Nền tảng | JavaScript căn bản</title> <!-- Nhúng/Liên kết code JavaScript vào trong file HTML --> <script src="js/app.js"></script> <!-- Đoạn code JavaScript bên trong file HTML --> <script> alert('Xin chào, tôi là đoạn code bên trong file HTML!'); </script> </head> <body> <h2>Học JavaScript căn bản</h2> </body> </html> Step 3: mở trang index.html bằng trình duyệt để xem kết quả
Lưu ý: các trường hợp sai khi sử dụng JavaScript trong HTML
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Nền tảng | JavaScript căn bản</title> <!-- Nhúng/Liên kết code JavaScript vào trong file HTML --> <script src="js/app.js"></script> <!-- Đoạn code JavaScript bên trong file HTML --> <script> alert('Xin chào, tôi là đoạn code bên trong file HTML!'); </script> <!-- Đoạn code JavaScript sai, vì cùng lúc thực hiện nhiều tác vụ - Vừa liên kết file app.js - Vừa chạy đoạn script bên trong => Sai, một số trường hợp sẽ thực thi code không chính xác. Tốt nhất thực hiện chỉ 1 tác vụ cùng lúc. --> <script src="js/app.js"> alert('Xin chào, tôi là đoạn code thực hiện cùng lúc cả 2 tác vụ, tôi quá tải 😣!'); </script> </head> <body> <h2>Học JavaScript căn bản</h2> </body> </html> |