在很多时候
前端也需要获取地址栏的一些信息
比如 服务器地址、端口、参数等等
purl.js能满足这个需求
如何使用呢？
只需要加载这个js
它有两种用法，一种是原生JS，一种是JQuery
/*---- jQuery version -----*/
var url = $.url(); // parse the current page URL
var url = $.url('http://allmarkedup.com'); // pass in a URI as a string and parse that
var url = $('#myElement').url(); // extract the URL from the selected element and parse that - will work on any element with a `src`, `href` or `action` attribute.
/*---- plain JS version -----*/
var url = purl(); // parse the current page URL
var url = purl('http://allmarkedup.com'); // pass in a URI as a string and parse that
有以下这些参数可以查询
| source | The whole url being parsed |
| protocol | eg. http, https, file, etc |
| host | eg. [www.mydomain.com](http://www.mydomain.com), localhost etc |
| port | eg. 80 |
| relative | The relative path to the file including the querystring (eg. /folder/dir/index.html?item=value) |
| path | The path to the file (eg. /folder/dir/index.html) |
| directory | The directory part of the path (eg. /folder/dir/) |
| file | The basename of the file eg. index.html |
| query | The entire query string if it exists, eg. item=value&item2=value2 |
| fragment or anchor | The entire string after the # symbol |
例子
> url = $.url("http://markdown.com/awesome/language/markdown.html?show=all#top");
> url.attr('source');
"http://markdown.com/awesome/language/markdown.html?show=all#top"
> url.attr('protocol');
"http"
> url.attr('host');
"markdown.com"
> url.attr('relative');
"/awesome/language/markdown.html?show=all#top"
> url.attr('path');
"/awesome/language/markdown.html"
> url.attr('directory');
"/awesome/language/"
> url.attr('file');
"markdown.html"
> url.attr('query');
"show=all"
> url.attr('fragment');
"top"
