WEBVTT

00:00:00.570 --> 00:00:03.222
Ở video này, ta sẽ cùng
tìm hiểu những kiến thức cơ bản

00:00:03.222 --> 00:00:05.722
về jQuery và cách sử dụng
công cụ này trên trang web.

00:00:05.722 --> 00:00:09.005
Để sử dụng công cụ này, đầu tiên,
ta cần thêm thư viện jQuery

00:00:09.005 --> 00:00:11.542
bằng việc sử dụng thẻ ''script"

00:00:12.232 --> 00:00:16.122
Trước đây, ta tạo các mã lập
trình JavaScript trong thẻ ''script"

00:00:16.122 --> 00:00:20.276
nhưng lần này ta sẽ thêm thuộc tính "src"

00:00:20.276 --> 00:00:24.391
nhận một đường dẫn URL.

00:00:24.391 --> 00:00:26.566
URL này nên là gì?

00:00:26.566 --> 00:00:28.628
Nếu bạn lập trình trên máy tính,

00:00:28.628 --> 00:00:30.093
bạn có thể tải jQuery xuống

00:00:30.093 --> 00:00:32.615
và nhập vào chương trình
viết trang web trên máy tính

00:00:32.615 --> 00:00:36.473
và điền "jquery.js" vào thuộc tính "src".

00:00:36.473 --> 00:00:39.408
Nhưng ta không làm được
cách này trên Khan Academy.

00:00:39.408 --> 00:00:43.096
Ở đây, ta cần một URL của jQuery

00:00:43.096 --> 00:00:45.885
trên một máy chủ trực tuyến.

00:00:45.885 --> 00:00:50.082
Ta có thể tìm được một danh sách
các URL như vậy trên trang web jquery.com.

00:00:50.622 --> 00:00:53.138
Sau khi tìm được,
ta dán vào thuộc tính "src".

00:00:53.138 --> 00:00:54.160
Được rồi.

00:00:54.160 --> 00:00:56.119
Bây giờ tôi muốn chỉ ra một vài điểm

00:00:56.119 --> 00:00:58.031
cần lưu ý về URL này.

00:00:58.031 --> 00:01:01.820
Thứ nhất, đường dẫn này
bắt đầu bằng "https",

00:01:01.820 --> 00:01:05.231
nghĩa là URL này an toàn.

00:01:05.231 --> 00:01:09.231
Khan Academy chỉ cho phép
dùng các nguồn an toàn,

00:01:09.231 --> 00:01:11.207
nhất là khi bạn đang thực hành

00:01:11.207 --> 00:01:15.343
lập trình trang web.

00:01:15.663 --> 00:01:18.862
Thứ hai, URL này đang được đặt

00:01:18.862 --> 00:01:22.751
trên một máy chủ của
Google là googleapis.com.

00:01:22.751 --> 00:01:25.385
Máy chủ này được gọi là CDN,
viết tắt của từ

00:01:25.385 --> 00:01:27.921
"content delivery network"
(mạng phân phối nội dung).

00:01:27.921 --> 00:01:29.406
Máy chủ này đã được tối ưu hóa

00:01:29.406 --> 00:01:32.625
để chứa các tập tin tĩnh
như thư viện JavaScript

00:01:32.625 --> 00:01:35.388
và cung cấp tập tin nhanh chóng.

00:01:35.388 --> 00:01:38.164
Máy chủ Google là một máy chủ đáng tin.

00:01:38.164 --> 00:01:41.301
Nhìn chung, bạn nên
tìm hiểu các máy chủ

00:01:41.301 --> 00:01:43.002
mà bạn lấy nguồn tập tin

00:01:43.002 --> 00:01:47.240
để tránh nguồn tập tin gây
ảnh hưởng xấu tới trang của bạn.

00:01:47.400 --> 00:01:50.013
Thứ ba, trên URL này có một số

00:01:50.013 --> 00:01:53.807
thể hiện phiên bản là "2.1.4".

00:01:53.807 --> 00:01:56.692
Ta hiểu rằng thư viện jQuery
đang trong quá trình phát triển

00:01:56.692 --> 00:01:59.015
và họ thường phát hành
các phiên bản mới.

00:01:59.015 --> 00:02:00.987
Các số ngoài cùng bên trái

00:02:00.987 --> 00:02:04.019
biểu thị rằng phiên bản 
có nhiều thay đổi lớn và quan trọng.

00:02:04.019 --> 00:02:05.755
Còn các số ngoài cùng bên phải

00:02:05.755 --> 00:02:07.824
thể hiện các thay đổi nhỏ.

00:02:07.824 --> 00:02:10.483
Vậy với số 2.1.4, ta đang
sử dụng jQuery phiên bản 2

00:02:10.483 --> 00:02:12.295
hoạt động với các
trình duyệt hiện đại

00:02:12.295 --> 00:02:14.484
nhưng không hoạt động trên
Internet Explorer 8.

00:02:14.484 --> 00:02:15.635
Trên trang web của mình,

00:02:15.635 --> 00:02:19.627
bạn có thể chọn phiên bản
để dùng dựa trên nhu cầu.

00:02:19.627 --> 00:02:22.809
Được rồi. Chúng ta đã thêm jQuery.

00:02:22.809 --> 00:02:24.973
Ta sẽ thực hiện bước tiếp theo

00:02:24.973 --> 00:02:28.266
để sử dụng jQuery.

00:02:30.226 --> 00:02:33.309
Mọi thư viện JavaScript
đều hiển thị các hàm

00:02:33.309 --> 00:02:35.358
và đặt tên cho các hàm đó.

00:02:35.358 --> 00:02:37.250
Ta phải xem trong tài liệu tham khảo

00:02:37.250 --> 00:02:39.262
để tìm ra tên của các hàm đó

00:02:39.262 --> 00:02:41.761
và chức năng của chúng.

00:02:41.761 --> 00:02:45.444
Thư viện jQuery có một hàm chính,

00:02:45.444 --> 00:02:47.524
có một cái tên rất ngắn.

00:02:47.524 --> 00:02:50.637
Đó chỉ là ký hiệu đô la ($).

00:02:50.637 --> 00:02:52.259
vậy để dùng thư viện jQuery

00:02:52.259 --> 00:02:53.556
ta nhập ký tự là "$"

00:02:53.556 --> 00:02:56.526
theo sau là cặp dấu ngoặc đơn,

00:02:56.526 --> 00:02:59.412
và cuối cùng là dấu chấm phẩy.

00:02:59.412 --> 00:03:01.928
Ta thấy rằng tên hàm ngắn như vậy

00:03:01.928 --> 00:03:05.756
rất tiện khi ta sẽ cần
gọi hàm đó nhiều lần.

00:03:06.226 --> 00:03:08.928
Có rất nhiều thứ ta
có thể truyền vào hàm đó,

00:03:08.928 --> 00:03:10.710
nhưng trong video giới thiệu này.

00:03:10.710 --> 00:03:15.254
Ta sẽ chỉ truyền vào thẻ "h1".

00:03:16.319 --> 00:03:17.697
Như vậy, ta đang yêu cầu

00:03:17.697 --> 00:03:19.724
câu lệnh bảo jQuery tham chiếu đến

00:03:19.724 --> 00:03:23.095
tất cả các phần tử "h1" trên trang web

00:03:23.095 --> 00:03:28.050
và trả lại kết quả là một
đối tượng tập hợp jQuery.

00:03:28.150 --> 00:03:30.691
Sau đó, ta có thể gọi các phương thức

00:03:30.691 --> 00:03:33.233
lênn đối tượng jQuery

00:03:33.233 --> 00:03:37.200
để thực hiện thao tác với
tất cả phần tử "h1" được tham chiếu.

00:03:37.200 --> 00:03:39.939
Ví dụ như ta cần thay đổi
văn bản bên trong của phần tử,

00:03:39.939 --> 00:03:43.356
ta có thể dùng hàm "text"

00:03:43.356 --> 00:03:46.044
và truyền vào nội dung ta cần thay đổi.

00:03:47.244 --> 00:03:48.492
Bạn có thể quan sát

00:03:48.492 --> 00:03:49.792
trên khung kết quả.

00:03:49.792 --> 00:03:50.804
Được rồi.

00:03:50.804 --> 00:03:53.029
Đó là một số kiến thức cơ bản về jQuery.

00:03:53.029 --> 00:03:56.910
Vậy vừa rồi, ta đã đưa
thư viện jQuery vào thẻ ''script",

00:03:56.910 --> 00:03:59.819
yêu cầu jQuery tham chiếu đến
các phần tử "h1" trên trang web

00:03:59.819 --> 00:04:03.643
và thay đổi nội dung văn bản trong "h1".

00:04:03.643 --> 00:04:06.332
Trong các video tiếp theo, ta sẽ tìm hiểu

00:04:06.332 --> 00:04:08.053
nhiều kiến thức chi tiết hơn

00:04:08.053 --> 00:04:11.117
về cách chọn và thao tác với các phần tử

00:04:11.117 --> 00:04:14.353
bằng jQuery để phản hồi
hoạt động của người dùng trên trang,

00:04:14.353 --> 00:04:18.558
hay tạo các hiệu ứng hoạt hình thú vị.