Một phần quan trọng khi làm việc với JavaScript là biết cách kết nối với các API. Là một nhà phát triển non trẻ, bạn có thể đã từng được yêu cầu…

< font style = "vertical-align: inherit;"> Bạn đang xem: gọi api từ html

Một phần quan trọng khi làm việc với JavaScript là biết cách kết nối với các API. Là một nhà phát triển non trẻ, bạn có thể đã được yêu cầu tại một số thời điểm chỉ “chơi với một số API!” để tìm hiểu chúng là gì và cách làm việc với chúng. Nếu bạn đã từng xem qua tài liệu về API và không biết bắt đầu từ đâu hoặc phải làm gì và cảm thấy thất vọng, thì đây là bài viết dành cho bạn.

Chúng tôi sẽ tạo một ứng dụng web rất đơn giản với JavaScript thuần túy sẽ truy xuất thông tin từ một API và hiển thị thông tin đó trên trang. Sẽ không có máy chủ, phụ thuộc, công cụ xây dựng hay bất kỳ thứ gì khác để tiếp tục làm mờ nước về một chủ đề vốn đã khó và khó hiểu đối với người mới bắt đầu.

Điều kiện tiên quyết

  • Kiến thức cơ bản về HTML và CSS .
  • Kiến thức cơ bản về cú pháp JavaScript và kiểu dữ liệu .
  • Kiến thức cơ bản về cách làm việc với JSON và các đối tượng JavaScript . Bài viết ngắn gọn này sẽ làm rõ hoàn toàn vấn đề đó.

Mọi thứ khác chúng tôi sẽ đề cập trong suốt quá trình.

Mục tiêu

Chúng tôi sẽ viết lại từ đầu ứng dụng web đơn giản này kết nối với Studio Ghibli API , truy xuất dữ liệu bằng JavaScript và hiển thị trên giao diện người dùng của một trang web. Điều này không có nghĩa là một tài nguyên mở rộng về API hoặc REST – chỉ là ví dụ đơn giản nhất có thể để thiết lập và chạy mà bạn có thể xây dựng từ đó trong tương lai. Chúng ta sẽ tìm hiểu:

  • Web API là gì.
  • Tìm hiểu cách sử dụng yêu cầu HTTP GET với JavaScript
  • Cách tạo và hiển thị các phần tử HTML bằng JavaScript.

Nó sẽ giống như thế này:

Hãy bắt đầu.

Tổng quan nhanh

API là viết tắt của Giao diện chương trình ứng dụng, có thể được định nghĩa là một tập hợp các phương thức giao tiếp giữa các thành phần phần mềm khác nhau. Nói cách khác, một API cho phép phần mềm giao tiếp với một phần mềm khác.

Chúng tôi sẽ tập trung đặc biệt vào các API Web, cho phép máy chủ web tương tác với phần mềm của bên thứ ba. Trong trường hợp này, máy chủ web đang sử dụng yêu cầu HTTP để giao tiếp với một URL điểm cuối có sẵn công khai chứa dữ liệu JSON. Nếu bây giờ điều này gây nhầm lẫn, nó sẽ có ý nghĩa ở phần cuối của bài viết.

Bạn có thể quen thuộc với khái niệm ứng dụng CRUD , viết tắt của Tạo, Đọc, Cập nhật, Xóa. Bất kỳ ngôn ngữ lập trình nào cũng có thể được sử dụng để tạo ứng dụng CRUD bằng nhiều phương pháp khác nhau. API web sử dụng các yêu cầu HTTP tương ứng với các động từ CRUD.

Hoạt động
Phương thức HTTP
Sự mô tả

Tạo ra
ĐĂNG
Tạo tài nguyên mới

Đọc
NHẬN
Truy xuất tài nguyên

Cập nhật
PUT / PATCH
Cập nhật tài nguyên hiện có

Xóa bỏ
XÓA
Xóa tài nguyên

Nếu bạn đã nghe đến REST và API RESTful, thì điều đó chỉ đơn giản là đề cập đến một bộ tiêu chuẩn phù hợp với một phong cách kiến ​​trúc cụ thể. Hầu hết các ứng dụng web đều tuân theo hoặc hướng tới việc tuân theo các tiêu chuẩn REST. Nhìn chung, có rất nhiều thuật ngữ, từ viết tắt và khái niệm cần hiểu – HTTP, API, REST – vì vậy bạn cảm thấy bối rối và thất vọng là điều bình thường, đặc biệt là khi tài liệu API cho rằng bạn đã biết phải làm gì.

Thiết lập

Mục tiêu của chúng tôi là gì? Chúng tôi muốn lấy dữ liệu cho tất cả các phim của Studio Ghibli và hiển thị tiêu đề và mô tả trong một lưới. Đối với một số kiến ​​thức nền tảng, Studio Ghibli là một xưởng phim hoạt hình Nhật Bản đã sản xuất một số bộ phim, chẳng hạn như Spirited Away, mà người bạn của tôi Craig đã truyền cảm hứng cho tôi để lấy làm ví dụ.

Chúng ta sẽ bắt đầu bằng cách tạo tệp index.html trong một thư mục mới. Dự án sẽ chỉ bao gồm index.html , style.css scripts.js ở cuối. Khung HTML này chỉ liên kết đến tệp CSS và JavaScript, tải bằng phông chữ và chứa div có id root . Tệp này đã hoàn tất và sẽ không thay đổi. Chúng tôi sẽ sử dụng JavaScript để thêm mọi thứ từ đây ra ngoài.

index.html

  

& lt;!

LOẠI TÀI LIỆU

html

& gt;

& lt;

html

lang

=

"

vi

"

& gt;

& lt;

đầu

& gt; < / p>

& lt;

meta

bộ ký tự

=

"

utf-8 < p class = "dấu chấm câu"> "

/ & gt;

& lt;

meta

tên

=

"

khung nhìn

content

=

"

width = device-width, initial-scale = 1.0

"

p>

/ & gt;

& lt;

title

& gt; < / p>

Ứng dụng Ghibli

& lt; /

title

& gt;

& lt;

liên kết

href

=

"

https: // font.googleapis.com/css?family=Dose:400.700

"

rel

=

"

bảng định kiểu

"

/ & gt;

& lt;

liên kết

href

=

"

style.css < p class = "dấu chấm câu"> "

rel

=

"

bảng định kiểu

"

/ & gt;

& lt; /

đầu

& gt;

& lt;

body

& gt; < / p>

& lt;

div

id

=

"

root

"

& gt;

& lt; /

div

& gt;

& lt;

script

src

=

"

scripts.js < p class = "dấu chấm câu"> "

& gt;

< p p class = "thẻ mã thông báo">

& lt; /

script

& gt;

& lt; /

body

& gt;

& lt; /

html

& gt;

Vì bài viết này tập trung vào các khái niệm về API và JavaScript, tôi sẽ không giải thích cách hoạt động của CSS. Chúng tôi sẽ tạo style.css sẽ được sử dụng để tạo lưới. Để ngắn gọn, tôi chỉ bao gồm CSS cấu trúc có liên quan nhất bên dưới, nhưng bạn có thể sao chép mã CSS đầy đủ tại đây

Xem Thêm  ROUND (Transact-SQL) - Máy chủ SQL - vòng trong máy chủ sql

style.css

 

# root

{

max-width

:

1200px

;

margin

:

0 auto

;

}

. container

{

display

:

flex

;

flex-wrap

:

wrap

;

}

. thẻ

{

margin

:

1rem

;

border

:

1px màu xám đặc

;

}

@ media

screen

(< / p>

min-width

:

600px

)

{

. thẻ

{

flex

:

1 1

calc

(

50% - 2rem

)

;

}

}

@ media

screen

(< / p>

min-width

:

900px

)

{

. thẻ

{

flex

:

1 1

calc

(

33% - 2rem

)

;

}

}

Giờ đây, chúng tôi đã thiết lập HTML và CSS, vì vậy bạn có thể tạo scripts.js và chúng tôi sẽ tiếp tục từ đó.

Đang kết nối với API

Hãy cùng xem qua tài liệu API Studio Ghibli . API này được tạo ra để giúp các nhà phát triển tìm hiểu cách tương tác với các tài nguyên bằng cách sử dụng các yêu cầu HTTP, đây là cách hoàn hảo cho chúng tôi ở đây. Vì một API có thể được truy cập bằng nhiều phương thức khác nhau – JavaScript, PHP, Ruby, Python, v.v. – tài liệu cho hầu hết các API không có xu hướng đưa ra hướng dẫn cụ thể về cách kết nối.

Chúng tôi có thể thấy từ tài liệu này rằng nó cho chúng tôi biết chúng tôi có thể thực hiện các yêu cầu với curl hoặc lệnh gọi REST thông thường, nhưng chúng tôi có thể chưa biết cách thực hiện điều đó .

Lấy điểm cuối API

Để bắt đầu, hãy cuộn đến phần phim . Ở bên phải, bạn sẽ thấy GET / phim . Nó sẽ hiển thị cho chúng tôi URL của điểm cuối API của chúng tôi, https://ghibliapi.herokuapp.com/films . Nhấp vào liên kết đó sẽ hiển thị một mảng các đối tượng trong JSON.

Nếu bạn không có tiện ích mở rộng trên trình duyệt của mình để xem các tệp JSON, hãy thêm một tiện ích mở rộng ngay bây giờ, chẳng hạn như JSON View . Điều này sẽ làm cho việc đọc JSON dễ dàng hơn rất nhiều. Hãy nhớ rằng, nếu bạn chưa từng làm việc với JSON, hãy đọc bài viết điều kiện tiên quyết này .

Truy xuất dữ liệu bằng yêu cầu HTTP

Trước khi chúng tôi cố gắng đưa bất kỳ thứ gì vào giao diện người dùng của trang web, hãy mở một kết nối API. Chúng tôi sẽ làm như vậy bằng cách sử dụng các đối tượng XMLHttpRequest , đây là một cách để mở tệp và thực hiện một yêu cầu HTTP.

Chúng tôi sẽ tạo biến request và gán đối tượng XMLHttpRequest mới cho nó. Sau đó, chúng tôi sẽ mở một kết nối mới với phương thức open () – trong các đối số, chúng tôi sẽ chỉ định loại yêu cầu là GET cũng như URL của điểm cuối API. Yêu cầu hoàn tất và chúng tôi có thể truy cập dữ liệu bên trong hàm onload . Khi hoàn tất, chúng tôi sẽ gửi yêu cầu.

scripts.js

 

var

request

=

new

XMLHttpRequest

(

)

yêu cầu

.

mở

(

'NHẬN'

,

'https://ghibliapi.herokuapp.com/movies'

,

true

)

yêu cầu

.

tải lên

=

hàm

(

)

{

}

yêu cầu

.

gửi

(

)

Ngoài ra, bạn có thể sử dụng API tìm nạp tìm nạp API.> không đồng bộ /

.

  

function

getData

(

)

{

const

response

=

chấp nhận

tìm nạp

(

'https://ghibliapi.herokuapp.com/movies'

)

const

data

=

chấp nhận phản hồi

.

json

(

)

}

Làm việc với phản hồi JSON

Hiện chúng tôi đã nhận được phản hồi từ yêu cầu HTTP của mình và chúng tôi có thể làm việc với nó. Tuy nhiên, phản hồi ở dạng JSON và chúng tôi cần chuyển đổi JSON đó thành các đối tượng JavaScript để hoạt động với nó.

Chúng tôi sẽ sử dụng để phân tích cú pháp phản hồi và tạo một biến data chứa tất cả JSON dưới dạng mảng các đối tượng JavaScript. Sử dụng forEach () , bảng điều khiển của chúng tôi sẽ đăng xuất tiêu đề của từng phim để đảm bảo phim hoạt động bình thường

scripts.js

 

var

data

=

JSON

.

phân tích cú pháp

(

cái này

< p class = "dấu chấm câu">.

response

)

dữ liệu

.

forEach

(

phim

= & gt;

{

bảng điều khiển

.

nhật ký

(

phim

.

title

)

}

)

Sử dụng Kiểm tra trên index.html và xem bảng điều khiển, bạn sẽ có thể xem các tựa đề của 20 bộ phim Ghibli. Thành công!

Điều duy nhất chúng tôi thiếu ở đây là một số cách để xử lý lỗi. Điều gì sẽ xảy ra nếu sử dụng sai URL hoặc URL bị hỏng và không có gì được hiển thị? Khi một yêu cầu HTTP được thực hiện, phản hồi sẽ trả về mã trạng thái HTTP . 404 là phản hồi phổ biến nhất, có nghĩa là Không tìm thấy 200 OK là một yêu cầu thành công

Hãy chỉ gói mã của chúng ta trong một câu lệnh if , thành công với bất kỳ phản hồi nào trong phạm vi 200-300 và đăng xuất lỗi nếu yêu cầu không thành công. Bạn có thể xáo trộn URL để kiểm tra lỗi.

scripts.js

 

var

data

=

JSON

.

phân tích cú pháp

(

cái này

< p class = "dấu chấm câu">.

response

)

if

(yêu cầu

.

trạng thái

& gt; =

200

& amp; & amp;

yêu cầu

.

status

& lt;

400

)

{

dữ liệu

.

forEach

(

phim

= & gt;

{

bảng điều khiển

.

nhật ký

(

phim

.

title

)

}

)

}

khác

{

bảng điều khiển

.

nhật ký

(

'lỗi'

)

}

Đây là toàn bộ mã cho đến nay.

scripts.js

 

var

yêu cầu

=

< p class = "token keyword"> new

XMLHttpRequest

(

)

yêu cầu

.

mở

(

'NHẬN'

,

'https://ghibliapi.herokuapp.com/movies' p class =" mã thông báo dấu chấm câu ">,

true

)

yêu cầu

.

tải lên

=

hàm

(

)

{

var

data

=

JSON

.

phân tích cú pháp

(

cái này

< p class = "dấu chấm câu">.

response

)

if

(yêu cầu

.

trạng thái

& gt; =

200

& amp; & amp;

yêu cầu

.

status

& lt;

400

)

{

dữ liệu

.

forEach

(

phim

= & gt;

{

bảng điều khiển

.

nhật ký

(

phim

.

title

)

}

)

}

khác

{

bảng điều khiển

.

nhật ký

(

'lỗi'

)

}

}

yêu cầu

.

gửi

(

)

Chúng tôi đã sử dụng thành công yêu cầu HTTP GET để truy xuất (hoặc sử dụng) điểm cuối API, bao gồm dữ liệu ở định dạng JSON. Tuy nhiên, chúng tôi vẫn bị mắc kẹt trong bảng điều khiển - chúng tôi muốn hiển thị dữ liệu này trên giao diện người dùng của trang web, chúng tôi sẽ thực hiện bằng cách sửa đổi DOM.

Hiển thị-the-dữ liệu

Để hiển thị thông tin trên giao diện người dùng của một trang web, chúng tôi sẽ làm việc với DOM, thực chất là một API cho phép JavaScript giao tiếp với HTML. Nếu bạn hoàn toàn không có kinh nghiệm với DOM, tôi đã viết bài Hiểu và sửa đổi DOM bằng JavaScript cho DigitalOcean để làm rõ DOM là gì và nó khác với mã nguồn HTML như thế nào.

Ở phần cuối, trang của chúng tôi sẽ bao gồm một hình ảnh biểu trưng theo sau là một vùng chứa có nhiều phần tử thẻ - một phần cho mỗi phim. Mỗi thẻ sẽ có một tiêu đề và một đoạn văn, trong đó có tiêu đề và mô tả của mỗi bộ phim. Đây là giao diện trông như thế này, chỉ với CSS thiết yếu được tải vào:

Nếu bạn nhớ, index.html của chúng tôi hiện chỉ có một div gốc..... Chúng tôi sẽ truy cập nó bằng getElementById () . Hiện tại, chúng tôi có thể xóa tất cả mã trước đó mà chúng tôi đã viết, chúng tôi sẽ thêm lại mã này trong giây lát.

scripts.js

Ứng dụng

  

const

=

document

.

getElementById

(

'gốc'

)

Nếu bạn 'không 100% khẳng định những gì getElementById () làm, hãy lấy đoạn mã trên và console.log (app) . Điều đó sẽ giúp làm rõ điều gì đang thực sự xảy ra ở đó.

Điều đầu tiên trong trang web của chúng tôi là biểu trưng, ​​là một phần tử img . Chúng tôi sẽ tạo phần tử hình ảnh bằng createElement () .

  

const

logo

=

tài liệu

.

createElement

(

'img'

)

img trống không ổn, vì vậy chúng tôi sẽ đặt thuộc tính src thành logo.png . (Tìm thấy tại đây )

  logo 

.

src

=

'logo.png'

Chúng tôi sẽ tạo một phần tử khác, div lần này và đặt thuộc tính class thành container .

  

const

container

=

tài liệu

.

createElement

(

'div'

)

container

.

setAttribute

(

'lớp'

,

'vùng chứa'

) < / p>

Bây giờ chúng ta có một logo và một hộp chứa, và chúng ta chỉ cần đặt chúng vào trang web. Chúng tôi sẽ sử dụng phương thức appendChild () để nối hình ảnh biểu trưng và div vùng chứa vào thư mục gốc của ứng dụng.

  app 

.

appendChild

< p class = "dấu chấm câu"> (

logo

)

ứng dụng

.

appendChild

(

vùng chứa

)

Đây là mã đầy đủ cho điều đó.

scripts.js

  

const

app

=

tài liệu

.

getElementById

(

'gốc'

)

const

logo

=

document

.

createElement

(

'img'

) logo

.

src

=

'logo.png'

const

container

=

document

.

createElement

(

'div'

) container

.

setAttribute

(

'lớp'

,

'vùng chứa'

) < / p> ứng dụng

.

appendChild

(

logo

)

ứng dụng

.

appendChild

(

vùng chứa

)

Sau khi lưu, trên giao diện người dùng của trang web, bạn sẽ thấy như sau.

Phần tử

  

& lt; < / p> div

id

=

"

root

"

& gt;

& lt;

img

src

=

"

logo.png

"

/ & gt;

& lt;

div

class

=

"

container

"

& gt;

& lt; /

div

& gt;

& lt; /

div

& gt;

Điều này sẽ chỉ hiển thị trong tab Kiểm tra phần tử, không hiển thị trong mã nguồn HTML, như được giải thích trong bài viết DOM mà tôi đã liên kết.

Bây giờ, chúng tôi sẽ dán tất cả mã của chúng tôi từ trước đó vào lại. Bước cuối cùng sẽ là lấy những gì chúng tôi đã an ủi trước đó và biến chúng thành các phần tử thẻ.

Dán mọi thứ vào lại, nhưng chúng tôi sẽ chỉ xem xét những gì bên trong forEach () .

  data 

.

forEach

< p class = "dấu chấm câu"> (

phim

= & gt;

{

bảng điều khiển

.

nhật ký

(

phim

.

title

)

bảng điều khiển

.

nhật ký

(

phim

.

mô tả

)

}

)

Thay vì console.log , chúng tôi sẽ sử dụng textContent để đặt văn bản của phần tử HTML thành dữ liệu từ API. Tôi đang sử dụng substring () trên phần tử p để giới hạn mô tả và giữ cho mỗi thẻ có độ dài bằng nhau.

scripts.js

  data 

.

forEach

< p class = "dấu chấm câu"> (

phim

= & gt;

{

const

card

=

document

.

createElement

(

'div'

) thẻ

.

setAttribute

(

'lớp'

,

'thẻ'

) < / p>

const

h1

=

document

.

createElement

(

'h1'

) h1

.

textContent

=

phim

.

title

const

p

=

document

.

createElement

(

'p'

) movie

.

mô tả

=

phim

.

description

.

chuỗi con

(

0

,

300

)

p

.

textContent

=

`

$ {

phim

.

mô tả

}

...

`

container

.

appendChild

(

thẻ

)

thẻ

.

appendChild

(

h1

)

thẻ

.

appendChild

(

p

)

}

)

Tôi cũng sẽ thay thế lỗi của bảng điều khiển bằng lỗi ở giao diện người dùng, khi sử dụng phần tử HTML tốt nhất, marquee ! (Tôi chỉ làm điều này như một trò đùa cho mục đích vui vẻ và minh họa, không thực sự sử dụng marquee trong bất kỳ loại ứng dụng thực tế nào, hoặc tôi thực sự nghiêm túc ở đây.) < / p>

  

const

errorMessage

=

.

createElement

(

'marquee'

)

errorMessage

.

textContent

=

`

Gah, nó không hoạt động!

`

ứng dụng

.

appendChild

(

errorMessage

)

Và chúng ta đã hoàn tất! Đây là mã scripts.js cuối cùng.

scripts.js

  

const

app

=

tài liệu

.

getElementById

(

'gốc'

)

const

logo

=

document

.

createElement

(

'img'

) logo

.

src

=

'logo.png'

const

container

=

document

.

createElement

(

'div'

) container

.

setAttribute

(

'lớp'

,

'vùng chứa'

) < / p> ứng dụng

.

appendChild

(

logo

)

ứng dụng

.

appendChild

(

vùng chứa

)

var

request

=

new

XMLHttpRequest

(

)

yêu cầu

.

mở

(

'NHẬN'

,

'https://ghibliapi.herokuapp.com/films'

< p class = "dấu chấm câu">,

true

)

yêu cầu

.

tải lên

=

hàm

(

)

{

var

data

=

JSON

.

phân tích cú pháp

(

cái này

< p class = "dấu chấm câu">.

response

)

if

(yêu cầu

.

trạng thái

& gt; =

200

& amp; & amp;

yêu cầu

.

status

& lt;

400

)

{

dữ liệu

.

forEach

(

phim

= & gt;

{

const

card

=

document

.

createElement

(

'div'

) Thẻ

.

setAttribute

(

'class'

,

'thẻ'

)

const

h1

=

document

.

createElement

(

'h1'

) p> h1

.

textContent

=

phim

.

title

const

p

=

document

.

createElement

(

'p'

)

) p> phim

.

mô tả

=

phim

.

mô tả

.

chuỗi con

(

0

,

300

)

p

.

textContent

=

`

$ {

phim

. mô tả

}

...

`

container

.

appendChild

(

thẻ

)

thẻ

.

appendChild

(

h1

)

thẻ

.

appendChild

(

p

)

}

)

}

khác

{

const

error chức năng "> createElement

(

'marquee'

)

) p> errorMessage

.

textContent

=

`

Gah, nó không hoạt động!

`

ứng dụng

.

appendChild

(

errorMessage

)

}

}

yêu cầu

.

gửi

(

)

Nếu bạn đang tìm kiếm kiểu CSS đầy đủ, thì đây là sản phẩm cuối cùng trông như thế nào.

Một lần nữa, đây là liên kết đến ứng dụng trực tiếp và mã nguồn.

Kết luận

Xin chúc mừng, bạn đã sử dụng JavaScript thuần túy để kết nối với API bằng các yêu cầu HTTP. Hy vọng rằng bạn đã hiểu rõ hơn về điểm cuối API là gì, cách trình duyệt giao tiếp với dữ liệu API của bên thứ ba bằng các yêu cầu và phản hồi, cách phân tích cú pháp JSON thành các mảng và đối tượng mà JavaScript hiểu được và cách xây dựng giao diện người dùng hoàn toàn bằng JavaScript .

Chúng tôi đã làm tất cả điều này mà không phải lo lắng về bất kỳ điều gì như Node.js, NPM, Webpack, React, Angular, công cụ xây dựng, jQuery, Axios và các thuật ngữ phát triển, phụ thuộc và khuôn khổ phổ biến khác có thể khiến bạn nhầm lẫn về những gì đang xảy ra dưới mui xe ở dạng đơn giản nhất.

Tôi hy vọng bạn thấy bài viết này hữu ích và vui lòng chia sẻ.


Xem thêm những thông tin liên quan đến chủ đề gọi api từ html

Tạo một ứng dụng chỉ với HTML, CSS & JavaScript bằng dữ liệu từ API - User List Application

  • Tác giả: Kent Wynn
  • Ngày đăng: 2021-09-15
  • Đánh giá: 4 ⭐ ( 7696 lượt đánh giá )
  • Khớp với kết quả tìm kiếm: Trong video này, Kent Wynn sẽ tạo một ứng dụng Danh Sách User bằng cách Fetch dữ liệu từ API và hiển thị lên trình duyệt chỉ đơn giản sử dụng HTML, CSS và JavaScript.

    publicAPI javascript
    ___

    . Xem thêm nhiều bài viết về Frontend tại https://kentwynn.com
    . Học Lập Trình Frontend bằng Việt Ngữ/English tại https://kentwynn.com/become-frontend-master
    . Dịch vụ tạo Website với Kent Wynn's team tại https://kentwynn.com/website-services
    . Dịch vụ Digital Marketing với Kent Wynn's team tại https://kentwynn.com/marketing-services
    . Làm việc cùng với Kent Wynn tại https://kentwynn.com/hire-me
    . Hỗ trợ Kent Wynn tại https://kentwynn.com/donate-me

    kentwynn frontend laptrinh hocfrontend

    © 2021 Kent Wynn - Software Engineer | UI/UX & Frontend Architect | All Rights Reserved.
    © 2021 Bản quyền thuộc về Kent Wynn - Kỹ Sư Phần Mềm | UI/UX & Frontend.

Javascript AJAX, Fetch API

  • Tác giả: www.doidev.com
  • Đánh giá: 4 ⭐ ( 5853 lượt đánh giá )
  • Khớp với kết quả tìm kiếm:

Cùng một lệnh gọi API POST trong các thư viện JavaScript khác nhau

  • Tác giả: tech-wiki.online
  • Đánh giá: 4 ⭐ ( 2218 lượt đánh giá )
  • Khớp với kết quả tìm kiếm:

Cách sử dụng API tìm nạp JavaScript để lấy dữ liệu

  • Tác giả: galaxyz.net
  • Đánh giá: 3 ⭐ ( 8561 lượt đánh giá )
  • Khớp với kết quả tìm kiếm:

Cách sử dụng File API trong HTML 5

  • Tác giả: viblo.asia
  • Đánh giá: 5 ⭐ ( 3386 lượt đánh giá )
  • Khớp với kết quả tìm kiếm: Trong HTML 5 trên Firefox, File API đã được thêm vào trong DOM, nó cho phép yêu cầu user chọn file trên local và đọc nội dung của các file đó. Việc chọn này được dùng thông qua thẻ

Hướng dẫn và ví dụ Javascript Fetch API

  • Tác giả: openplanning.net
  • Đánh giá: 4 ⭐ ( 5522 lượt đánh giá )
  • Khớp với kết quả tìm kiếm:

ReactJS: Gọi API để lấy dữ liệu cho Search Form

  • Tác giả: thaunguyen.com
  • Đánh giá: 4 ⭐ ( 5175 lượt đánh giá )
  • Khớp với kết quả tìm kiếm:

Xem thêm các bài viết khác thuộc chuyên mục: Kiến thức lập trình

By ads_php