javascript中的location用法简单介绍


Posted in Javascript onMarch 07, 2007

先前写了一片用window.location.href实现刷新另个框架页面 ,特此我看了一下locaiton的详细用法,对此有点改进,现在我将他整理成js,方便查阅,也贴上和朋友们分享一下,具体如下:

第一、简单介绍一下location属性、用法以及相关示例:
Location
包含了关于当前 URL 的信息。

描述
location 对象描述了与一个给定的 Window 对象关联的完整 URL。location 对象的每个属性都描述了 URL 的不同特性。
通常情况下,一个 URL 会有下面的格式:

协议//主机:端口/路径名称#哈希标识?搜索条件 例如:

http://skylaugh.cnblogs.com/index.html#topic1?x=7&y=2 这些部分是满足下列需求的:

“协议”是 URL 的起始部分,直到包含到第一个冒号。 
“主机”描述了主机和域名,或者一个网络主机的 IP 地址。
“端口”描述了服务器用于通讯的通讯端口。 
路径名称描述了 URL 的路径方面的信息。
“哈希标识”描述了 URL 中的锚名称,包括哈希掩码(#)。此属性只应用于 HTTP 的 URL。 
“搜索条件”描述了该 URL 中的任何查询信息,包括问号。此属性只应用于 HTTP 的 URL。“搜索条件”字符串包含变量和值的配对;每对之间由一个“&”连接。 

属性概览
hash: Specifies an anchor name in the URL. 
host: Specifies the host and domain name, or IP address, of a network host.  
hostname: Specifies the host:port portion of the URL.  
href: Specifies the entire URL.  
pathname: Specifies the URL-path portion of the URL.  
port: Specifies the communications port that the server uses.  
protocol: Specifies the beginning of the URL, including the colon.  
search: Specifies a query. 

方法概览
reload Forces a reload of the window's current document.  
replace Loads the specified URL over the current history entry.  

主要功能示例,其他类同:
hash:

newWindow.location.href = http://skylaugh.cnblogs.com
newWindow.location.hash = #59831 

host
A string specifying the server name, subdomain, and domain name.
newWindow.location.href =   http://skylaugh.cnblogs.com
newWindow.location.host = skylaugh.cnblogs.com

href
A string specifying the entire URL.

window.location.href="http://home.netscape.com/"

pathname
A string specifying the URL-path portion of the URL.

search
A string beginning with a question mark that specifies any query information in the URL.

newWindow.location.href = http://skylaugh.cnblogs.com
newWindow.location.search = ?newsid=111 

二、location之页面跳转js如下:
//简单跳转
function gotoPage(url)
{
// eg. var url = "newsview.html?catalogid="+catalogID+"&pageid="+pageid;
window.location = url;
}
// 对location用法的升级,为单个页面传递参数
function goto_catalog(iCat)
{
if(iCat<=0)
{
top.location = "../index.aspx"; // top出去
}
else
{
window.location = "../newsCat.aspx?catid="+iCat;
}
}
// 对指定框架进行跳转页面,二种方法皆可用
function goto_iframe(url)
{
parent.mainFrame.location = "../index.aspx"; //
// parent.document.getElementById("mainFrame").src = "../index.aspx";// use dom to change page // 同时我增加了dom的写法
}
// 对指定框架进行跳转页面,因为 parent.iframename.location="../index.aspx"; 方法不能实行,主要是 "parent.iframename" 中的iframename在js中被默认为节点,而不能把传递过来的参数转换过来,所以用dom实现了该传递二个参数的框架跳转页面,希望那位仁兄不吝赐教!
function goto_iframe(iframename,url) 
{
parent.document.getElementById(iframename).src = "../index.aspx";// use dom to change page by iframeName

//}
// 回到首页
function gohome()
{
top.location = "/index.aspx";
}
</script>

Javascript 相关文章推荐
兼容ie和firefox js关闭代码
Dec 11 Javascript
js使用函数绑定技术改变事件处理程序的作用域
Dec 26 Javascript
深入理解JavaScript系列(16) 闭包(Closures)
Apr 12 Javascript
javascript的offset、client、scroll使用方法详解
Dec 25 Javascript
用js实现小球的自由移动代码
Apr 22 Javascript
Javascript玩转继承(三)
May 08 Javascript
两种JavaScript的AES加密方式(可与Java相互加解密)
Aug 02 Javascript
Javascript中函数名.length属性用法分析(对比arguments.length)
Sep 16 Javascript
详细总结Javascript中的焦点管理
Sep 17 Javascript
layui树形菜单动态遍历的例子
Sep 23 Javascript
2020淘宝618理想生活列车自动领喵币js脚本的代码
Jun 02 Javascript
通过angular CDK实现页面元素拖放的步骤详解
Jul 01 Javascript
JsEasy简介 JsEasy是什么?与下载
Mar 07 #Javascript
动态控制Table的js代码
Mar 07 #Javascript
js+FSO遍历文件夹下文件并显示
Mar 07 #Javascript
学习js所必须要知道的一些
Mar 07 #Javascript
修改发贴的编辑功能
Mar 07 #Javascript
Javascript之文件操作
Mar 07 #Javascript
得到文本框选中的文字,动态插入文字的js代码
Mar 07 #Javascript
You might like
PHP读写文件的方法(生成HTML)
2006/11/27 PHP
浅析js预加载/延迟加载
2014/09/25 Javascript
jQuery获取页面元素绝对与相对位置的方法
2015/06/10 Javascript
怎么限制input的text里输入的值只能是数字(正则、js)
2016/05/16 Javascript
canvas实现手机端用来上传用户头像的代码
2016/10/20 Javascript
JavaScript实现星星等级评价功能
2017/03/22 Javascript
JS实现汉字与Unicode码相互转换的方法详解
2017/04/28 Javascript
基于ajax和jsonp的原生封装(实例)
2017/10/16 Javascript
vue axios 表单提交上传图片的实例
2018/03/16 Javascript
Node.Js中实现端口重用原理详解
2018/05/03 Javascript
详解vue2.0 资源文件assets和static的区别
2018/11/27 Javascript
vue基础之模板和过滤器用法实例分析
2019/03/12 Javascript
vue项目移动端实现ip输入框问题
2019/03/19 Javascript
vue实现多组关键词对应高亮显示功能
2019/07/25 Javascript
Javascript异步编程async实现过程详解
2020/04/02 Javascript
详解JavaScript匿名函数和闭包
2020/07/10 Javascript
解决vue+elementui项目打包后样式变化问题
2020/08/03 Javascript
[03:40]DOTA2抗疫特别篇《英雄年代》
2020/02/28 DOTA
python模拟登录百度贴吧(百度贴吧登录)实例
2013/12/18 Python
Python中正则表达式的详细教程
2015/04/30 Python
TensorFlow实现卷积神经网络CNN
2018/03/09 Python
PyQt5实现暗黑风格的计时器
2019/07/29 Python
详解java调用python的几种用法(看这篇就够了)
2020/12/10 Python
"序列点" 是什么
2016/07/29 面试题
当x.equals(y)等于true时,x.hashCode()与y.hashCode()可以不相等,这句话对不对
2015/05/02 面试题
教育基金募捐倡议书
2014/05/14 职场文书
超市七夕促销活动方案
2014/08/28 职场文书
民政局个人整改措施
2014/09/24 职场文书
党员“四风”问题批评与自我批评思想汇报
2014/10/06 职场文书
学生抄作业检讨书(2篇)
2014/10/17 职场文书
2014年资料员工作总结
2014/11/18 职场文书
干部个人考察材料
2014/12/24 职场文书
银行求职信模板
2015/03/20 职场文书
培养联系人考察意见
2015/06/01 职场文书
vue代码分块和懒加载非必要资源文件
2022/04/11 Vue.js
修改Nginx配置返回指定content-type的方法
2022/09/23 Servers