Chuyển giá trị từ trang html này sang trang html khác bằng javascript

Chào mừng bạn đến với hướng dẫn về cách chuyển biến giữa các trang trong Javascript. Cần chuyển một số dữ liệu giữa các trang khác nhau?

Một cách dễ dàng để chuyển các biến giữa các trang là sử dụng chuỗi truy vấn

• Trên trang đầu tiên

  • 2

  • 3

  • 4
• Trên trang thứ hai

  • 5

  • 6

Nhưng có nhiều phương pháp hơn mà chúng ta có thể sử dụng. Chúng ta hãy xem qua một số ví dụ trong hướng dẫn này và đâu là cách tốt hơn để giải quyết mọi việc – Đọc tiếp

ⓘ Tôi đã bao gồm một tệp zip chứa tất cả mã nguồn ví dụ khi bắt đầu hướng dẫn này, vì vậy bạn không cần phải sao chép-dán mọi thứ… Hoặc nếu bạn chỉ muốn đi sâu vào

TRANG TRÌNH BÀY NHANH

TẢI XUỐNG & LƯU Ý

Đầu tiên, đây là liên kết tải xuống mã ví dụ như đã hứa

GHI CHÚ NHANH

• Hãy lưu ý rằng một số ví dụ này sẽ không hoạt động với
  7. Thay vào đó, hãy sử dụng một máy chủ web phù hợp với
  8

MÃ VÍ DỤ TẢI XUỐNG

Nhấp vào đây để tải xuống mã nguồn, tôi đã phát hành nó theo giấy phép MIT, vì vậy hãy thoải mái xây dựng trên mã nguồn hoặc sử dụng nó trong dự án của riêng bạn

CÁCH CHUYỂN BIẾN GIỮA CÁC TRANG

Được rồi, bây giờ chúng ta hãy tìm hiểu cách truyền biến giữa các trang trong Javascript

PHƯƠNG PHÁP 1) LƯU TRỮ PHIÊN

1a-buổi. html

phiên 1b. html

Đúng, không cần bất kỳ mánh lới quảng cáo nào. Có một khu vực lưu trữ “hộp cát” tạm thời trong Javascript được gọi là lưu trữ phiên. Rất dễ sử dụng, chỉ có 4 chức năng để biết

• 9

• 00

• 01

• 02

Nhưng xin lưu ý rằng bộ nhớ phiên sẽ tự động bị xóa sau khi người dùng đóng tab/cửa sổ

P. S. Dữ liệu cũng sẽ không được chuyển khi người dùng mở tab/cửa sổ khác theo cách thủ công

PHƯƠNG PHÁP 2) LƯU TRỮ CỤC BỘ

2a-lưu trữ cục bộ. html

2b-lưu trữ cục bộ. html

Trông quen quen? . Đúng, cùng một khu vực lưu trữ tạm thời cũ, nhưng bộ nhớ cục bộ là cố định – Mọi thứ được đặt trong bộ nhớ cục bộ sẽ ở lại cho đến khi bị xóa thủ công;

PHƯƠNG PHÁP 3) THAM SỐ URL

truy vấn 3a. html

truy vấn 3b. html

Bạn có thể đã nghe nói về biến

PHƯƠNG PHÁP 4) BẢO QUẢN BÁNH QUY

4a-cookie. html

4b-cookie. html

Bạn cũng có thể đã nghe nói về cookie, một mã thông báo nhỏ để lưu giữ một số dữ liệu… Dù sao, đừng gây rối với cookie trừ khi thực sự cần thiết. Giữ cái này như một phương sách tuyệt vọng cuối cùng

PHƯƠNG PHÁP 5) CỬA SỔ MỚI

cửa sổ 5a. html

cửa sổ 5b. html

Khi tạo một

BIT & LIÊN KẾT HỮU ÍCH

Đó là tất cả cho hướng dẫn này và đây là một phần nhỏ về một số tính năng bổ sung và liên kết có thể hữu ích cho bạn

CẬP NHẬT CÁC QUY TRÌNH

Thời kỳ đồ đá của Internet đã qua lâu rồi. Thay vì tải lại và chuyển hướng các trang, chúng ta thực sự nên xem xét việc tạo ra một trải nghiệm “liền mạch” với các công nghệ hiện đại. Ví dụ: nếu chúng tôi muốn tạo một biểu mẫu kiểu trình hướng dẫn trong đó người dùng chọn một tùy chọn ở bước 1, sau đó chuyển nó sang bước 2 – Chúng tôi có thể sử dụng AJAX để điều khiển toàn bộ ứng dụng

6a-ajax. html

6b-ajax. html

LIÊN KẾT và THAM KHẢO

• Cửa sổ. lưu trữ phiên – MDN
• Cửa sổ. lưu trữ cục bộ – MDN
• Tham số tìm kiếm URL – MDN
• Tài liệu. cookie – MDN
• Chuyển các biến Javascript sang một trang khác – lage. chúng ta
• Hướng dẫn AJAX cho người mới bắt đầu – Code Boxx

VIDEO HƯỚNG DẪN

BẢNG CHEAT INFOGRAPHIC

Cảm ơn bạn đã đọc, và chúng tôi đã đi đến phần cuối của hướng dẫn này. Tôi hy vọng rằng nó đã giúp bạn với dự án của bạn và nếu bạn muốn chia sẻ bất cứ điều gì với hướng dẫn này, xin vui lòng bình luận bên dưới. Chúc may mắn và mã hóa hạnh phúc