Blog này sẽ xác định quy trình nhận các giá trị của chuỗi truy vấn trong JavaScript.
Cách lấy giá trị chuỗi truy vấn trong JavaScript?
Để lấy các giá trị của chuỗi truy vấn trong JavaScript, hãy sử dụng các phương pháp sau:
- Sử dụng API URL với phương thức get()
- URLSearchParams với phương thức get()
- URLSearchParams với phương thức values()
Phương pháp 1: Nhận giá trị chuỗi truy vấn bằng API URL với phương thức get()
Sử dụng ' API URL ” với “ được() ” để lấy các giá trị chuỗi truy vấn trong JavaScript. URL (Bộ định vị tài nguyên thống nhất) là một cách để tìm một tài nguyên internet cụ thể. Nó thường bao gồm một giao thức (chẳng hạn như “ http ' hoặc là ' https “), một tên miền (như “ ví dụ.com “), và một đường dẫn (chẳng hạn như “ /đường dẫn/đến/tài nguyên “). URL được sử dụng để truy cập các trang web, tải xuống tệp và truy cập các tài nguyên khác, bao gồm các giá trị chuỗi truy vấn trên internet.
Thí dụ
Tạo một biến lưu trữ URL bằng chuỗi truy vấn:
là urlQueryString = 'https://www.example.com/page.html?keyword=SearchText &fullname=jennyConvey &click=Submit' ;
Gọi đối tượng URL bằng cách chuyển “ urlQueryString ”:
là chuỗi truy vấn = Mới URL ( urlQueryString ) ;
Sử dụng phương thức get() bằng cách chuyển khóa “ từ khóa ” của truy vấn để nhận giá trị của nó với thuộc tính searchParams. Thuộc tính searchParams của đối tượng URL trong JavaScript đại diện cho chuỗi truy vấn của một URL. Nó cung cấp một cách để thao tác chuỗi truy vấn của một URL dưới dạng một đối tượng chứ không phải là một chuỗi:
là giá trị1 = chuỗi truy vấn. tìm kiếmParams . được ( 'từ khóa' ) ;bảng điều khiển. đăng nhập ( 'giá trị của từ khóa:' + giá trị1 ) ;
Nhận giá trị thứ hai từ chuỗi truy vấn bằng cách chuyển khóa của nó tới phương thức get() và in trên bảng điều khiển:
là giá trị2 = chuỗi truy vấn. tìm kiếmParams . được ( 'Họ và tên' ) ;
bảng điều khiển. đăng nhập ( 'giá trị của tên đầy đủ:' + giá trị2 ) ;
Tương tự, lấy giá trị thứ ba trong chuỗi:
là giá trị3 = chuỗi truy vấn. tìm kiếmParams . được ( 'nhấp chuột' ) ;bảng điều khiển. đăng nhập ( 'giá trị của nhấp chuột:' + giá trị3 ) ;
Có thể thấy rằng các giá trị của chuỗi truy vấn đã được truy xuất thành công:
Phương pháp 2: Nhận giá trị chuỗi truy vấn bằng cách sử dụng URLSearchParams với phương thức get()
Các ' URLTìm kiếmThông số ” giao diện có thể được sử dụng trong JavaScript để truy xuất các giá trị từ chuỗi truy vấn. Nó đánh giá chuỗi truy vấn của URL và cung cấp phương tiện để truy cập các giá trị. Lưu ý rằng bạn chỉ nên gửi phần chuỗi truy vấn của URL mà bạn có thể truy xuất phần này bằng cách sử dụng “ window.location.search ” làm tham số cho URLSearchParams().
Thí dụ
Tạo một biến lưu trữ chuỗi truy vấn:
Chuyển chuỗi đến “ URLTìm kiếmThông số ” giao diện:
là chuỗi truy vấn = Mới URLTìm kiếmThông số ( urlQueryString ) ;Lấy giá trị của khóa “ Họ và tên ” từ chuỗi truy vấn bằng cách sử dụng “ được() ' phương pháp:
là giá trị1 = chuỗi truy vấn. được ( 'Họ và tên' ) ;bảng điều khiển. đăng nhập ( 'giá trị của tên đầy đủ:' + giá trị1 ) ;
đầu ra
Ghi chú : Sử dụng ' const queryString = new URLSearchParams(window.location.search) ” để nhận URL đang hoạt động/hiện tại.
Sau khi nhận được URL hiện tại, hãy lấy chuỗi truy vấn từ đó, tạo một phiên bản URLSearchParams và chuyển chuỗi truy vấn tới nó. Cuối cùng, lấy giá trị của một tham số cụ thể trong chuỗi truy vấn bằng phương thức get().
Phương pháp 2: Nhận giá trị chuỗi truy vấn bằng cách sử dụng URLSearchParams với phương thức values()
Bạn cũng có thể sử dụng “ giá trị() ” với giao diện URLSearchParams để truy xuất các giá trị của chuỗi truy vấn. Nó giúp truy cập tất cả các giá trị của chuỗi cùng một lúc.
Thí dụ
Chuyển chuỗi truy vấn tới giao diện URLSearchParams và lưu trữ nó trong một biến “ chuỗi truy vấn ”:
Gọi phương thức values() trong “ vì ” vòng lặp để lấy tất cả các giá trị của chuỗi truy vấn:
vì ( hăng sô giá trị của queryString . giá trị ( ) ) {bảng điều khiển. đăng nhập ( giá trị ) ;
}
Có thể thấy rằng tất cả các giá trị chuỗi đã được tìm nạp:
Đó là tất cả về việc nhận các giá trị chuỗi truy vấn trong JavaScript.
Phần kết luận
Để nhận các giá trị chuỗi truy vấn, hãy sử dụng “ API URL ” với “ được() ” phương pháp và “ tìm kiếmParam ' thuộc tính. Thuộc tính searchParams của đối tượng URL trong JavaScript đại diện cho chuỗi truy vấn của một URL. Bạn cũng có thể sử dụng “ URLTìm kiếmThông số ” giao diện với “ được() ” phương pháp hoặc “ giá trị() ' phương pháp. Blog này đã mô tả quy trình nhận các giá trị của chuỗi truy vấn trong JavaScript.