Javascript中使用A标签获取当前目录的绝对路径方法
作者:bea
一谈到路径相关的问题,大家都会往window.location上想,确实这个对象提供了相当多的路径信息,其中常用的就包括: 1.location.href:当前页面的完整URL 2.location.pathname:当前URL中的路径名 3.location.hash:当前URL中的锚点 4.location.search:当前URL中的查询参数 然而,location没有一个属性能直接获得当前目录(不含文件名)的绝对路径。通过Google我发现了一些错误的方法,比如说把U
一谈到路径相关的问题,大家都会往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;
有人可能会问:为何不用正则表达式?我的答案是:要考虑有无文件名的情况、有无锚点的情况、有无查询参数的情况,这条正则表达式可能会挺复杂的。
有用 | 无用
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;
有人可能会问:为何不用正则表达式?我的答案是:要考虑有无文件名的情况、有无锚点的情况、有无查询参数的情况,这条正则表达式可能会挺复杂的。
有用 | 无用
猜你喜欢
您可能感兴趣的文章:
- JS实现鼠标点击展开或隐藏表格行的方法
- 浅谈JavaScript数据类型
- JavaScript中property和attribute的区别详细介绍
- JS+CSS实现自动改变切换方向图片幻灯切换效果的方法
- JS上传图片前实现图片预览效果的方法
- JS控制弹出新页面窗口位置和大小的方法
- js实现带关闭按钮始终显示在网页最底部工具条的方法
- JS实现的网页倒计时数字时钟效果
- js实现在网页上简单显示时间的方法
- Jquery实现地铁线路指示灯提示牌效果的方法
- js实现动画特效的文字链接鼠标悬停提示的方法
- JS实现点击文字对应DIV层不停闪动效果的方法
- JavaScript定时显示广告代码分享
- js实现绿白相间竖向网页百叶窗动画切换效果
- js实现横向百叶窗效果网页切换动画效果的方法
- js实现从中间开始往上下展开网页窗口的方法
- Javascript无参数和有参数类继承问题解决方法
- JS实现超炫网页烟花动画效果的方法
- ECMAScript 5严格模式(Strict Mode)介绍