在Web开发中，有时需要从URL中获取页面文件名。例如，可以通过JavaScript将当前页面的文件名作为参数传递到服务器端，或者使用该文件名进行某些操作。
方法一：使用Location对象
可以使用 location 对象来获取当前页面的URL，并使用 split() 方法对URL进行拆分，以获取文件名。
示例代码：
const fileName = location.href.split('/').pop();
console.log(fileName);解释：
location.href返回当前页面的完整URL。split('/')将URL按照/进行拆分，返回一个由字符串组成的数组。pop()方法返回数组的最后一个元素，即文件名。
这种方法简单易懂，但是在某些情况下可能会出现问题。例如，当URL中包含查询参数或哈希值时，文件名可能不会出现在末尾。
方法二：使用正则表达式
另一种方法是使用正则表达式来匹配URL中的文件名。
示例代码：
const match = window.location.pathname.match(/\/([^\/]+)$/); const fileName = match ? match[1] : ''; console.log(fileName);
解释：
window.location.pathname返回URL中路径部分的字符串，不包括查询参数和哈希值。/\/([^\/]+)$/是一个正则表达式，用于匹配路径中的最后一个斜杠后面的内容。（\/表示匹配斜杠，[^\/]+表示匹配除了斜杠之外的任何字符，$表示匹配字符串的末尾）- 如果匹配成功，则返回一个包含文件名的数组，否则返回空字符串。
这种方法更加灵活，可以适应不同URL格式的情况。但是需要一定的正则表达式知识。
总结
从地址栏获取页面文件名是前端开发中的基本操作之一。可以使用 location 对象或正则表达式来实现。在实际应用中，需要根据具体情况选择合适的方法，并对可能出现的异常情况进行处理。
参考代码：
-- -------------------- ---- -------
--------- -----
------
------
---------- ---- ---- ---- -----------
-------
------
--------
-- ------ -- ----- -------- ------
----- --------- - -------------------------------
------------------- ---- -----------
-- ------ -- ----- ------- ----------
----- ----- - ----------------------------------------------
----- --------- - ----- - -------- - ---
------------------- ---- -----------
---------
-------
-------来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/30311