JavaScript convert relative address to absolute address sample code_javascript tips

When looking at the LABjs source code, I found a function that converts a relative address into an absolute address. I recorded it as follows:

Copy code The code is as follows:

function canonical_uri(src, base_path)
{
var root_page = /^[^?#]*//.exec(location .href)[0],
root_domain = /^w :///?[^/] /.exec(root_page)[0],
absolute_regex = /^w :///;

// is `src` is protocol-relative (begins with // or ///), prepend protocol
if (/^///?/.test(src))
{
src = location.protocol src;
}
// is `src` page-relative? (not an absolute URL, and not a domain-relative path, beginning with /)
else if (! absolute_regex.test(src) && src.charAt(0) != "/")
{
// prepend `base_path`, if any
src = (base_path || "") src;
}

// make sure to return `src` as absolute
return absolute_regex.test(src) ? src : ((src.charAt(0) == "/" ? root_domain : root_page ) src);
}

If the current page address is: http://www.inspurstb.com/hzt/index.html
then canonical_uri("scy.js") Return to http://www.inspurstb.com/hzt/scy.js

Use Javascript to convert the relative path address into an absolute path

1) Use Image, After testing, an Aborted request will be sent, and IE6 does not support it. Changing new Image to document.createElement_x_x_x('IMG') is the same; the test may not like this solution;

Copy code The code is as follows:

function getAbsoluteUrl(url){
var img = new Image();
img.src = url; // Set the relative path to Image, and a request will be sent
url = img.src; // At this time, the relative path has become an absolute path
img.src = null; // Cancel the request
return url;
}
getAbsoluteUrl("showroom/list");

2) Using Anchor (link), no request will be made, only when joining the DOM A request is generated, but IE6 does not support

Copy code The code is as follows:

function getAbsoluteUrl(url ){
var a = document.createElement_x_x_x('A');
a.href = url; // Set the relative path to Image, and a request will be sent
url = a.href; / / At this point the relative path has become an absolute path
return url;
}
getAbsoluteUrl("showroom/list");

3) Using JavaScript: It is more complicated to implement , here is an example: https://gist.github.com/1088850

In the end, option 2 is used,

This is variable, and all Images are accessed using the original method. , Anchor, all absolute paths are returned. If you want to return the original relative path, you can use the DOM query method, such as jQuery's .attr() method:

console.log($anchor[ 0]["href"]); //Return the absolute path. jQuery objects are essentially arrays, even if there is only one, so use [0] to access the original object, and then take "href";
console .log($anchor.attr("href")); //Return to the original path