inflearn logo

jQuery bất tử vẫn còn sống – từ cơ bản đến thực tiễn

Thư viện javascript jQuery được sử dụng trên hơn 75% các website trên toàn thế giới! Nội dung được xây dựng để bạn hiểu rõ nguyên lý và củng cố nền tảng cơ bản thay vì tập trung vào những hiệu ứng hào nhoáng. Hãy học từ cơ bản đến ứng dụng jQuery để hoàn thiện portfolio của riêng bạn hoặc áp dụng ngay vào công việc thực tế.

(5.0) 3 đánh giá

35 học viên

Độ khó Cơ bản

Thời gian Không giới hạn

HTML/CSS
HTML/CSS
JavaScript
JavaScript
jQuery
jQuery
jquery-selector
jquery-selector
HTML/CSS
HTML/CSS
JavaScript
JavaScript
jQuery
jQuery
jquery-selector
jquery-selector

Đánh giá từ những học viên đầu tiên

5.0

5.0

준쮸넛

100% đã tham gia

Tôi từng là người không mấy tự tin về jQuery, nhưng sau khi nghe bài giảng này, tôi đã lấy lại được sự tự tin rồi. Cách giải thích rất dễ hiểu và đi vào lòng người luôn!! Hy vọng sau này bạn sẽ có thêm nhiều bài giảng hay hơn nữa. Xin cảm ơn!

Bạn sẽ nhận được điều này sau khi học.

  • Cú pháp cơ bản của jQuery

  • Thay đổi kiểu dáng của phần tử bằng jQuery

  • Áp dụng sự kiện cho phần tử bằng jQuery

  • Triển khai nhanh hiệu ứng động bằng jQuery

  • Tabs ví dụ thực tiễn có thể sử dụng ngay lập tức

  • Ví dụ thực tế về accordion có thể dùng ngay

  • Lightbox (hộp đèn) với ví dụ thực tiễn có thể áp dụng ngay lập tức

  • Ví dụ thực tế về hoạt ảnh “back to top” có thể áp dụng ngay lập tức

  • Trình chiếu (slideshow) các ví dụ thực tế có thể áp dụng ngay lập tức

  • Thư viện thực hành - Sử dụng Swiper JS

  • Thư viện thực tiễn - Sử dụng Masonry

  • Thư viện thực tiễn - Sử dụng ScrollTrigger

  • Thư viện thực tiễn - Sử dụng Fullpage JS

"Không nhận ngay là thiệt! Chỉ cần đăng ký kênh YouTube là học phí giảm một nửa"

Sự kiện đăng ký & thích & bình luận

Hãy hoàn thành nhiệm vụ đơn giản và nhận ngay phiếu giảm giá 50%. Ưu đãi cực khủng chỉ được cung cấp trong thời gian có hạn, hãy nhanh tay nắm bắt ngay hôm nay!

Tham gia sự kiện xác nhận đăng ký YouTube & bình luận: https://forms.gle/wcD2wRVeaG7B7fSj7

Lý do bạn vẫn cần học jQuery

jQuery là một thư viện JavaScript đã được các nhà phát triển web sử dụng rộng rãi kể từ khi xuất hiện lần đầu vào năm 2006. Một trong những lý do chính là thư viện này giúp đơn giản hóa việc chọn và thao tác các phần tử HTML, qua đó nâng cao năng suất phát triển, đồng thời đảm bảo khả năng tương thích giữa nhiều trình duyệt web khác nhau.

Những ưu điểm này của jQuery được thể hiện qua tỷ lệ sử dụng cao trên các website trên toàn thế giới. Ví dụ, tính đến năm 2021, khoảng 77.8% trong số 10 triệu website hàng đầu đã sử dụng jQuery.

[ Nguồn: https://w3techs.com/technologies/overview/javascript_library ]

Như vậy, jQuery đã trở thành một công cụ tiêu chuẩn trong phát triển web trong suốt thời gian dài. Do đó, việc học jQuery sẽ giúp ích rất nhiều cho việc hiểu và bảo trì những kho mã khổng lồ hiện có. Ngoài ra, vì vẫn còn nhiều website sử dụng jQuery, nên việc nắm vững nó sẽ giúp bạn ứng dụng hiệu quả trong nhiều dự án khác nhau.

Tất nhiên, gần đây các framework và thư viện hiện đại như React hay Vue.js đang nhận được nhiều sự quan tâm, nhưng tính đơn giản và khả năng tương thích rộng rãi của jQuery vẫn là những yếu tố hấp dẫn. Vì vậy, với tư cách là một nhà phát triển web, việc học jQuery sẽ là nền tảng quan trọng để hiểu cả công nghệ trong quá khứ lẫn hiện tại.

Ví dụ về các website sử dụng jQuery

Samsung Electronics https://www.samsung.com/sec/


Trong phần head của mục element trong công cụ dành cho nhà phát triển trên trang chủ Samsung Electronics, có thể thấy họ sử dụng thư viện jQuery, thư viện slick (trình chiếu), thư viện swiper và thư viện masonry.

Asiana Airlines - https://flyasiana.com/C/KR/KO/index




Đối với Asiana Airlines, họ sử dụng các thư viện jquery và swiper, đồng thời sử dụng moment.js vì có nhiều chức năng liên quan đến ngày tháng.


Binggrae - https://www.bing.co.kr/



Đối với trang web Binggrae, chúng tôi sử dụng masonry, slick, v.v.; các script được áp dụng chung được đặt trong common.js, còn các script hoạt động theo từng trang được phân chia và sử dụng dưới dạng main, sub, v.v.

Ngoài ra, nhiều website cũng đang sử dụng jQeury để xây dựng và bảo trì.

Vì vậy, trong khóa học này, chúng ta sẽ học cú pháp cơ bản và các hàm tiêu biểu của jQeury, các ví dụ cơ bản như tab, accordion, đồng thời tìm hiểu thêm về các thư viện thực tế tiêu biểu như swiper js, masonry, fullpage JS.

Giới thiệu các nội dung học tập chính.

Phần A

Học các cú pháp cơ bản của jQuery.

Từ việc tải jQuery đến thứ tự tải, bạn sẽ học cách sử dụng. Bạn sẽ học cách chọn các phần tử bằng jQuery, thay đổi kiểu dáng của các phần tử đã chọn và áp dụng sự kiện cho các phần tử đó.

Thông qua jQuery, bạn có thể dễ dàng triển khai các hiệu ứng hoạt ảnh. Khi đó, hãy viết thời gian, tốc độ và hàm của hoạt ảnh để thiết lập một cách chi tiết.


Đây là một phần mã nguồn học về các sự kiện trong jQuery.

Đây là ví dụ học những kiến thức cơ bản về sự kiện và hiệu ứng động.

Phần B

Trong phần B, chúng ta sẽ triển khai các UI/UX được sử dụng phổ biến nhất khi xây dựng trang web, gồm tab, accordion, lightbox, back to top và slideshow. Chúng ta sẽ xây dựng cấu trúc HTML để triển khai hiệu ứng, thiết kế trước các hiệu ứng bằng CSS, sau đó viết script để các hiệu ứng được thực hiện theo nhiều sự kiện khác nhau.



Đây là màn hình hoàn thiện của tab.

Đây là bản hoàn chỉnh của Accordion.

Đây là phiên bản hoàn chỉnh của lightbox.

Đây là bản hoàn thiện của Back to Top Animation.

Đây là bản hoàn thiện của slideshow.

Phần C

Trong phần C, chúng ta học cách sử dụng các thư viện thường được ứng dụng nhiều trong thực tế như Swiper, Masonry và ScrollTrigger.


Đây là phiên bản hoàn chỉnh của thư viện Swiper JS.

Đây là phiên bản hoàn chỉnh của thư viện Masonry.

Đây là phiên bản hoàn chỉnh của thư viện ScrollTrigger.

Phần D

Trong Phần B, sử dụng fullpageJS để xây dựng một trang web khi cuộn con lăn chuột sẽ chuyển mượt mà sang slide tiếp theo.

Vẽ biểu đồ bằng SVG và kết hợp với jQuery để tạo hiệu ứng động đường viền được lấp đầy.




Đây là bản hoàn chỉnh của trang hồ sơ sử dụng fullpage JS.

Cung cấp tệp ví dụ và bản hoàn thiện.

Bạn có thể tải tệp ví dụ trong tài liệu của buổi 2 (Cú pháp jQuery - thứ tự tải).


Bạn có thể tải toàn bộ tệp hoàn chỉnh trong tài liệu của buổi 17 (Fullpage JS).


Kênh liên lạc (khảo sát, phòng trò chuyện mở 1:1)✒

Học viên có thể gửi ý kiến và câu hỏi bất cứ lúc nào thông qua Google Form được giới thiệu trong mục Tin tức mới và phòng trò chuyện mở 1:1.


Khuyến nghị cho
những người này

Khóa học này dành cho ai?

  • Người đã học HTML, CSS và Javascript

  • Người đang tìm việc chuẩn bị trở thành nhà xuất bản web

  • Những người đang chuẩn bị hồ sơ năng lực (portfolio)

  • Dành cho những người đang chuẩn bị thi chứng chỉ Kỹ thuật viên Phát triển Thiết kế Web (trước đây là Kỹ thuật viên Thiết kế Web)

Xin chào
Đây là ezweb

Xác minh sự nghiệp

3,001

Học viên

77

Đánh giá

4

Trả lời

4.9

Xếp hạng

15

Các khóa học

Tôi là giảng viên chuyên về frontend web, cung cấp đào tạo thực tiễn về frontend, giảng dạy tại doanh nghiệp và cơ quan, cũng như sản xuất các khóa học trực tuyến.

■ Các khóa học chuyên sâu về frontend
HTML/CSS, JavaScript, React, Firebase, Figma, phát triển web ứng dụng AI, v.v.
Đào tạo theo từng bước từ xuất bản web đến nghiệp vụ frontend thực tế.

■ Có thể giảng dạy tại doanh nghiệp, cơ quan và cơ sở giáo dục
Đào tạo nhân sự doanh nghiệp, chương trình KDT, chuyên đề tại trường đại học·học viện, v.v.
Có thể xây dựng chương trình giảng dạy và trực tiếp giảng dạy phù hợp với đối tượng và trình độ học viên.

■ Có thể thiết kế và sản xuất khóa học trực tuyến
Từ lên kế hoạch chương trình giảng dạy, biên soạn giáo trình, PPT, tài liệu thực hành và mã ví dụ,
đến quay bài giảng và bàn giao nội dung, có thể thực hiện toàn bộ quy trình sản xuất nội dung đào tạo trực tuyến.

■ Có thể giảng dạy cả trực tuyến và trực tiếp
Không chỉ giảng dạy trực tiếp tại học viện mà còn thực hiện nhiều hình thức khác nhau như giảng dạy trực tuyến theo thời gian thực, sản xuất nội dung ghi hình
phù hợp với môi trường giáo dục.


■ Hoạt động chính

  • Khóa học frontend KDT của ESTSOFT

  • Bài giảng xuất bản web và frontend tại Học viện Máy tính Green

  • Vận hành kênh YouTube về xuất bản web ‘ezweb’

  • Biên soạn sách liên quan đến xuất bản web và thiết kế web


■ Sách
2021.07 / Cẩm nang sử dụng Figma toàn diện cho thiết kế web & web publishing / BJ Public

2022.08 / Lần đầu học coding cùng web publishing  / Nhà xuất bản Youngjin

2023.10 / Sổ tay học kèm thực hành Chứng chỉ Kỹ năng Thiết kế Web 2024 SD Edu Yuseonbae / Sidae Gosi Gihoek

2024.11 / Sổ tay ôn thi thực hành Chứng chỉ Kỹ năng thiết kế web Yuseonbae SD Edu 2025 / Nhà xuất bản Sidae Gosi Planning

2025.11 / Sổ tay kèm học thực hành Chứng chỉ Thiết kế Web SD Edu Yoo Sun-bae 2026 / Sidae Gosi Planning

 

Thêm

Chương trình giảng dạy

Tất cả

17 bài giảng ∙ (5giờ 30phút)

Tài liệu khóa học:

Tài liệu bài giảng
Ngày đăng: 
Cập nhật lần cuối: 

Đánh giá

Tất cả

3 đánh giá

5.0

3 đánh giá

  • ekfdud911479님의 프로필 이미지
    ekfdud911479

    Đánh giá 1

    ∙

    Đánh giá trung bình 5.0

    5

    100% đã tham gia

    Tôi từng là người không mấy tự tin về jQuery, nhưng sau khi nghe bài giảng này, tôi đã lấy lại được sự tự tin rồi. Cách giải thích rất dễ hiểu và đi vào lòng người luôn!! Hy vọng sau này bạn sẽ có thêm nhiều bài giảng hay hơn nữa. Xin cảm ơn!

    • ezweb
      Giảng viên

      Cảm ơn bạn rất nhiều vì những đánh giá quý giá về khóa học. ^^

  • mrnobody님의 프로필 이미지
    mrnobody

    Đánh giá 8

    ∙

    Đánh giá trung bình 5.0

    5

    35% đã tham gia

    Cảm ơn bạn vì khóa học tuyệt vời.

    • ezweb
      Giảng viên

      Cảm ơn bạn vì đánh giá khóa học quý báu.

  • sang416님의 프로필 이미지
    sang416

    Đánh giá 8

    ∙

    Đánh giá trung bình 5.0

    5

    65% đã tham gia

    Khóa học khác của ezweb

    Hãy khám phá các khóa học khác của giảng viên!

    Khóa học tương tự

    Khám phá các khóa học khác trong cùng lĩnh vực!

    Giảm 25% cho thành viên mới

    264.979 ₫

    25%

    353.299 ₫