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 相关文章推荐
js 获取计算后的样式写法及注意事项
Feb 25 Javascript
JS对话框_JS模态对话框showModalDialog用法总结
Jan 11 Javascript
理解javascript对象继承
Apr 17 Javascript
JS实现的DIV块来回滚动效果示例
Feb 07 Javascript
webpack4 css打包压缩问题的解决
May 18 Javascript
vuejs 制作背景淡入淡出切换动画的实例
Sep 01 Javascript
Element UI 自定义正则表达式验证方法
Sep 04 Javascript
浅谈webpack devtool里的7种SourceMap模式
Jan 14 Javascript
使用webpack4编译并压缩ES6代码的方法示例
Apr 24 Javascript
浅谈webpack 四个核心概念之Entry
Jun 12 Javascript
Moment.js实现多个同时倒计时
Aug 26 Javascript
关于element-ui表单中限制输入纯数字的解决方式
Sep 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 MYSQL简易交互式站点开发
2016/12/27 PHP
PHP实现的mongoDB数据库操作类完整实例
2018/04/10 PHP
JavaScript中的对象化编程
2008/01/16 Javascript
js下将阿拉伯数字每三位一逗号分隔(如:15000000转化为15,000,000)
2014/06/02 Javascript
Bootstrap每天必学之基础排版
2015/11/20 Javascript
jQuery判断浏览器并动态调整select宽度的方法
2016/03/02 Javascript
详解Bootstrap插件
2016/04/25 Javascript
NodeJS的Promise的用法解析
2016/05/05 NodeJs
深入剖析javascript中的exec与match方法
2016/05/18 Javascript
浅谈JavaScript中数组的增删改查
2016/06/20 Javascript
canvas 画布在主流浏览器中的尺寸限制详细介绍
2016/12/15 Javascript
详解Angular的数据显示优化处理
2016/12/26 Javascript
layui select获取自定义属性方法
2018/08/15 Javascript
Vue2.x Todo之自定义指令实现自动聚焦的方法
2019/01/08 Javascript
原生javascript运动函数的封装示例【匀速、抛物线、多属性的运动等】
2020/02/23 Javascript
[01:06:39]DOTA2上海特级锦标赛主赛事日 - 1 胜者组第一轮#1Liquid VS Alliance第三局
2016/03/02 DOTA
python 基础学习第二弹 类属性和实例属性
2012/08/27 Python
利用python批量给云主机配置安全组的方法教程
2017/06/21 Python
Python文件的读写和异常代码示例
2017/10/31 Python
实践Vim配置python开发环境
2018/07/02 Python
关于tf.TFRecordReader()函数的用法解析
2020/02/17 Python
Python ATM功能实现代码实例
2020/03/19 Python
简单掌握CSS3中resize属性的用法
2016/04/01 HTML / CSS
HTML5 Canvas实现图片缩放、翻转、颜色渐变的代码示例
2016/02/28 HTML / CSS
中国包裹转运寄送国际服务:Famiboat
2019/07/24 全球购物
印尼第一大家居、生活和家具电子商务:Ruparupa
2019/11/25 全球购物
Pottery Barn阿联酋:购买家具、家居装饰及更多
2019/12/08 全球购物
会计实习生自我鉴定
2013/12/12 职场文书
高中美术教学反思
2014/01/19 职场文书
保护环境倡议书100字
2014/05/19 职场文书
企业群众路线教育实践活动心得体会
2014/11/03 职场文书
个人学习党的群众路线教育实践活动心得体会
2014/11/05 职场文书
2015年学校食堂工作总结
2015/04/22 职场文书
2016大学生国家助学贷款承诺书
2016/03/25 职场文书
Java图书管理系统,课程设计必用(源码+文档)
2021/06/30 Java/Android
CentOS下安装Jenkins的完整步骤
2022/04/07 Servers