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 相关文章推荐
javascript面向对象的方式实现的弹出层效果代码
Jan 28 Javascript
客户端 使用XML DOM加载json数据的方法
Sep 28 Javascript
JQuery实现倒计时按钮的实现代码
Mar 23 Javascript
快速解决jQuery与其他库冲突的方法介绍
Jan 02 Javascript
Javscript调用iframe框架页面中函数的方法
Nov 01 Javascript
jquery中EasyUI实现异步树
Mar 01 Javascript
jQuery选择器总结之常用元素查找方法
Aug 04 Javascript
JS实现简单获取最近7天和最近3天日期的方法
Apr 18 Javascript
Vue 中axios配置实例详解
Jul 27 Javascript
利用vue-i18n实现多语言切换效果的方法
Jun 19 Javascript
Node.js系列之发起get/post请求(2)
Aug 30 Javascript
Vue实现腾讯云点播视频上传功能的实现代码
Aug 17 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相当简单的分页类
2008/10/02 PHP
基于php冒泡排序算法的深入理解
2013/06/09 PHP
浅析is_writable的php实现
2013/06/18 PHP
CodeIgniter框架过滤HTML危险代码
2014/06/12 PHP
PHP高并发和大流量解决方案整理
2021/03/09 PHP
Pro JavaScript Techniques学习笔记
2010/12/28 Javascript
javascript中检测变量的类型的代码
2010/12/28 Javascript
php与js的区别是什么
2013/08/05 Javascript
javascript动态创建链接的方法
2015/05/13 Javascript
JavaScript每天定时更换皮肤样式的方法
2015/07/01 Javascript
理解JavaScript原型链
2016/10/25 Javascript
jQuery基于Ajax方式提交表单功能示例
2017/02/10 Javascript
angularjs指令之绑定策略(@、=、&amp;)
2017/04/13 Javascript
angular4强制刷新视图的方法
2018/10/09 Javascript
js中async函数结合promise的小案例浅析
2019/04/14 Javascript
jQuery实现条件搜索查询、实时取值及升降序排序的方法分析
2019/05/04 jQuery
Vue.js递归组件实现组织架构树和选人功能案例分析
2019/07/03 Javascript
vue中实现上传文件给后台实例详解
2019/08/22 Javascript
javascript Canvas动态粒子连线
2020/01/01 Javascript
vue tab切换,解决echartst图表宽度只有100px的问题
2020/07/19 Javascript
elementui实现预览图片组件二次封装
2020/12/29 Javascript
python 统计文件中的字符串数目示例
2019/12/24 Python
调整Jupyter notebook的启动目录操作
2020/04/10 Python
如何教少儿学习Python编程
2020/07/10 Python
一个非常简单好用的Python图形界面库(PysimpleGUI)
2020/12/28 Python
Hotels.com香港酒店网:你的自由行酒店订房专家
2018/01/22 全球购物
Europcar美国/加拿大:预订汽车或卡车租赁服务
2018/11/13 全球购物
AP澳洲中文网:澳洲正品直邮,包税收件无忧
2019/07/12 全球购物
Java中各种基本数据类型的默认值都是什么
2016/12/22 面试题
元旦晚会感言
2014/03/12 职场文书
材料员岗位职责
2014/03/13 职场文书
学校募捐倡议书
2014/05/14 职场文书
供用电专业求职信
2014/07/07 职场文书
2015年八一建军节慰问信
2015/03/23 职场文书
浅析Redis Sentinel 与 Redis Cluster
2021/06/24 Redis
python垃圾回收机制原理分析
2022/04/13 Python