Hướng dẫn điều kiện trong css

Trong bài này, chúng ta sẽ tìm hiểu về câu lệnh điều kiện trong JavaScript. Bao gồm IF, IF-ELSE, IF-ELSE IF-ELSE, SWITCH- CASE. Tất cả các trường hợp sẽ có ví dụ minh họa và code mẫu.

Nội dung chính

  • Video – Câu lệnh điều kiện trong JavaScript
  • Hướng dẫn chi tiết
    • Cấu trúc lệnh IF
    • Cấu trúc lệnh IF – ELSE
    • Cấu trúc IF – ELSE IF – ELSE
    • Cấu trúc SWITCH – CASE

Video – Câu lệnh điều kiện trong JavaScript

Hướng dẫn chi tiết

"Người ta tắt AdsBlock không phải vì người ta dại, mà người ta quý mình nên coi quảng cáo"

Hosting WordPress nhanh, rẻ và dễ sử dụng có free SLL hãy chọn Azdigi nhé.
Link đăng ký: NHẬN NGAY ƯU ĐÃI
Nếu các bạn mua hosting từ link trên, mình sẽ có một ít tiền để duy trì. Cảm ơn

Cấu trúc lệnh IF

Lệnh if được dùng để kiểm tra điều kiện nào đó, nếu điều kiện đó đúng, sẽ thực hiện câu lệnh bên trong. Ngoài ra, có thể truyền vào điều kiện if một biến kiểu boolean (true/false) để thay thế cho điều kiện.

if( điều kiện ){
   thực hiện các lệnh
}

Cấu trúc lệnh IF – ELSE

Lệnh if else dùng để kie63mt ra điều kei65n, nếu sai sẽ thực hiện lệnh if. Nếu đúng, chạy lệnh else.

if( điều kiện ){
   các câu lệnh
} else {
   các câu lệnh
}

Cấu trúc IF – ELSE IF – ELSE

Lệnh if else if giúp kiểm tra nhiều điều kiện khác nhau.

if( điều kiện 1 ){
   các câu lệnh
}
else if( điều kiện 2){
   các câu lệnh
}
else {
   các câu lệnh
}

Cấu trúc SWITCH – CASE

Lệnh switch case kiểm tra giá trị của biến, nếu đúng giá trị nào, chạy giá trị đó.

Bài viết cùng chủ đề

Bài 4: Tạo hiệu ứng collapse và accordion bằng…

Bài 3: Ẩn hiện nội dung bằng jQuery

Có làm thì mới có ăn như ai đó từng nói - Vài dòng ngắn cho QUẢNG CÁO nhé

Các bạn cần hosting WordPress nhanh, rẻ và dễ sử dụng có free SLL hãy chọn Azdigi nhé.
Link đăng ký: NHẬN NGAY ƯU ĐÃI
Nếu các bạn đăng ký và sử dụng hosting từ link trên, Góc Làm Web sẽ có một ít tiền để duy trì. 

switch (biến){
   case giá trị 1:
      câu lệnh
      break
   case giá trị 2:
      câu lệnh
     break
   default: câu lệnh
}

+ Có lệnh break, biến trùng với giá trị ccu3acase sẽ dừng kiểm tra bên dưới và chạy câu lệnh trong case. Nếu không có break, giá trị của biến khớp với case thì sẽ chạy tất cả câu lệnh của case hiện tại và case bên dưới. Xem video nhé.

+ default: hành động mặc định, nếu kh6ong case nào đúng, sẽ thực hiện câu lệnh trong default.

Code mẫu: Download

Nếu có thắc mắc, hãy đặt câu hỏi bằng cách comment bên dưới, qua email, hoặc nhắn tin qua Fanpage Góc làm web.

- Trong cuộc sống, ta gọi vế thứ nhất là điều kiện, vế thứ hai là một điều gì đó sẽ đạt được khi thỏa điều kiện.

- Trong JavaScript cũng có một dạng cú pháp tương tự như vậy, nó kiểm tra một điều kiện và nếu điều kiện đúng thì một đoạn mã xác định sẽ được thực thi. Đó được gọi là "lệnh điều kiện" và trong JavaScript thì lệnh điều kiện được chia làm ba loại cơ bản:

  • Lệnh if
  • Lệnh if ... else
  • Lệnh if ... else if ... else

1) Khái niệm "điều kiện" trong JavaScript

- Trong JavaScript, điều kiện là một biểu thức so sánh hoặc logic để đưa ra một giả thuyết.

  • Nếu giả thuyết đúng, đồng nghĩa với việc điều kiện đúng và điều kiện sẽ nhận giá trị là true.
  • Nếu giả thuyết sai, đồng nghĩa với việc điều kiện sai và điều kiện sẽ nhận giá trị là false.

- Ví dụ:

Điều kiệnMô tảGiá trị7 > 4Bảy lớn hơn bốntrue7 >= 4Bảy lớn hơn hoặc bằng bốntrue7 < 4Bảy nhỏ hơn bốnfalse"webcoban"=="laptrinhweb"Chuỗi "webcoban" giống với chuỗi "laptrinhweb"false"webcoban"!="laptrinhweb"Chuỗi "webcoban" khác với chuỗi "laptrinhweb"true(5+7) > 10Tổng của năm và bảy lớn hơn mườitrue(5+7) < 10Tổng của năm và bảy nhỏ hơn mườifalse

2) Lệnh điều kiện if trong JavaScript

- Lệnh if dùng để kiểm tra một điều kiện, nếu điều kiện đó là đúng thì một đoạn mã xác định sẽ được thực thi.

- Cú pháp:

if(điều kiện){
    //đoạn mã này sẽ được thực thi nếu điều kiện là đúng
}

Nếu điều kiện "giá trị của biến number lớn hơn 50" là đúng thì hiển thị ba câu:

  • Tài liệu học HTML
  • Tài liệu học CSS
  • Tài liệu học JavaScript


Xem ví dụ

3) Lệnh điều kiện if ... else trong JavaScript

- Lệnh if ... else dùng để kiểm tra một điều kiện, nếu điều kiện đó là đúng thì một đoạn mã xác định sẽ được thực thi, còn nếu điều kiện đó sai thì một đoạn mã xác định khác sẽ được thực thi.

- Cú pháp:

if(điều kiện){
    //đoạn mã này sẽ được thực thi nếu điều kiện là đúng
}else{
    //đoạn mã này sẽ được thực thi nếu điều kiện là sai
}

Nếu điều kiện "giá trị của biến numberOne lớn hơn giá trị của biến numberTwo" là đúng thì hiển thị ba câu:

  • Tài liệu học HTML
  • Tài liệu học CSS
  • Tài liệu học JavaScript

Còn nếu điều kiện "giá trị của biến numberOne lớn hơn giá trị của biến numberTwo" là sai thì hiển thị hai câu:

  • Tài liệu học MySQL
  • Tài liệu học PHP


Xem ví dụ

4) Lệnh điều kiện if ... else if ... else trong JavaScript

- Lệnh if ... else if ... else dùng để mở rộng phạm vi kiểm tra các điều kiện khác nếu tất cả những điều kiện phía trên là sai.