Tải bản đầy đủ (.docx) (22 trang)

Báo Cáo Bài Tập Lớn Thiết Kế, Lập Trình Front-End Tên Đề Tài Thiết Kế, Lập Trình Fron-End Website Giày.docx

Bạn đang xem bản rút gọn của tài liệu. Xem và tải ngay bản đầy đủ của tài liệu tại đây (378.21 KB, 22 trang )

TRƯỜNG ĐẠI HỌC ĐẠI NAM
KHOA CÔNG NGHỆ THÔNG TIN

BÁO CÁO BÀI TẬP LỚN
MÔN THỰC TẬP CNTT3 – Thiết kế, lập trình Front-End

TÊN ĐỀ TÀI

Thiết kế, lập trình Fron-End Website giày
Giảng viên hướng dẫn: ThS Nguyễn Đức Thiện
Sinh viên thực hiện:
1. 1571020179: Dương Văn Môn
2. 1571020226: Phan Văn Sơn
3. 1571020209: Trần Trường Phước
4. 1571020206: Hoàng Minh Phụng

Hà Nội, tháng 12 năm 2022


TRƯỜNG ĐẠI HỌC ĐẠI NAM
KHOA CÔNG NGHỆ THÔNG TIN

BÁO CÁO BÀI TẬP LỚN
MÔN THỰC TẬP CNTT3 – Thiết kế, lập trình Front-End

TÊN ĐỀ TÀI

Thiết kế, lập trình Fron-End Website giày
Giảng viên hướng dẫn: ThS Nguyễn Đức Thiện
Sinh viên thực hiện:
1. 1571020179: Dương Văn Môn


2. 1571020226: Phan Văn Sơn
3. 1571020209: Trần Trường Phước
4. 1571020206: Hoàng Minh Phụng

Hà Nội, tháng 12 năm 2022


MỞ ĐẦU
-

Giới thiệu mơn học: Lập trình Front end là việc sử dụng các ngôn ngữ HTML,
CSS hay ngôn ngữ lập trình Javascript để các lập trình viên thiết kế ra các giao
diện ứng dụng hoặc trang web cho người dùng. Những gì bạn nhìn thấy, “chạm”,
“lướt”, tương tác trên màn hình chính là kết quả của lập trình Front end

-

Lý do chọn đề tài: Trong những năm gần đây, cùng với sự nâng cao của chất
lượng cuộc sống con người, nhu cầu mua sắm trang phục, phụ kiện, đặc biệt là
giày càng được đề cao và coi trọng. Giờ đây, chúng ta không chỉ coi giày là
phương tiện để di chuyển mà cịn được coi như một cơng cụ để thể hiện cá tính
và phong cách thời trang của bản thân. Nhất là lúa tuổi thanh thiếu niên, những
người năng động và mạnh mẽ, họ cần có cho mình những đôi giày thật đẹp để
mang lại sự tự tin và thoải mái khi bước đi. Như chúng ta đã thấy trong thị
trường hiện nay thì việc cạnh tranh về kinh doanh ngày trở nên quyết liệt và hầu
hết những cửa hàng vừa và lớn đều chú tâm đến việc làm khách hàng thỏa mãn
và tiện lợi một cách tốt nhất. Biết được những nhu cầu đó, đề tài “Xây dựng
website bán bán giày thể thao MSP” được xây dựng nhằm đáp ứng cho mọi
người tiêu dùng khắp cả nước và thơng qua hệ thống website này họ có thể đặt
mua các mặt hàng hay sản phẩm cần thiết. Không những thế nó cịn giúp cửa

hàng có thể quản lý tốt việc mua bán giúp mang lại lợi ích kinh doanh hiệu quả
hơn.

-

Nội dung ứng dụng các nội dung đã học vào đề tài: HTML, CSS, JS

-

Danh sách thành viên: Dương Văn Mơn, Phan Văn Sơn, Trần Trường Phước,
Hồng Minh Phụng

-

Phân công nhiệm vụ: Dương Văn Môn (Trang chủ + Word), Phan Văn Sơn +
Trần Trường Phước (Admin+Sản phẩm) , Hoàng Minh Phụng (Giới thiệu + Liên
hệ)


LỜI CẢM ƠN
Lời đầu tiên, em xin gởi lời cảm ơn chân thành đến giáo viên hướng dẫn
ThS. Nguyễn Đức Thiện. Trong suốt thời gian học và làm bài tập lớn đã tận
tình hướng dẫn, định hướng và giúp đỡ cho em trong suốt quá trình thực hiện bài
tập lớn này.Đồng thời, em cũng xin cảm ơn các quý thầy cô trong trường Đại
Học Đại Nam đã truyền đạt những kiến thức cần thiết và những kinh nghiệm quý
báu cho em trong thời gian em học tập để em có thể thực hiện tốt bài tập này.
Trong quá trình thực hiện bài tập, do kiến thức và thời gian thực hiện cịn hạn
chế nên khơng thể tránh khỏi những sai sót và thiếu sót. Vì vậy em mong q
thầy cơ thơng cảm và góp ý để em có thể hồn thiện bài tập. Và những lời góp ý
đó là những bước đệm để em có thể phát triển hơn sau này.

Em xin kính chúc tồn thể q thầy,cơ trường Đại Học Đại Nam lời chúc sức
khỏe và thành công trong công tác giảng dạy và học tập.
Em xin chân thành cảm ơn!
Hà Nội, Tháng 12, Năm 2022
Sinh viên thực hiện
Dương Văn Mơn
Trần Trường Phước
Phan Văn Sơn
Hồng Minh Phụng


I.

Chương 1 : Cơ sở lý thuyết về lập trình web Front-End
HTML

1. HTML là gì?
 HTML (HyperText Markup language) là ngôn ngữ đánh dấu siêu văn bản , dung
để tạo ra các trang web .
 HTML bao gồm một số tập hợp các thẻ dùng để :
 Định nghĩa cấu trúc của trang web.
 Định nghĩa nội dung của trang web
 Tạo các siêu liên kết để liên kết đến nhưng trang web khác.
 Chèn âm thanh, hình ảnh, video ,…. vào trang web.
2. Tập tin HTML là gì?

 Tập tin HTML là một loại tin text có chứa các thẻ HTML(tập tin có phần
mở rộng là .html hoặc .htm).
 Tập tin HTML còn được gọi là một trang web.
 Nếu cú pháp có bị sai thì trình duyệt vẫn khơng báo lỗi , nó chỉ hiển thị

khơng như ý muốn.
3. Cấu trúc cơ bản của HTML:
 Một tài liệu HTML ln được gói trong cặp tag <html> và </html>
 Cặp tag <body> và </body> sẽ là nơi mô tả những gì có thể nhìn thấy của trang.
Như vậy, một trang web viết bằng html sẽ có cấu trúc cơ bản như sau:
<html>
<body>
Phầ
n trình bày nội
dung </body>
</html>

Ngồi phần body cịn có phần head, được viết bởi cặp tag <head></head>.
Nếu bạn sử dụng cặp tag này, bạn bắt buộc phải viết thêm một cặp tag nữa, đó
là <title></title>. Giữa <title> và </title> là tên của trang web được hiển thị phía
trên cùng của menubar. Như vậy một trang web với lúc này sẽ có cấu trúc như sau:


<head>
<title>Tiêu đềcủa trang
web</title> </head>
<body>
Phầ
n trình bày nội
dung </body>
</html>

4. Thẻ trong HTML.
 Mỗi thẻ là một từ khóa được bao quanh bởi ngoặc nhọn (vd: <html>;
<head> ;<body>).

 Mỗi thẻ HTML thường bao gồm 1 cặp :thẻ mở (bắt đầu định dạng), thẻ đóng (kết
thúc định dạng).
 Thẻ đóng giống thẻ mở , nhưng ở thẻ đóng thì có thêm dấu gạch chéo “/”trước tên
thẻ (vd: </html>;</head>;</body>).
 Văn bản cần định dạng được đặt giữa thẻ đóng và thẻ mở:
 Các khoảng trắng dư thừa và ký tự xuống dòng sẽ bị bỏ qua.
 Có 2 loại thẻ :
 Thẻ đơn : Các thẻ chỉ có 1 thẻ mở ( vd: <img>)
 Thẻ kép là một cặp thẻ đóng và mở ( vd:

;<i></i> ).
 Các thẻ được lồng vào nhau nhưng không chéo nhau.
Vd đúng :

Tôi là <b>sinh</b>viên


Vd sai:

Tơi là <b>sinh

viên</b>
 Một số thẻ có thêm các thuộc tính.
 Dùng để chỉ định một số thuộc tính khác liên quan đến thẻ .
 Nếu có , sẽ được khai báo trong thẻ mở.
 Vd:

(color là một thuộc tính dùng chỉ màu sắc văn bản.)


II.

CSS

1. CSS là gì?
– CSS là viết tắt của cụm từ “Cascading Style Sheet”, nó là một ngơn ngữ quy định
cách trình bày của các thẻ html trên trang web. Là ngôn ngữ đang được sử dụng
rất nhiều trong lập trình web, có thể nói CSS ra đời đã tạo nên một cuộc cách
mạng. Đôi khi các bạn sẽ bối rối khi nhận thấy rằng các đoạn code mình viết hiển
thị khơng giống nhau trên các trình duyệt khác nhau, CSS sẽ giúp các bạn giải
quyết bài toán này.
– CSS quy định cách hiển thị nội dung của các thẻ HTML trên các trình duyệt gần


như giống nhau, bằng cách quy định các thuộc tính cho thẻ HTML đó. Phương
thức hoạt động của CSS là nó sẽ tìm dựa vào các vùng chọn, vùng chọn có thể là
tên một thẻ HTML, tên một ID, class hay nhiều kiểu khác. Sau đó là nó sẽ áp
dụng các thuộc tính cần thay đổi lên vùng chọn đó.

Hình 1. Giới thiệu CSS
2. Tại sao phải học CSS?
– Css có thể tùy chỉnh bố cục định dạng hiển thị nội dung,màu sắc căn chỉnh màu
nền,đường viền,đổ bóng... cho các thẻ html . Nếu 1 website mà chỉ làm bằng html
khơng sử dụng css thì website đó nhìn sẽ rất thơ xơ. Bạn có thể tưởng tượng nó
như 1 chiếc xe máy mà bỏ hết lớp sơn và áo bên ngồi chỉ cịn lại mỗi bộ khung
và máy.
– CSS cung cấp cho bạn hàng trăm thuộc tính trình bày đành cho các đối tượng với
sự sáng tạo cao trong kết hợp các thuộc tính giúp mang lại hiệu quả.


– Ngoài ra, hiện tại CSS đã được hỗ trợ bởi tất cả các trình duyệt khác nhau.
3. Cấu trúc CSS.
Một đoạn CSS bao gồm 4 phần như thế này:
vùng chọn {
thuộc tính: giá trị;
thuộc tính:giá trị;
}
Nghĩa là nó sẽ được khai báo bằng vùng chọn, sau đó các thuộc tính và giá trị
sẽ nằm bên trong cặp dấu ngoặc nhọn {}. Mỗi thuộc tính sẽ ln có một giá trị
riêng, giá trị có thể là dạng số, hoặc các tên giá trị trong danh sách có sẵn của CSS.
Phần giá trị và thuộc tính phải được cách nhau bằng dấu hai chấm, và mỗi một
dịng khai báo thuộc tính sẽ ln có dấu chấm phẩy ở cuối. Một vùng chọn có thể
sử dụng khơng giới hạn thuộc tính.
VD:

.product-related-title p {
font-family: var(--main-textfont); font-size: 14px;
font-weight:
bold; color:
#333333;
}

4. Cách chèn CSS vào HTML.
Trên thực tế thì chúng ta có tới 3 cách hay được sử dụng chèn css vào website:
– Cách 1: Chèn nội dung CSS vào trong cặp thẻ <style></style> trong phần
<head></head> của trang web.
<!DOCTYPE html>
lang="en">


<head>
<title>Cách chèn CSS vào
html</title> <style>
body{background: red;}
h1{ color:blue;fontsize:12px;} </style>
</head>
<body>

Cách
1

</body>
</html>

– Cách 2 :Chèn nội dung CSS vào trực tiếp thẻ mở thơng qua thuộc tính style:
<!DOCTYPE html>

lang="en">
<head>
<title>Cách chèn CSS vào
html</title> </head>
<body>

Cách
2

</body>
</html>

– Cách 3: Lưu nội dung CSS ra 1 file riêng có phần mở rộng là .css và chèn file
này vào website thông tin thẻ <link>, thường file css được chèn trong cặp thẻ
<head></head>
Sau khi tao file có tên style.css vs nội dung như sau:
body { backgroud:red;}
h1{font-size: 12px;color: blue;}

Lúc này chúng ta sẽ chèn file này vào website như sau:
<!DOCTYPE html>
lang="en">
<head>
<title>Cách chèn CSS vào html</title>
href="style.css">
</head>


<body>
<
h1>Cách2

</body>
</html>

III.

JS

1. JavaScript là gì?
– JS (viết tắt của Javascript) là một nền tảng (cross-platform), ngôn ngữ kịch bản
hướng đối tượng (object-oriented). Nó là một ngơn ngữ nhỏ và nhẹ. Chạy trong
mơi trường máy chủ lưu trữ (ví dụ: trình duyệt web), JavaScript có thể được
kết nối với các đối tượng của mơi trường để cung cấp kiểm sốt chương trình
đối với chúng.
– JavaScript là ngơn ngữ lập trình dựa trên logic. Nó có thể được sử dụng để sửa
đổi nội dung trang web. Và khiến nó hoạt động theo nhiều cách khác nhau để
đáp ứng với hành động của người dùng. Các cách sử dụng phổ biến cho
JavaScript bao gồm các hộp xác nhận, kêu gọi hành động và thêm các danh
tính mới vào thơng tin hiện có.

Hình 2. JavaScript là một trong các ngơn ngữ lập trình đa nền tảng


2. Javascript dùng để làm gì:
– JavaScript có thể được ứng dụng trong rất nhiều lĩnh vực:
 Lập trình web
 Xây dựng ứng dụng cho website máy chủ
 Ứng dụng di động, app, trị chơi…
3. Lợi ích khi dùng Javascript:
Là một ngơn ngữ lập trình phổ biến sử dụng trên 92% nền tảng website hiện
nay, JavaScript đã thể hiện vai trò quan trọng với lĩnh vực này. Tầm quan trọng

của nó thể hiện qua các thao tác, cơng dụng như:
– Triển khai tập lệnh phía máy khách
– Viết mã phía máy chủ
– Thiết kế web responsive
– Google AMP
– Nhiều bộ chuyển đổi

Hình 3. JavaScript được ứng dụng rất nhiều trong việc tạo dựng website
4. Các thư viện Javascript phổ biến:
Hiện nay có rất nhiều thư viện và khung được viết từ Javascript như:
 jQuery: Chuyên về hiệu ứng.
 js: Chuyên xây dựng ứng dụng thời gian thực.
 AngularJS: Chuyên xây dựng ứng dụng trang cá nhân.





ReactJS: Chuyên viết ứng dụng mobile.
Một số thư viện khác như ExtJS, Sencha Touch,….

Hình 4. Ngơn ngữ Javascript có thể được viết bởi những lập trình viên tập sự
5. Làm thế nào để thêm JavaScript trên website của bạn?
Để thêm chuỗi code JavaScript vào trang web, bạn sẽ cần gắn tag
<script></script>. Ví dụ như sau:
type="text/javascript">
Your JavaScript code
</script>


Với quy tắc cơ bản, bạn nên gắn JavaScript trong tag <header> cho website
của bạn trừ khi bạn muốn nó thực thi tại một thời điểm nhất định hoặc một yếu tố
nhất định của trang web. Bạn cũng có thể lưu code JavaScript dưới file riêng và
gọi nó lên mỗi khi cần trên website.
IV. Bootstrap
1. Giới thiệu về Bootstrap
Bootstrap là framework HTML, CSS, và JavaScript phổ biến nhất để phát triển
các trang web có yếu tố tính năng phản hồi và tích hợp trên thiết bị di động. Nếu


như bạn đang có nhu cầu muốn sở hữu một website chuẩn responsive, có khả
năng tương thích trên mọi trình duyệt và thiết bị di động thì chắc chắn cơng nghệ
này sẽ là thành phần lý tưởng không thể thiếu để dùng đến.
2. Bootstrap dùng để làm gì?
Bootstrap giúp quá trình phát triển web được nhanh và dễ dàng hơn. Bootstrap bao
gồm các mẫu thiết kế dựa trên HTML và CSS như typography, forms, buttons,
tables, navigation, modals, image carousels… cũng như các plugin JavaScript tùy
chọn
3. Lợi ích khi dùng Bootstrap
Phát triển giao diện nhanh chóng: Dễ dàng phát triển giao diện website một
cách rất nhanh, nếu một trang bình thường thì có thể cắt xong trong một ngày
hoặc chưa tới một ngày. Chưa kể đến tính tương thích với các trình duyệt và thiết
bị di động
Dễ học, dễ sử dụng: Cộng đồng đông đúc và tài liệu tham khảo rõ ràng chính là
sức mạnh của Bootstrap.
Nền tảng tối ưu: Trong bootstrap đã tạo sẵn một thư viện để lưu trữ mà các nhà
thiết kế có thể sử dụng và tuỳ ý chỉnh sửa theo mục đích cá nhân. Điều này giúp
cho việc phát triển website trở nên nhanh chóng bởi vì có thể lựa chọn một mẫu có
sẵn phù hợp và thêm màu sắc, hình ảnh, video... là đã có ngay giao diện đẹp. Hơn
nữa, bootstrap sự tương thích với trình duyệt và thiết bị đã được kiểm tra nhiều

lần nên hồn tồn có thể n tâm với kết quả mình làm, thậm chí cịn có thể bỏ
qua cả bước kiểm tra lại, và sẽ tiết kiệm được thời gian, tiền bạc cho website của
mình.
Giao diện đầy đủ, sang trọng: Giao diện của bootstrap có màu xám bạc rất sang
trọng và hỗ trợ gần như đầy đủ các thành phần mà một website hiện đại cần có.
Cầu trúc HTML rõ ràng giúp nhanh chóng nắm bắt được cách sử dụng và phát
triển. Khơng những vậy, bootstrap cịn giúp website hiển thị tốt khi chúng ta co
dãn màn hình windows.
Dễ dàng tuỳ biến: Để phù hợp cho nhiều loại website, bootstrap cũng hỗ trợ
thêm tính năng customizer, bạn có thể thay đổi gần như tất cả những thuộc tính
của nó để phù hợp với chương trình của . Nếu những tuỳ chình này vẫn khơng đáp
ứng được u cầu của mình, thì có thể hồn tồn có thể chỉnh sửa trực tiếp trên mã
nguồn của bootstrap. Boostrap tương thích rất tốt với HTML5


Hỗ trợ SEO tốt: Đây là lý do quan trọng nhất bởi vì hiện nay Google đã cập nhật
thuật tốn tìm kiếm và Responsive là một yếu tố rất quan trọng để đưa từ khóa lên
top.
4. Những file chính của Bootstrap được nhiều người sử dụng
Bootstrap.css
Bootstrap.css là một framework CSS có chức năng sắp xếp và quản lý bố cục của trang
web. Trong khi HTML có nhiệm vụ quản lý cấu trúc và nội dung của trang web, CSS sẽ
xử lý bố cục của trang web. Vì vậy mà, cả hai cấu trúc này phải tồn tại song song để thực
hiện một hành động cụ thể.
Với những chức năng của nó, CSS cho phép bạn tạo giao diện thống nhất trên nhiều trang
web khác nhau. Giờ thì bạn khơng phải tốn thời gian với việc phải ngồi hàng giờ để chỉnh
sửa thủ công với những thay đổi độ rộng của đường viền.Với Bootstrap.css, tất cả những
gì bạn cần làm là dẫn các trang web đến file CSS.
Bất kỳ những thay đổi cần thiết có thể được thực hiện trong file đó.Các hàm CSS khơng
chỉ giới hạn ở kiểu văn bản vì chúng cịn được sử dụng để định dạng bảng và bố cục hình

ảnh. Vì CSS có rất nhiều khai báo và bộ chọn, nên bạn cần mất một chút thời gian để
CSS ghi nhớ.
Bootstrap.JS
Bootstrap.JS là phần cốt lõi của Bootstrap bao gồm các file JavaScript đảm nhiệm cho
việc tương tác của website. Để giúp tiết kiệm thời gian viết cú pháp, các nhà phát triển sẽ
sử dụng đến jQuery. Bootstrap.JS có một thư viện JavaScript đa nền tảng với mã nguồn
mở phổ biến cho phép người dùng thêm mới các chức năng khác nhau vào trang
web.Dưới đây là một số chức năng mà jQuery đảm nhiệm:
Thực hiện các yêu cầu của Ajax như: loại bỏ dữ liệu đến từ một vị trí khác nhau
một cách linh hoạt.
 Giúp tạo các tiện ích đơn giản và nhanh chóng bằng bộ sưu tập Plugin JavaScript.
 jQuery tạo hình động tùy chỉnh bằng các thuộc tính của CSS.
 Thêm các tính năng động cho nội dung các trang Web của bạn.
Tuy Bootstrap chỉ cần các thuộc tính Element HTML và CSS đã có thể hoạt động tốt,
nhưng vẫn cần đến jQuery để tạo thiết kế Responsive. Nếu khơng, bạn chỉ có thể sử dụng
các phần tĩnh của CSS mà thôi.


Glyphicons
Để tạo nên một giao diện trang web hồn chỉnh khơng thể thiếu các icons. Chúng được sử
dụng để tạo liên kết với các hành động và dữ liệu nhất định trong giao diện người dùng.


Và Bootstrap sử dụng Glyphicons để đáp ứng nhu cầu này.Bootstrap bao gồm một bộ
Halflings Glyphicons được mở khóa để sử dụng miễn phí
V.

Jquery

Ở phiên bản này, tuy người dùng chỉ có thể lựa chọn giao diện chuẩn nhưng phù hợp với

các chức năng thiết yếu.Nếu bạn muốn muốn sử dụng icon có phong cách hơn, bạn có thể
mua bộ icon premium khác nhau mà Glyphicons có bán, chắc chắn giao diện trang web
của bạn sẽ trơng đẹp hơn.
Ngồi ra, bạn cũng có thể tải các biểu tượng riêng biệt miễn phí trên các trang web khác
nhau như Flaticon, GlyphSearch và Icons8. Hãy lựa chọn và sử dụng icons phù hợp nhất
với trang web bạn cần.
5. Cách nhúng Bootstrap vào HTML
Nhúng từ liên kết của Bootstrap :
!DOCTYPE html>
<html lang="vi">
<head>
<meta charset="utf-8">

<title>Cảm ơn bạn đã quan tâm đế
n Vietnix</title>
h
ref=" />oot strap.min.css"/>
</head>
<body>

Cảm ơn bạn đã quan tâm đế
n Vietnix


</body>


</html>
Nhúng Bootstrap vào HTML bằng cách tự Host :
<!DOCTYPE html>
<html lang="vi">

<head>
<meta charset="utf-8">

<title>Welcome to website</title>
rel="stylesheet"
rel="stylesheet"

href="css/bootstrap.min.css"/>
href="css/style.css"/>

</head>
<body>

Welcome to Website


</body>
</html>
V.

Jquery

1. Jquery là gì?
Jquery là một thư viện JavaScript được thiết kế đơn giản hóa thao tác HTML
DOM, cũng như xử lý sự kiện, hoạt ảnh CSS, và Ajax. Nó là phần mềm mã nguồn
mở, miễn phí sử dụng giấy phép MIT License
2. Jquery dùng để làm gì?
Jquery là một thuật ngữ phổ biến trong lập trình web, dùng để chỉ thư viện
javascript nổi bật. Nó giúp xây dựng cách chức năng cho website bằng javascript,
rất dễ dàng, nhanh chóng, đa dạng. jQuery được ứng dụng giúp website có tính

tương tác, hấp dẫn, thêm các animation để tạo cảm giác sinh động, thông minh


3. Lợi ích khi sử dụng Jquery
Đơn giản, dễ sử dụng: Với cú pháp đơn giản, người dùng chỉ phải viết ít dịng lệnh để
tạo ra các chức năng tương tự, giúp tiết kiệm thời gian hơn cho lập trình viên
Là một thư viện lớn của javaScript: Có khả năng thực thi nhiều chức năng hơn so với
các thư viện javaScript khác
Cộng đồng mã nguồn mở mạnh mẽ (một số plugin jquery có sẵn): JQuery có một
cộng đồng người dùng lớn giúp phát triển các plugin. Nhờ đó mà hàng trăm plugin
được viết sẵn để có thể tải về ngay lập tức, giúp đẩy nhanh quá trình viết code của lập
trình viên. Đồng thời, các script này đều được đảm bảo an tồn và hiệu quả cao.
Có sẵn nhiều tài liệu và hướng dẫn cụ thể: Các trang web JQuery đều có sẵn các bộ tài
liệu và hướng dẫn chi tiết, kể cả người mới làm lập trình cũng có thể tham khảo và áp
dụng trong thực tế.
Hỗ trợ Ajax: JQuery giúp người dùng dễ dàng phát triển các template Ajax. Khơng
chỉ vậy, Ajax cịn giúp giao diện trên website trở nên thu hút hơn, có thể thực hiện các
chức năng ngay trên trang mà khơng phải tải lại tồn bộ trang.
4. Các module phổ biến của Jquery
Ajax (xử lý Ajax)
Effect (xử lý hiệu ứng)
DOM (xử lý Data Object Model)
Event (xử lý sự kiện)
Form (xử lý sự kiện liên quan đến form)
Attributes (xử lý thuộc tính của các đối tượng HTML)
Selector (xử lý luồng lách giữa các đối tượng HTML)
5. Cách sử dụng Jquery
Cài đặt Jquery nội bộ :
html>
<head>



<title>The jQuery Example</title>
<script type="text/javascript" src="../jquery/jquery-2.1.3.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
document.write("Hello, World!");
});
</script>
</head>
<body>

Hello


</body>
</html>

Sử dụng CDN :
<html>
<head>
<title>The jQuery Example</title>

Hello


</body>
</html>


CHƯƠNG 2 : ỨNG DỤNG XÂY DỰNG FRONT-END CHO
WEBSITE GIÀY



×