一、URL:统一资源定位符
1、URL组成
完整的URL由这几个部分构成:
scheme://host:port/path?query#fragment
名词解释:
scheme:通信协议.常用的http,https,ftp,maito等.
host:主机(带端口号). 主机名或IP 地址。
port:端口号,可选,省略时使用默认端口,如http的默认端口为80。
path:路径:由零或多个"/"符号隔开的字符串,一般用来表示主机上的一个目录或文件地址。
query:查询参数,可选,用于给动态网页传递参数,可有多个参数,用"&"符号隔开,每个参数的名和值用"="符号隔开。
fragment:信息片断,字符串,用于指定网络资源中的片断。(也称为锚点.)
2、具体片段使用实例:
1、window.location.href
整个URl字符串(在浏览器中就是完整的地址栏)
返回值:http://www.home.com:8080/windows/location/page.html?ver=1.0&id=timlq#love
2、window.location.protocol
URL 的协议部分。
返回值:http:
3、window.location.host
URL 的主机部分(带端口号),
返回值:www.home.com:8080
window.location.hostname
返回值:www.home.com
4、window.location.port
URL 的端口部分。如果采用默认的80端口(update:即使添加了:80),那么返回值并不是默认的80而是空字符。
5、window.location.pathname
URL 的路径部分(就是文件地址)
返回值:/windows/location/page.html
6、window.location.search
查询(参数)部分。除了给动态语言赋值以外,我们同样可以给静态页面,并使用javascript来获得相信应的参数值
返回值:?ver=1.0&id=timlq
7、window.location.hash
锚点。返回值:#love
3、window.location的方法
1、location.assign(URL) 加载一个新的文档
2、location.reload(force) 重新加载当前文档。
说明:
如果该方法没有规定参数,或者参数是 false,它就会用 HTTP 头 If-Modified-Since 来检测服务器上的文档是否已改变。如果文档已改变,reload()会再次下载该文档。如果文档未改变,则该方法将从缓存中装载文档。这与用户单击浏览器的刷新按钮的效果是完全一样的。
如果把该方法的参数设置为 true,那么无论文档的最后修改日期是什么,它都会绕过缓存,从服务器上重新下载该文档。这与用户在单击浏览器的刷新按钮时按住 Shift 健的效果是完全一样。
3、location.replace(newURL) 用一个新文档取代当前文档
说明:
replace() 方法不会在 History 对象中生成一个新的记录。当使用该方法时,新的 URL 将覆盖 History 对象中的当前记录。
二、获取URL参数方法的封装
1、获取url参数数组
var url = "http://127.0.0.1/e/action/ShowInfo.php?classid=9&id=2";
/**
* @desc 获取url参数
* @param {String} _url url路径
*/
function parse_url(_url){
var pattern = /(\w+)=(\w+)/ig;
var parames = {};
url.replace(pattern, function(a, b, c){
parames[b] = c;
});
return parames;
}
var parames = parse_url(url);
2、输入参数名,输出参数值
/**
* @desc 获取url参数
* @param {String} name 想要获取的参数名字
*/
function GetQueryString(name){
var reg = new RegExp("(^|&)"+ name +"=([^&]*)(&|$)");
var r = window.location.search.substr(1).match(reg);
if(r!=null)return unescape(r[2]); return null;
}
// 调用方式
var objectId = GetQueryString("objectId")
/**
* @desc 获取url参数
* @param {String} url为穿过来的链接
* @param {String} id为参数名
*/
function GetParam(url, id) {
url = url+ "";
regstr = "/(\\?|\\&)" + id + "=([^\\&]+)/";
reg = eval(regstr);
//eval可以将 regstr字符串转换为 正则表达式
result = url.match(reg);
if (result && result[2]) {
return result[2];
}
}
// 调用方式
var objectId = GetQueryString(window.location.href,"objectId")
/**
* @desc 获取url参数
* @param {String} paramName 想要获取的参数名字
* @param {String} url 访问地址,可以为空:为空时默认为当前url
*/
function getParameter(paramName, url) {
var seachUrl = window.location.search.replace("?", "");
if (url != null) {
var index = url.indexOf('?');
url = url.substr(index + 1);
seachUrl = url;
}
var ss = seachUrl.split("&");
var paramNameStr = "";
var paramNameIndex = -1;
for (var i = 0; i < ss.length; i++) {
paramNameIndex = ss[i].indexOf("=");
paramNameStr = ss[i].substring(0, paramNameIndex);
if (paramNameStr == paramName) {
var returnValue = ss[i].substring(paramNameIndex + 1, ss[i].length);
if (typeof(returnValue) == "undefined") {
returnValue = "";
}
return returnValue;
}
}
return "";
}
// 调用方式
var objectId = getParameter("objectId")