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中巧用“闭包”实现程序的暂停执行功能
Apr 04 Javascript
js中匿名函数的N种写法
Sep 08 Javascript
javascript中关于break,continue的特殊用法与介绍
May 24 Javascript
使用jQuery解决IE与FireFox下createElement方法的差异
Nov 14 Javascript
js实现点击添加一个input节点
Dec 05 Javascript
node.js中使用socket.io制作命名空间
Dec 15 Javascript
Node.js中使用socket创建私聊和公聊聊天室
Nov 19 Javascript
JS实现响应鼠标点击动画渐变弹出层效果代码
Mar 25 Javascript
js实现鼠标左右移动,图片也跟着移动效果
Jan 25 Javascript
jQuery实现弹窗下底部页面禁止滑动效果
Dec 19 jQuery
Vuex 使用及简单实例(计数器)
Aug 29 Javascript
微信小程序基于ColorUI构建皮皮虾短视频去水印组件
Nov 04 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读取文件内容的三种可行方法示例介绍
2014/02/08 PHP
使用 PHPStorm 开发 Laravel
2015/03/24 PHP
jQuery实现密保互斥问题解决方案
2013/08/16 Javascript
javascript实现的弹出层背景置灰-模拟(easyui dialog)
2013/12/27 Javascript
ie7+背景透明文字不透明超级简单的实现方法
2014/01/17 Javascript
jQuery实现列表的全选功能
2015/03/18 Javascript
基于jquery实现左右按钮点击的图片切换效果
2021/01/27 Javascript
Javascript中的几种继承方式对比分析
2016/03/22 Javascript
Nodejs Stream 数据流使用手册
2016/04/17 NodeJs
javascript闭包概念简单解析(推荐)
2016/06/03 Javascript
AngularJS API之copy深拷贝详解及实例
2016/09/14 Javascript
Node.js中.pfx后缀文件的处理方法
2017/03/10 Javascript
详解Vue改变数组中对象的属性不重新渲染View的解决方案
2018/09/21 Javascript
vue实现form表单与table表格的数据关联功能示例
2019/01/29 Javascript
vue项目中使用fetch的实现方法
2019/04/25 Javascript
Vue CLI3中使用compass normalize的方法
2019/05/30 Javascript
js实现简单进度条效果
2020/03/25 Javascript
python转换摩斯密码示例
2014/02/16 Python
结合Python的SimpleHTTPServer源码来解析socket通信
2016/06/27 Python
django批量导入xml数据
2016/10/16 Python
python粘包问题及socket套接字编程详解
2019/06/29 Python
如何利用Python 进行边缘检测
2020/10/14 Python
利用python为PostgreSQL的表自动添加分区
2021/01/18 Python
html5教你做炫酷的碎片式图片切换 (canvas)
2017/07/28 HTML / CSS
希尔顿酒店官方网站:Hilton Hotels
2017/06/01 全球购物
怀旧收藏品和经典纪念品:Betty’s Attic
2018/08/29 全球购物
Love, Bonito国际官网:新加坡女装品牌
2021/03/13 全球购物
日本最大的彩色隐形眼镜销售网站:CharmColor
2020/09/09 全球购物
Java程序开发中如何应用线程
2016/03/03 面试题
半年思想汇报
2013/12/30 职场文书
中级会计职业生涯规划范文
2014/01/16 职场文书
高中运动会广播稿
2014/01/21 职场文书
技术总监管理职责范本
2014/03/06 职场文书
2015年音乐教学工作总结
2015/07/22 职场文书
2016年春节慰问信息大全
2015/11/30 职场文书
springboot项目以jar包运行的操作方法
2021/06/30 Java/Android