一个非常健全的 Javascript 链接(URL)解析类

用 Javascript 解析链接(URL)是一个常见的需求，本文介绍了一个非常健全的用 Javascript 写的链接(URL)解析类，他可以准确获取一个完整的 URL 中每个部分的内容，包括协议、URL中包含的用户名和密码、主机名、端口、路径名、参数、锚点(Fragment Anchor)等信息。

其实他的方法就是常见的正则匹配，但是整个实现写的很精巧，非常值得 javascript 新手研究。

一个非常健全的 Javascript 链接(URL)解析类 – 示例

 
<script type="text/javascript">
 
// 说明：一个非常健全的 Javascript 链接(URL)解析类
// 整理：http://www.CodeBit.cn
 
/** 
* @projectDescription 	Poly9's polyvalent URLParser class
*
* @author	Denis Laprise - denis@poly9.com - http://poly9.com
* @version	0.1 
* @namespace	Poly9
*
* See the unit test file for more examples.
* URLParser is freely distributable under the terms of an MIT-style license.
*/
 
if (typeof Poly9 == 'undefined')
{
	var Poly9 = {};
}
 
/**
 * Creates an URLParser instance
 *
 * @classDescription	Creates an URLParser instance
 * @return {Object}	return an URLParser object
 * @param {String} url	The url to parse
 * @constructor
 * @exception {String}  Throws an exception if the specified url is invalid
 */
Poly9.URLParser = function(url) {
 
	this._fields = {
		'Username' : 4, 
		'Password' : 5, 
		'Port' : 7, 
		'Protocol' : 2, 
		'Host' : 6, 
		'Pathname' : 8, 
		'URL' : 0, 
		'Querystring' : 9, 
		'Fragment' : 10
	};
 
	this._values = {};
	this._regex = null;
	this.version = 0.1;
	this._regex = /^((w+)://)?((w+):?(w+)?@)?([^/?:]+):?(d+)?(/?[^?#]+)???([^#]+)?#?(w*)/;
 
	for(var f in this._fields)
	{
		this['get' + f] = this._makeGetter(f);
	}
 
	if (typeof url != 'undefined')
	{
		this._parse(url);
	}
}
 
/**
 * @method 
 * @param {String} url	The url to parse
 * @exception {String} 	Throws an exception if the specified url is invalid
 */
Poly9.URLParser.prototype.setURL = function(url) {
	this._parse(url);
}
 
Poly9.URLParser.prototype._initValues = function() {
	for(var f in this._fields)
	{
		this._values[f] = '';
	}
}
 
Poly9.URLParser.prototype._parse = function(url) {
	this._initValues();
	var r = this._regex.exec(url);
	if (!r) throw "DPURLParser::_parse -> Invalid URL";
 
	for(var f in this._fields) if (typeof r[this._fields[f]] != 'undefined')
	{
		this._values[f] = r[this._fields[f]];
	}
}
 
Poly9.URLParser.prototype._makeGetter = function(field) {
	return function() {
		return this._values[field];
	}
}
 
</script>

示例代码：

 
<script type="text/javascript">
 
var url = 'http://user:password@www.codebit.cn:9901/pub/article.php?offset=10&perpage=10#fragment';
 
var p = new Poly9.URLParser(url);
 
document.write("<strong>URL:</strong> " + url + "<br /><br />");
document.write("解析结果如下：<br /><br />");
document.write("<strong>Protocol:</strong> " + p.getProtocol() + "<br />");
document.write("<strong>Username:</strong> " + p.getUsername() + "<br />");
document.write("<strong>Password:</strong> " + p.getPassword() + "<br />");
document.write("<strong>Host:</strong> " + p.getHost() + "<br />");
document.write("<strong>Port:</strong> " + p.getPort() + "<br />");
document.write("<strong>Pathname:</strong> " + p.getPathname() + "<br />");
document.write("<strong>Query String:</strong> " + p.getQuerystring() + "<br />");
document.write("<strong>Fragment:</strong> " + p.getFragment() + "<br />");
 
</script>