Javascript中使用A标签获取当前目录的绝对路径方法


Posted in Javascript onMarch 02, 2015

一谈到路径相关的问题,大家都会往window.location上想,确实这个对象提供了相当多的路径信息,其中常用的就包括:

1.location.href:当前页面的完整URL
2.location.pathname:当前URL中的路径名
3.location.hash:当前URL中的锚点
4.location.search:当前URL中的查询参数

然而,location没有一个属性能直接获得当前目录(不含文件名)的绝对路径。通过Google我发现了一些错误的方法,比如说把URL通过“/”分离成数组,把数组的最后一项去掉以后再连接成字符串。但如果URL中没有指定文件名,结果就大错特错了。

根据以往编码的经验,a元素的href属性总是会返回绝对路径,也就是说它具有把相对路径转成绝对路径的能力。使用下面的代码尝试了一下,果然成了:

var a = document.createElement('a');

a.href = './';

alert(a.href);

a = null;

很不幸地,此方法在老旧的IE 6/7下无效,当执行alert(a.href)时,弹出的仍然是“./”。后来,我发现在Stackoverflow上也有人提出了这个问题,而解决方法也是很简单的,只要把a通过innerHTML注入就可以了:
var div = document.createElement('div');

div.innerHTML = '<a href="./"></a>";

alert(div.firstChild.href);

div = null;

有人可能会问:为何不用正则表达式?我的答案是:要考虑有无文件名的情况、有无锚点的情况、有无查询参数的情况,这条正则表达式可能会挺复杂的。
Javascript 相关文章推荐
强制设为首页代码
Jun 19 Javascript
jQuery 重复加载错误以及修复方法
Dec 16 Javascript
Bootstrap中点击按钮后变灰并显示加载中实例代码
Sep 23 Javascript
Bootstrap下拉菜单样式
Feb 07 Javascript
vue项目中axios使用详解
Feb 07 Javascript
详解Vue内部怎样处理props选项的多种写法
Nov 06 Javascript
vue实现双向绑定和依赖收集遇到的坑
Nov 29 Javascript
vue19 组建 Vue.extend component、组件模版、动态组件 的实例代码
Apr 04 Javascript
layui操作列按钮个数和文字颜色的判断实例
Sep 11 Javascript
javaScript中indexOf用法技巧
Nov 26 Javascript
jquery添加div实现消息聊天框
Feb 08 jQuery
vue2.* element tabs tab-pane 动态加载组件操作
Jul 19 Javascript
JavaScript日期类型的一些用法介绍
Mar 02 #Javascript
了解Javascript的模块化开发
Mar 02 #Javascript
JS实现的4种数字千位符格式化方法分享
Mar 02 #Javascript
js实现图片漂浮效果的方法
Mar 02 #Javascript
ECMAScript 5中的属性描述符详解
Mar 02 #Javascript
JS+CSS实现可以凹陷显示选中单元格的方法
Mar 02 #Javascript
JavaScript数组常用方法
Mar 02 #Javascript
You might like
php程序之die调试法 快速解决错误
2009/09/17 PHP
php实现图片转换成ASCII码的方法
2015/04/03 PHP
PHP封装的HttpClient类用法实例
2015/06/17 PHP
js控制框架刷新
2008/08/01 Javascript
使用CSS和jQuery模拟select并附提交后取得数据的代码
2013/10/18 Javascript
js实现屏幕自适应局部代码分享
2015/01/30 Javascript
javascript搜索框效果实现方法
2015/05/14 Javascript
基于jQuery实现的无刷新表格分页实例
2016/02/17 Javascript
jQuery+PHP实现微信转盘抽奖功能的方法
2016/05/25 Javascript
JavaScript中localStorage对象存储方式实例分析
2017/01/12 Javascript
基于Bootstrap 3 JQuery及RegExp的表单验证功能
2017/02/16 Javascript
element-ui 关于获取select 的label值方法
2018/08/24 Javascript
vue实现点击选中,其他的不选中方法
2018/09/05 Javascript
在vue中安装使用vux的教程详解
2018/09/16 Javascript
详解javascript对数组和json数组的操作
2019/04/15 Javascript
JQuery获取可视区尺寸和文档尺寸及制作悬浮菜单示例
2019/05/14 jQuery
详解解决小程序中webview页面多层history返回问题
2019/08/20 Javascript
详解JS深拷贝与浅拷贝
2020/08/04 Javascript
OpenLayers3实现鼠标移动显示坐标
2020/09/25 Javascript
解决ant Design Search无法输入内容的问题
2020/10/29 Javascript
[45:46]2014 DOTA2国际邀请赛中国区预选赛5.21 HGT VS DT
2014/05/23 DOTA
python实现12306抢票及自动邮件发送提醒付款功能
2018/03/08 Python
基于python list对象中嵌套元组使用sort时的排序方法
2018/04/18 Python
numpy concatenate数组拼接方法示例介绍
2019/05/27 Python
vscode+PyQt5安装详解步骤
2020/08/12 Python
HTML5 Notification(桌面提醒)功能使用实例
2014/03/17 HTML / CSS
使用HTML5的Notification API制作web通知的教程
2015/05/08 HTML / CSS
Pam & Gela官网:美国性感前卫女装品牌
2018/07/19 全球购物
俄罗斯在线购买飞机票、火车票、巴士票网站:Tutu.ru
2020/03/16 全球购物
20岁生日感言
2014/01/13 职场文书
董事长助理岗位职责
2014/02/18 职场文书
地方课程教学计划
2015/01/19 职场文书
2015年医院工作总结范文
2015/04/09 职场文书
开学第一天的感想
2015/08/10 职场文书
大学文艺委员竞选稿
2015/11/19 职场文书
教师正风肃纪心得体会
2016/01/15 职场文书