js 相对路径转为绝对路径
有时为了唯一标识网址或其它开发需要,我们需要将相对的网址转换为绝对的网址。当然前人实现方式已经不少,但或多或少的存在缺点或兼容问题。下面我将总结已有实现并给出相对完美的实现。
常规实现:地址转换
因该实现方式千变万化,故略去代码,但在开发时需考虑 base 标签的会带来的地址参照问题。
优点:无浏览器兼容问题。
缺点:代码量大,不简洁,速度慢。
借用浏览器:直接使用链接
var toAbsURL = function(url){
    var a = document.createElement('a');
    a.href = url;
    return a.href;
};
优点:简洁,速度快。
缺点:部分浏览器(IE6, IE7)转换无效。
借用浏览器:封闭链接
var toAbsURL = function(url){
    var div = document.createElement('div');
    div.innerHTML = '<a href="' + url.replace(/"/g, '%22') + '"/>';
    return div.firstChild.href;
};
优点:无浏览器兼容问题。
缺点:速度一般。
借用浏览器:图像方式
var toAbsURL = function(url){
    var result,
        img = document.createElement('img');
    img.src = url;
    result = img.src;
    img.src = null;
    return result;
};
优点:无浏览器兼容问题,速度快。
缺点:会发起 HTTP 请求。
借用浏览器:我的实现
var toAbsURL = function(){
    var directlink = function(url){
        var a = document.createElement('a');
        a.href = url;
        return a.href;
    };
    return directlink('') === '' ? function(url){
        var div = document.createElement('div');
        div.innerHTML = '<a href="' + url.replace(/"/g, '%22') + '"/>';
        return div.firstChild.href;
    } : directlink;
}();
优点:无浏览器兼容问题,使用了浏览器探测功能最大限度提升速度。
缺点:代码量稍大。
js 相对路径转为绝对路径的更多相关文章
- img的绝对路径转为相对路径
		$('#add_img').on('change', function(){ var objUrl = getObjectURL(this.files[0]) ; if (objUrl) { $(th ... 
- 黄聪:PHP转换网址相对路径到绝对路径的一种方法
		相信很多程序(尤其是采集类的程序)都会有需要把网址的相对路径转换成绝对路径的需要,例如采集到某页面的HTML代码中包含资源文件经常会看到这样的文件名: <link rel="style ... 
- JavaScript把项目本地的图片或者图片的绝对路径转为base64字符串、blob对象在上传
		主题: JavaScript把项目本地的图片或者图片的绝对路径转为base64字符串.blob对象在上传. 用处: 从本地选择图片上传,如项目规定只能选择本项目文件夹下的图像上传为头像等. 主要思想: ... 
- javascript中外部js文件取得自身完整路径得办法
		原文:javascript中外部js文件取得自身完整路径得办法 有时候我们需要引入一个外部js文件,这个js文件又需要用到自己的路径或者是所在的目录,别问怎么又这么变态的需求,开发做久了各种奇葩需求也 ... 
- 用node.js express设置路径后 子路径下的页面访问静态资源路径出问题
		在routes/news_mian.js 设置了访问news_main.html 的路径 '/',通知设置一个访问news-page.html的子路径'/newspage'子路径.但是在访问loacl ... 
- js方法用来获取路径传参上所带的参数
		//js方法用来获取路径传参上所带的参数 function GetQueryString(param) { var reg = new RegExp("(^|&)" + p ... 
- 使用监听器解决路径问题,例如在jsp页面引入js,css的web应用路径
		使用监听器解决路径问题,例如在jsp页面引入js,css的web应用路径 经常地,我们要在jsp等页面引入像js,css这样的文件,但是在服务器来访问的时候,这时间就有关到相对路径与绝对路径了.像网页 ... 
- Vue.js Extension Pack 和 jsconfig.json 可以定位跳转到@开头的路径等自定义路径
		Vue.js Extension Pack | vsCode插件 可以定位跳转到@开头的路径等自定义路径 webpack自定义别名后,VScode路径提示问题 //tsconfig.json 或者 j ... 
- 04-Node.js学习笔记-相对路径VS绝对路径
		4.1相对路径VS绝对路径 大多数情况下使用绝对路径,因为相对路径有时候相对的是命令行工具的当前工作目录 在读取文件或者设置文件路径时都会选择绝对路径 4.2使用__dirname 获取当前文件所在的 ... 
随机推荐
- Codeforces 817
			A 你可以按如下方式移动 问能不能从给定的一个坐标走到另一个. [solution] 裸,奇偶性注意 #include<stdio.h> #include<stdlib.h> ... 
- 学习3__STM32--DMA传输模式---
			DMA传输模式 记录 2018-01-26 开始小记 > mode1: Peripheral to Memory 说明: 工程实现的云盘链接 > mode2: Memory to Peri ... 
- c++函数写的都对,还是说incompatible或者not found的解决办法
			vs2010,c++,定义了一个函数如下,在BianHuanYuDib.h文件中: 在BianHuanYuDib.cpp中: 写的完全正确,但还是会报错: 很明显,连std都报错了,一般不是真的有很大 ... 
- 稳定排序nlogn之归并排序_一维,二维
			稳定排序nlogn之归并排序_一维,二维 稳定排序:排序时间稳定的排序 稳定排序包括:归并排序(nlogn),基数排序[设待排序列为n个记录,d个关键码,关键码的取值范围为radix,则进行链式基数排 ... 
- 织梦dedecms搜索页加上序列号autoindex
			在我们做织梦搜索页模板的时候经常会使用到autoindex标签.那么怎么才能实现搜索页可以使用呢?下面给大家分享下解决方法: 打开文件:include/arc.searchview.class.php ... 
- React JSX基本语法规则
			JSX基本语法规则: 遇到HTML(以 < 开头)标签,就用HTML规则解析: 遇到代码块(以 { 开头),就用JavaScript规则解析. 它允许HTML和JavaScript的混写. 注意 ... 
- Your Prediction Gets As Good As Your Data
			Your Prediction Gets As Good As Your Data May 5, 2015 by Kazem In the past, we have seen software en ... 
- js 获取格林尼治时间戳
			昨天在一论坛里看到有朋友问 js 如何获取格林尼治时间戳.不少朋友第一反应是 toGMTString ...确实可以得到格林尼治时间,但不是时间戳.虽然我也没有啥好的方法一步到位的获取,不过至少是获取 ... 
- html之div始终停留在屏幕中间部分
			需求: 使得某一个div始终停留在屏幕中间 实现: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" ... 
- 20155302 2016-2017-2《Java程序设计》第五周学习总结
			20155302 2016-2017-2 <Java程序设计>第5周学习总结 教材学习内容总结 异常类从哪里来?有两个来源,一是Java语言本身定义的一些基本异常类型,二是用户通过继承Ex ... 
