如何通过Vanilla JS和HTML从URL中获取用户名？

完全可以，根本不需要HTTP GET请求——直接利用浏览器原生的window.location对象就能解析当前页面的URL，提取出用户名。

实现步骤 #

• 获取当前页面的路径部分：通过window.location.pathname能拿到URL里域名之后的路径（比如example.com/u/AbcUser对应的路径是/u/AbcUser）
• 拆分路径：把路径按/分割成数组，比如/u/AbcUser分割后得到["", "u", "AbcUser"]
• 提取用户名：根据URL结构取对应位置的数组元素，这里用户名就是数组索引为2的元素

示例代码 #

HTML结构

<p>当前用户名：<span id="username-display"></span></p>

原生JS逻辑

// 处理URL路径
const pathSegments = window.location.pathname.split('/');

// 提取并校验用户名
let username = '未找到用户名';
if (pathSegments.length >= 3 && pathSegments[1] === 'u') {
  username = pathSegments[2];
}

// 渲染到页面
document.getElementById('username-display').textContent = username;

扩展说明 #

如果你的URL结构有调整（比如路径层级变化），只需要修改数组的索引值或者校验条件即可。比如如果URL是example.com/user/AbcUser，就把判断条件里的pathSegments[1] === 'u'改成pathSegments[1] === 'user'，同时取pathSegments[2]作为用户名。

内容的提问来源于stack exchange，提问作者Dixit Ram