html打开浏览器uri,URI.js 多功能浏览器 URL 操作库 - 文章教程
作为前端开发者，经常要操作 URL 地址，比如下面的代码：
var url = "http://example.org/foo?bar=baz";
var separator = url.indexOf('?') > -1 ? '&' : '?';
url += separator + encodeURIComponent("foo") + "=" + encodeURIComponent("bar");
通过使用 URI.js 我们可以把工作变得很简单：
var url = new URI("http://example.org/foo?bar=baz");
url.addQuery("foo", "bar");
URI.js 就是为了简化我们对 URL 的操作。
API 示例
// mutating URLs
URI("http://example.org/foo.html?hello=world")
.username("rodneyrehm")
// -> http://rodneyrehm@example.org/foo.html?hello=world
.username("")
// -> http://example.org/foo.html?hello=world
.directory("bar")
// -> http://example.org/bar/foo.html?hello=world
.suffix("xml")
// -> http://example.org/bar/foo.xml?hello=world
.query("")
// -> http://example.org/bar/foo.xml
.tld("com")
// -> http://example.com/bar/foo.xml
.query({ foo: "bar", hello: ["world", "mars"] });
// -> http://example.com/bar/foo.xml?foo=bar&hello=world&hello=mars
// cleaning things up
URI("?&foo=bar&&foo=bar&foo=baz&")
.normalizeQuery();
// -> ?foo=bar&foo=baz
// working with relative paths
URI("/foo/bar/baz.html")
.relativeTo("/foo/bar/world.html");
// -> ./baz.html
URI("/foo/bar/baz.html")
.relativeTo("/foo/bar/sub/world.html")
// -> ../baz.html
.absoluteTo("/foo/bar/sub/world.html");
// -> /foo/bar/baz.html
// URI Templates
URI.expand("/foo/{dir}/{file}", {
dir: "bar",
file: "world.html"
});
// -> /foo/bar/world.html
使用 URI.js
URI.js 在没有插件的情况下大约 7KB 的压缩重量，如果你使用所有的扩展，你最终在大约 13 kb。可以通过 bower 或者 npm 安装
# using bower
bower install uri.js
# using npm
npm install urijs
在浏览器中使用
你可以直接引入压缩版的 URI.js 文件
Node.js 和 NPM
用 npm install urijs 或添加 urijs 中的依赖项 package.json。
// load URI.js
var URI = require('urijs');
// load an optional module (e.g. URITemplate)
var URITemplate = require('urijs/src/URITemplate');
URI("/foo/bar/baz.html")
.relativeTo("/foo/bar/sub/world.html")
// -> ../baz.html
RequireJS
克隆 URI.js 存储库或使用包管理器将 URI.js 导入到您的项目中。
require.config({
paths: {
urijs: 'where-you-put-uri.js/src'
}
});
require(['urijs/URI'], function(URI) {
console.log("URI.js and dependencies: ", URI("//amazon.co.uk").is('sld') ? 'loaded' : 'failed');
});
require(['urijs/URITemplate'], function(URITemplate) {
console.log("URITemplate.js and dependencies: ", URITemplate._cache ? 'loaded' : 'failed');
});
相关链接