1. Trước hết: Web gồm những “món” gì?
Bạn mở một trang web bất kỳ (ví dụ: vnexpress.net, zingnews, facebook…)
Thực ra bên trong nó có 3 “món” chính:
HTML: khung xương – như cột, tường, cái khung nhà.
CSS: màu sắc, trang trí – như sơn, nội thất.
JavaScript (JS): não + cơ – giúp trang web biết phản ứng khi người dùng bấm, gõ, kéo.
👉 Bạn chỉ cần nhớ đơn giản:
JavaScript = phần khiến trang web biết “phản ứng lại” với mình.
Ví dụ:
Bạn bấm nút “Thêm vào giỏ hàng” → số lượng giỏ hàng tăng lên ngay → JS làm.
Bạn gõ chữ vào ô tìm kiếm → kết quả hiện ra, không reload trang → JS làm.
Bạn cuộn xuống → hiện cái nút “Lên đầu trang” → JS làm.
2. JavaScript là gì? (Câu trả lời đơn giản nhất)
Chỉ 1 câu siêu ngắn:
JavaScript là một ngôn ngữ để ra lệnh cho trình duyệt phải làm gì khi người dùng tương tác.
“Ngôn ngữ” = cách mình ra lệnh bằng chữ cho máy tính.
“Trình duyệt” = Chrome, Cốc Cốc, Edge, Firefox… (thứ mà Bạn dùng để vào web).
Bạn chưa cần hiểu gì sâu hơn.
Chỉ cần nhớ: JavaScript = ngôn ngữ để mình bảo trình duyệt làm việc.
3. JavaScript dùng để làm những việc cụ thể nào?
Liệt kê việc hàng ngày Bạn hay gặp:
Nút bấm có phản ứng
Bấm nút “Mua ngay” → hiện popup xác nhận.
Bấm nút “Xem thêm” → hiện thêm nội dung.
Form nhập liệu thông minh
Bạn nhập email sai định dạng → nó báo đỏ: “Email không hợp lệ”.
Bạn quên nhập mật khẩu → nó báo “Bạn chưa nhập mật khẩu”.
Trang không tải lại mà nội dung vẫn đổi
Kéo xuống Facebook → tự tải thêm bài.
Đổi tab trong 1 trang quản trị (Dashboard) → chỉ đổi nội dung bên trong, URL vẫn gần như vậy.
Hiển thị dữ liệu từ server
Xem danh sách sản phẩm trong shop online.
Xem danh sách đơn hàng.
Xem dự báo thời tiết trên web.
👉 Tất cả những thứ đó đằng sau đều dùng JavaScript.
4. Mình không chỉ “nghe”, mình sờ vào JavaScript luôn
Chúng ta không nói nữa, chúng ta sẽ làm 1 việc rất cụ thể:
Tự tay chạy dòng JavaScript đầu tiên trong đời.
Bạn chỉ cần làm theo từng bước, không hiểu cũng được, cứ làm.
4.1. Bước 1 – Mở Console trong trình duyệt
Bạn mở Chrome (nếu dùng Cốc Cốc / Edge cũng tương tự).
Gõ vào thanh địa chỉ:
google.com→ Enter.Trên bàn phím: Bấm F12 hoặc Chuột phải vào trang → chọn Inspect (Kiểm tra).
Một cái panel sẽ hiện ra (thường bên phải hoặc dưới màn hình).
Ở trên panel đó, Anh tìm tab Console và bấm vào.
Nếu làm đúng, Bạn sẽ thấy một vùng để gõ chữ, kiểu như:
4.2. Bước 2 – Gõ dòng JavaScript đầu tiên
Trong tab Console, bạn gõ y nguyên dòng này:
console.log("Xin chào, đây là dòng JavaScript đầu tiên của tôi!");Sau đó bấm Enter.
👉 Kết quả:
Ngay dưới đó, Anh sẽ thấy nó in lại dòng chữ:
Xin chào, đây là dòng JavaScript đầu tiên của tôi!
Đó chính là JavaScript đang chạy.
console.log(...)nghĩa là:
“In cái này ra màn hình Console để tôi nhìn thấy”.
👉 Tới đây:
Bạn chưa cần nhớ console là gì, .log là gì.
Chỉ cần biết: đây là cách mình kiểm tra và xem kết quả khi học JS.
5. Làm thêm một trò “thấy bằng mắt” cho vui
Vẫn trong cái tab Console đó, Bạn thử:
5.1. Bước 3 – Đổi màu nền trang bằng JavaScript
Gõ dòng này:
document.body.style.backgroundColor = "yellow";
Rồi Enter.
Nếu mọi thứ ok, cả trang web sẽ chuyển sang màu vàng 🌕.
document = đại diện cho cả trang web.
body = phần thân của trang.
style.backgroundColor = thuộc tính màu nền.
"yellow" = màu vàng.
Ban chưa cần hiểu từng từ, cứ biết:
Gõ đúng y chang → nền trang đổi màu.
Mà làm được chuyện đó là nhờ JavaScript.
Đây là lần đầu tiên Bạn thấy:
👉 JS không chỉ in chữ, nó thay đổi thẳng giao diện.
Hãy thử đi nhé, rồi quay lại đây comment xem thế nào 😀
6. Tóm tắt lại cho Bạn
Bạn có thể tự ghi lại vào sổ (rất khuyến khích):
Web có 3 thứ chính: HTML (khung) – CSS (trang trí) – JavaScript (não/ hành động).
JavaScript là ngôn ngữ để mình ra lệnh cho trình duyệt.
Những thứ như:
Nút bấm có phản ứng,
Form báo lỗi ngay khi gõ sai,
Trang đổi nội dung mà không tải lại,
đều có JavaScript đứng sau.
Mình vừa:
In được một câu ra Console bằng console.log(...).
Đổi màu nền trang bằng document.body.style.backgroundColor = "yellow".
Nếu Bạn nhớ được 4 ý này là quá ngon cho bài này rồi.
7. Bài tập nhỏ cho Bạn (cứ làm được là tốt, chưa hiểu sâu cũng không sao)
Bài 1 – Tự in lời chào của chính Bạn
Trong tab Console, Bạn gõ:
console.log("Xin chào,Trang này dạy JS không giống chuyên gia,Trang này hướng dẫn cho người từ con số 0!");
Rồi Enter.
👉 Mục tiêu:
Bạn thấy mình có thể ra lệnh cho máy in ra câu chữ của chính mình vừa gõ vào lệnh.
Bài 2 – Thử một màu khác
Vẫn ở Console, gõ tiếp:
document.body.style.backgroundColor = "lightblue";
Rồi Enter.
👉 Mục tiêu:
Thấy rằng chỉ cần đổi
"yellow"thành"lightblue"là giao diện đổi khác.Hiểu rằng: trong JS, chuỗi (text) thường được đặt trong dấu ngoặc
"...".
Bạn có thể thử thêm:
document.body.style.backgroundColor = "pink";
document.body.style.backgroundColor = "black";
document.body.style.backgroundColor = "white";
Bài 3 – Kết hợp cả hai
Thử gõ:
console.log("Tôi vừa đổi màu nền bằng JavaScript xong!");
document.body.style.backgroundColor = "lightgreen";
Rồi Enter.
Dòng 1: in ra thông báo.
Dòng 2: đổi màu nền.
👉 Đây là một “chương trình” mini gồm 2 câu lệnh.
8. Sau bài này Bạn cần hiểu tới đâu?
Đừng tự ép mình phải hiểu hết mọi khái niệm.
Mục tiêu thực tế cho Bạn ở bài này chỉ là:
Biết JavaScript là “phần não/ phản ứng” của web.
Biết mở Console trong trình duyệt.
Tự tay:
– In được 1 dòng chữ (console.log(...)).
– Đổi được màu nền trang (document.body.style.backgroundColor = "...").
