1
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

2
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.

3
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

4
00:00:09,005 --> 00:00:11,542
bằng việc sử dụng thẻ ''script"

5
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"

6
00:00:16,122 --> 00:00:20,276
nhưng lần này ta sẽ thêm thuộc tính "src"

7
00:00:20,276 --> 00:00:24,391
nhận một đường dẫn URL.

8
00:00:24,391 --> 00:00:26,416
Vậy URL này nên là gì?

9
00:00:26,416 --> 00:00:29,088
Nếu bạn lập trình ở
trình soạn thảo riêng trên máy tính,

10
00:00:29,088 --> 00:00:30,401
bạn có thể tải jQuery xuống

11
00:00:30,401 --> 00:00:32,615
rồi nhập lệnh để kết nối với tệp jquery đó

12
00:00:32,615 --> 00:00:36,473
bằng cách điền "jquery.js"
vào thuộc tính "src".

13
00:00:36,473 --> 00:00:39,408
Nhưng ta không làm được
cách này trên Khan Academy.

14
00:00:39,408 --> 00:00:43,096
Ở đây, ta cần điền một URL của jQuery

15
00:00:43,096 --> 00:00:45,885
trên một máy chủ trực tuyến.

16
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.

17
00:00:50,362 --> 00:00:53,138
Sau khi tìm được URL,
ta dán vào thuộc tính "src".

18
00:00:53,138 --> 00:00:54,160
Được rồi.

19
00:00:54,160 --> 00:00:56,119
Bây giờ, ta cần lưu ý một số điều sau

20
00:00:56,119 --> 00:00:58,031
khi dùng URL jquery.

21
00:00:58,031 --> 00:01:01,820
Thứ nhất, đường dẫn này
cần bắt đầu bằng "https",

22
00:01:01,820 --> 00:01:05,231
nghĩa là URL này an toàn.

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

24
00:01:09,231 --> 00:01:11,357
khi bạn đang thực hành
lập trình trang web.

25
00:01:11,357 --> 00:01:14,273
Đó cũng là điều bạn
cần lưu ý khi lập trình nói chung.

26
00:01:15,663 --> 00:01:18,862
Tiếp theo, điều thứ hai ta cần chú ý
là URL này đang được đặt

27
00:01:18,862 --> 00:01:22,751
trên một máy chủ của
Google là googleapis.com.

28
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ừ

29
00:01:25,385 --> 00:01:27,921
"content delivery network"
(mạng phân phối nội dung).

30
00:01:27,921 --> 00:01:29,406
Máy chủ này đã được tối ưu hóa

31
00:01:29,406 --> 00:01:32,625
để chứa các tệp tin tĩnh
như thư viện JavaScript

32
00:01:32,625 --> 00:01:35,388
và cung cấp tệp tin nhanh chóng.

33
00:01:35,388 --> 00:01:38,164
Máy chủ Google là một máy chủ đáng tin.

34
00:01:38,164 --> 00:01:41,301
Nhìn chung, bạn nên
tìm hiểu các máy chủ

35
00:01:41,301 --> 00:01:43,002
mà bạn lấy nguồn tệp tin

36
00:01:43,002 --> 00:01:47,240
để tránh những nguy cơ
xấu ảnh hưởng tới trang web của bạn.

37
00:01:47,400 --> 00:01:50,013
Thứ ba, trên URL này có số hiệu

38
00:01:50,013 --> 00:01:53,807
thể hiện phiên bản là "2.1.4".

39
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

40
00:01:56,692 --> 00:01:58,895
và họ thường phát hành
các phiên bản mới.

41
00:01:58,895 --> 00:02:02,302
Trong số hiệu phiên bản, sự tăng lên
của các chữ số ngoài cùng bên trái

42
00:02:02,302 --> 00:02:04,469
thể hiện cho
những thay đổi lớn và quan trọng.

43
00:02:04,469 --> 00:02:06,808
Còn sự tăng lên của
các chữ số ngoài cùng bên phải

44
00:02:06,808 --> 00:02:08,254
đại diện cho các thay đổi nhỏ.

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

46
00:02:10,713 --> 00:02:12,595
tương thích với các
trình duyệt hiện đại

47
00:02:12,595 --> 00:02:15,074
nhưng không hoạt động được
trên Internet Explorer 8.

48
00:02:15,074 --> 00:02:16,145
Với trang web của bạn,

49
00:02:16,145 --> 00:02:19,627
bạn có thể chọn phiên bản
để dùng tùy theo nhu cầu.

50
00:02:19,627 --> 00:02:22,809
Được rồi. Vậy là chúng ta đã thêm jQuery.

51
00:02:22,809 --> 00:02:24,973
Ta sẽ thực hiện bước tiếp theo

52
00:02:24,973 --> 00:02:28,266
để sử dụng jQuery.

53
00:02:30,226 --> 00:02:33,309
Mọi thư viện JavaScript
đều có sẵn các hàm

54
00:02:33,309 --> 00:02:35,358
và đặt tên cho các hàm đó.

55
00:02:35,358 --> 00:02:37,250
Ta phải xem trong tài liệu tham khảo

56
00:02:37,250 --> 00:02:39,262
để tìm ra tên của mỗi hàm

57
00:02:39,262 --> 00:02:41,761
và chức năng tương ứng.

58
00:02:41,761 --> 00:02:45,444
Thư viện jQuery có một hàm chính

59
00:02:45,444 --> 00:02:47,524
với một cái tên rất ngắn.

60
00:02:47,524 --> 00:02:50,637
Đó chỉ là ký hiệu đô la ($).

61
00:02:50,637 --> 00:02:52,259
Vậy để dùng thư viện jQuery

62
00:02:52,259 --> 00:02:53,966
ta nhập hàm bằng ký tự là "$"

63
00:02:53,966 --> 00:02:56,526
theo sau là cặp dấu ngoặc đơn

64
00:02:56,526 --> 00:02:59,412
và cuối cùng là dấu chấm phẩy.

65
00:02:59,412 --> 00:03:01,928
Ta thấy rằng tên hàm ngắn như vậy

66
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.

67
00:03:06,226 --> 00:03:08,928
Có rất nhiều thứ ta
có thể truyền vào hàm này,

68
00:03:08,928 --> 00:03:10,710
nhưng trong video giới thiệu này,

69
00:03:10,710 --> 00:03:15,254
ta sẽ thử truyền vào chuỗi ký tự là "h1".

70
00:03:16,319 --> 00:03:17,697
Như vậy, với câu lệnh này,

71
00:03:17,697 --> 00:03:19,724
ta đang yêu cầu jQuery tham chiếu đến

72
00:03:19,724 --> 00:03:23,095
tất cả các phần tử "h1" trên trang web

73
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.

74
00:03:28,150 --> 00:03:30,691
Sau đó, ta có thể gọi các phương thức

75
00:03:30,691 --> 00:03:33,233
lên đối tượng jQuery

76
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.

77
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ử,

78
00:03:39,939 --> 00:03:43,356
ta có thể dùng hàm "text"

79
00:03:43,356 --> 00:03:46,044
và truyền vào nội dung ta cần thay đổi.

80
00:03:47,244 --> 00:03:50,804
Bạn có thể quan sát thấy
sự thay đổi trên khung kết quả.

81
00:03:50,804 --> 00:03:53,199
Và đó là một số kiến thức cơ bản về jQuery.

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

83
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

84
00:03:59,819 --> 00:04:03,643
và thay đổi nội dung văn bản trong "h1".

85
00:04:03,643 --> 00:04:06,332
Trong các video tiếp theo, ta sẽ tìm hiểu

86
00:04:06,332 --> 00:04:08,053
nhiều kiến thức chi tiết hơn

87
00:04:08,053 --> 00:04:11,117
về cách chọn và thao tác với các phần tử

88
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

89
00:04:14,353 --> 00:04:18,558
hoặc tạo các hiệu ứng hoạt hình thú vị.