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 相关文章推荐
Firefox 无法获取cssRules 的解决办法
Oct 11 Javascript
jQuery学习笔记之jQuery选择器的使用
Dec 22 Javascript
js调用iframe实现打印页面内容的方法
Mar 04 Javascript
js计算德州扑克牌面值的方法
Mar 04 Javascript
JavaScript使用addEventListener添加事件监听用法实例
Jun 01 Javascript
微信小程序实现倒计时60s获取验证码
Apr 17 Javascript
vue.js整合mint-ui里的轮播图实例代码
Dec 27 Javascript
vue2.0 自定义 饼状图 (Echarts)组件的方法
Mar 02 Javascript
微信小程序如何像vue一样在动态绑定类名
Apr 17 Javascript
小程序使用wxs解决wxml保留2位小数问题
Dec 13 Javascript
小程序中设置缓存过期的实现方法
Jan 14 Javascript
Vue列表循环从指定下标开始的多种解决方案
Apr 08 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写的采集程序
2007/03/16 PHP
那些年一起学习的PHP(一)
2012/03/21 PHP
PHP闭包(Closure)使用详解
2013/05/02 PHP
Zend Framework框架Smarty扩展实现方法
2016/03/22 PHP
鼠标经过的文本框textbox变色
2009/05/21 Javascript
Jquery进度条插件 Progress Bar小问题解决
2011/07/12 Javascript
js全屏显示显示代码的三种方法
2013/11/11 Javascript
Javascript高级技巧分享
2014/02/25 Javascript
nodejs的10个性能优化技巧
2014/07/15 NodeJs
JavaScript截取、切割字符串的技巧
2016/01/07 Javascript
基于javascript实现九九乘法表
2016/03/27 Javascript
JavaScript兼容性总结之获取非行间样式案例
2016/08/07 Javascript
浅谈JavaScript 函数参数传递到底是值传递还是引用传递
2016/08/23 Javascript
打造自己的jQuery插件入门教程
2016/09/23 Javascript
Jq通过td获取同行其它列td的方法
2016/10/05 Javascript
利用canvas实现的加载动画效果实例代码
2017/07/05 Javascript
JS动态添加元素及绑定事件造成程序重复执行解决
2017/12/07 Javascript
jQuery实现常见的隐藏与展示列表效果示例
2018/06/04 jQuery
nodejs用gulp管理前端文件方法
2018/06/24 NodeJs
vue-router权限控制(简单方式)
2018/10/29 Javascript
JQuery animate动画应用示例
2019/05/14 jQuery
微信小程序一周时间表功能实现
2019/10/17 Javascript
Jquery异步上传文件代码实例
2019/11/13 jQuery
微信小程序音乐播放器开发
2019/11/20 Javascript
js实现贪吃蛇游戏 canvas绘制地图
2020/09/09 Javascript
[01:07:17]EG vs Optic Supermajor 败者组 BO3 第一场 6.6
2018/06/07 DOTA
[01:00:49]DOTA2-DPC中国联赛 正赛 Ehome vs iG BO3 第二场 1月31日
2021/03/11 DOTA
Python绘制KS曲线的实现方法
2018/08/13 Python
Python3.5集合及其常见运算实例详解
2019/05/01 Python
Python Request爬取seo.chinaz.com百度权重网站的查询结果过程解析
2019/08/13 Python
Python Django2.0集成Celery4.1教程
2019/11/19 Python
香蕉共和国Banana Republic官网:美国GAP旗下偏贵族风格服饰品牌
2016/11/21 全球购物
美国糖果店:Sugarfina
2019/02/21 全球购物
Michael Kors澳大利亚官网:世界知名的奢侈饰品和成衣设计师
2020/02/13 全球购物
化学工程专业求职信
2014/08/10 职场文书
社区青年志愿者活动总结
2015/05/06 职场文书