Làm cách nào chúng tôi có thể nhận URL trong JavaScript?

Question

Ví dụ: nếu bạn cần chia nhỏ tên đường dẫn, một URL như https. // thủ thuật css. com/blah/blah/blah/chỉ mục. html, bạn có thể tách chuỗi thành ký tự “/”

Nội dung chính Show

Đối tượng cửa sổ JavaScript
Đối tượng vị trí JavaScript
JavaScript href đối tượng
cửa sổ. vị trí. href giải thích
Ví dụ về dữ liệu URL được truy xuất bằng cửa sổ. vị trí
Triển khai trình duyệt
Truy xuất dữ liệu URL bằng JQuery
Phần kết luận
Làm cách nào để lấy nội dung URL trong JavaScript?
Làm cách nào để đặt URL trong JavaScript?

var pathArray = window.location.pathname.split('/');

Sau đó truy cập các phần khác nhau theo các phần của mảng, như

var secondLevelLocation = pathArray[0];

Để đặt tên đường dẫn đó lại với nhau, bạn có thể ghép mảng lại với nhau và đặt lại dấu “/” vào

var newPathname = "";
for (i = 0; i < pathArray.length; i++) {
  newPathname += "/";
  newPathname += pathArray[i];
}

Có lẽ cách nhanh nhất để tận dụng tối đa những gì bạn có là đặt window.location vào bảng điều khiển DevTools và xem

URL (Uniform Resources Locator) là đường dẫn cho phép bạn truy cập vào một phiên bản trang web cụ thể. Trình duyệt nhận ra đường dẫn và hiển thị trang web được yêu cầu dựa trên URL đó

Trước khi bắt đầu lấy URL của một trang web, chúng ta cần có kiến thức cơ bản về một số đối tượng như

đối tượng cửa sổ
đối tượng vị trí
đối tượng href

Hãy hiểu cơ bản về từng đối tượng này

Đối tượng cửa sổ JavaScript

JavaScript sử dụng cửa sổ. vị trí. href để lấy URL của trang. ở đây, đối tượng cửa sổ là một đối tượng phổ quát hoặc toàn cầu, về cơ bản là cửa sổ của trình duyệt và đối tượng cửa sổ này cũng chứa tất cả các đối tượng, hàm và biến JavaScript

Đối tượng vị trí JavaScript

Đối tượng vị trí chứa tất cả thông tin về URL hiện tại của trang web, Đối tượng này có thể được truy cập dễ dàng bằng cách sử dụng cửa sổ. vị trí

JavaScript href đối tượng

Href là một thuộc tính có thể được sử dụng để đặt hoặc trả về toàn bộ URL của trang web hiện tại chúng tôi đang làm việc trên đó. thuộc tính này có thể truy cập dưới cửa sổ. vị trí. href

Chúng ta hãy xem toàn bộ đối tượng và các ứng dụng của nó

cửa sổ. vị trí. href giải thích

Trong JavaScript, đối tượng Vị trí chứa thông tin về URL hiện tại của tài liệu, trong khi giao diện Cửa sổ được sử dụng để truy cập nó. Kết quả là bạn có thể truy xuất đối tượng Vị trí cho tài liệu hiện tại bằng Window. vị trí. sau đó sử dụng vị trí tài sản. href để lấy một chuỗi chứa toàn bộ URL

URL hiện tại được hiển thị trong thanh địa chỉ trình duyệt web có thể được truy xuất bằng nhiều kỹ thuật JavaScript. Bạn có thể truy xuất dữ liệu này bằng cách sử dụng thuộc tính đối tượng Vị trí của đối tượng Cửa sổ. Sau đây là danh sách một số đặc điểm của đối tượng vị trí

Các thao tác mà bạn có thể thực hiện khi sử dụng JavaScript được liệt kê bên dưới

Ví dụ về dữ liệu URL được truy xuất bằng cửa sổ. vị trí

Hãy lấy một URL ví dụ ‘ ’ và thực hiện một số thao tác trên đó

Cửa sổ OperationResult. vị trí. hrefhttps. // hết hạn. com. 3737/get?post=exp#querywindow. vị trí. giao thức;https. cửa sổ. vị trí. máy chủ ví dụ. com. 3737cửa sổ. vị trí. tên máy chủ lưu trữ. cửa sổ com. vị trí. cổng3737cửa sổ. vị trí. tên đường dẫngetwindow. vị trí. truy vấn?post=exp

Triển khai trình duyệt

Chúng ta đã thảo luận ở trên về cách chúng ta có thể dễ dàng sử dụng một số đối tượng JavaScript tích hợp để truy xuất URL và thông tin nằm dưới URL như tên máy chủ, tên đường dẫn, truy vấn, v.v. Bây giờ, chúng ta sẽ kiểm tra thực tế cách cửa sổ. vị trí. href hoạt động và cách chúng ta có thể sử dụng nó để lấy URL của trang web khá dễ dàng

JavaScript cho phép bạn lấy URL của một trang web bằng cách sử dụng cửa sổ của nó. thuộc tính vị trí. Bạn chỉ có thể gọi cửa sổ. vị trí. href sẽ trả về cho bạn URL hoàn chỉnh của trang web bao gồm tên máy chủ, tên đường dẫn và chuỗi truy vấn

Hãy kiểm tra thuộc tính JavaScript một cách thực tế

<. DOCTYPE html ><html lang getElementById ('btn')addEventListener ('click',+. vị trí . href )) DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>URL Tutorialtitle>
head>
<body>
<input type="submit" value="Click me" id="btn">

<script>
var btn = document.getElementById('btn')
btn.addEventListener('click', (e)=> alert('The url of this page is: ' + window.location.href))
script>
body>
html>