js 获取当前链接

在JavaScript中，获取当前链接（即当前页面的URL）可以通过window.location对象来实现。以下是一些常用的属性和方法：

基本属性

• window.location.href：返回完整的URL字符串。
• window.location.protocol：返回URL的协议部分（例如，http:或https:）。
• window.location.hostname：返回URL的主机名部分（例如，www.example.com）。
• window.location.port：返回URL的端口号部分（例如，80或443）。
• window.location.pathname：返回URL的路径名部分（例如，/path/to/page）。
• window.location.search：返回URL的查询字符串部分（例如，?query=param）。
• window.location.hash：返回URL的锚部分（例如，#section1）。

示例代码

// 获取完整的URL
var fullUrl = window.location.href;
console.log("Full URL: " + fullUrl);

// 获取协议
var protocol = window.location.protocol;
console.log("Protocol: " + protocol);

// 获取主机名
var hostname = window.location.hostname;
console.log("Hostname: " + hostname);

// 获取端口号
var port = window.location.port;
console.log("Port: " + port);

// 获取路径名
var pathname = window.location.pathname;
console.log("Pathname: " + pathname);

// 获取查询字符串
var search = window.location.search;
console.log("Search: " + search);

// 获取锚
var hash = window.location.hash;
console.log("Hash: " + hash);

应用场景

1. 页面跳转：可以根据需要修改window.location.href来实现页面跳转。
2. 页面跳转：可以根据需要修改window.location.href来实现页面跳转。
3. 获取查询参数：可以通过解析window.location.search来获取URL中的查询参数。
4. 获取查询参数：可以通过解析window.location.search来获取URL中的查询参数。
5. 动态内容加载：根据URL的不同部分加载不同的内容。
6. 动态内容加载：根据URL的不同部分加载不同的内容。

常见问题及解决方法

1. 跨域问题：如果你尝试从一个页面获取另一个域名的URL信息，会遇到跨域问题。解决方法是使用CORS（跨域资源共享）或JSONP等技术。
2. URL编码问题：URL中的特殊字符会被编码，可以使用decodeURIComponent来解码。
3. URL编码问题：URL中的特殊字符会被编码，可以使用decodeURIComponent来解码。

通过这些方法和属性，你可以灵活地获取和操作当前页面的URL，以满足各种前端开发需求。