Js之Location对象
Window对象的location属性引用的是Location对象,它表示该窗口中当前显示的文档的URL,并定义了方法来使窗口载入新的文档。Document对象的location属性也引用到Location对象:window.location === document.location 返回true
Document对象也有一个URL属性,是文档首次载入后保存该文档的URL的静态字符串。如果定位到文档中的片段标识符(如#table-of-c ontents),Location对象会做相应的更新,而document.URL属性却不会改变。
Window对象的location属性引用的是Location对象,它表示该窗口中当前显示的文档的URL。Location对象的href属性是一个字符串,后者包含URL的完整文本。Location对象的toString()方法返回href属性的值,因此在会隐式调用toString()的情况下,可以使
用location代替location.href。这个对象的其他属性-protocol,host,hostname,port,pathname和search,分别表示URL的各个部分。它们称为“URL分解”属性,同时被Link对象(通过HTML文档中的<a>和<area>元素创建)支持。
- location.hostname 返回 web 主机的域名
- location.pathname 返回当前页面的路径和文件名
- location.port 返回 web 主机的端口 (80 或 443)
- location.protocol 返回所使用的 web 协议(http:// 或 https://)
- location.href 属性返回当前页面的 URL。
- location.assign() 方法加载新的文档。
Location对象的hash和search属性比较有趣。如果有的话,hash属性返回URL中的“片段标识符”部分。search属性也类似,它返回的是问号之后的URL,这部分通常是某种类型的查询字符串。一般来说,这部分内容是用来参数化URL并在其中嵌入参数的。
虽然这些参数通常用于运行在服务器上的脚本,但在启用JavaScript的页面中当然也可以使用它们。
例14-2:提取URL的搜索字符串中的参数
/率
十这个函数用来解析来自URL的查询串中的name=value参数对
+它将name=value对存储在一个对象的属性中,并返回该对象
+这样来使用它
+ var args=urlArgs();//从URL中解析参数
+ var q=args.q || ””;//如果参数定义了的话就使用参数}否则使用一个默认值
+var n=args.n ? parselnt(args.n):1O,
+/
function urlArgs(){
var args={); //定义一个空对象
var query=location.search.substring(1); //查找到查询串,并去掉‘?’
var pairs=query.split(”&”); //根据”&”符号将查询字符串分隔开
for(var i:o;i<pairs.length; i++){ //对于每个片段
var pos=pairs[i].indexof(‘=’); /,查找”name=value”
if (pos==-i) continue; //如果没有找到的话,就跳过
var name=pairs[i].substring(o,pos), ll提取name
var value=pairs[i].substring(pos+1); ll提取value
value=decodeURIComponent(value); //对value进行解码
args[name]=value; //存储为属性
)
return args; //返回解析后的参数
)
Location对象的assign()方法可以使窗口载入并显示你指定的URL中的文档。replace()方法也类似,但它在载入新文档之前会从浏览历史中把当前文档删除。如果脚本无条件地载入一个新文档,replace()方法可能是比assgin()方法更好的选择。否则, “后退”
按钮会把浏览器带回到原始文档,而相同的脚本则会再次载入新文档。如果检测到用户的浏览器不支持某些特性来显示功能齐全的版本,可以用location.replace()来载入静态的HTML版本。
//如果洳览器不支持XMLHttpRequest对象
//则将其置定向到一个不需要Ajax的静态页面
if (IXMLHttpRequest) location.replace(”staticpage.html”);
注意,在这个例子中传人replace()的是一个相对URL。相对URL是相对于当前页面所在的目录来解析的,就像将它们用于一个超链接中。除了assgin()和replace0方法,Location对象还定义了reload()方法,后者可以让浏览器重新载入当前文档。
使浏览器跳转到新页面的一种更传统的方法是直接把新的URL赋给location属性:
location=“http://www.oreilly.com”;//在此网站购买书!
还可以把相对URL赋给location,它们会相对当前URL进行解析:
location=”page2.html”; //载入下一个页面
纯粹的片段标识符是相对URL的一种类型,它不会让浏览器载入新文档,但只会使它滚动到文档的某个位置。#top标识符是个特殊的例子:如果文档中没有元素的ID是“top”,它会让浏览器跳到文档开始处。
location=“#top”; //跳转到文档的顶部
Location对象的URL分解属性是可写的,对它们重新赋值会改变URL的位置,并且导致浏览器载入一个新的文档(如果改变的是hash属性,则在当前文档中进行跳转):
location.search = ”?page=”+(pagenum+i);//载入下一个页面
Js之Location对象的更多相关文章
- js的location对象
js的location对象 location基础知识 BOM(浏览器对象模型)中最有用的对象之一就是location,它是window对象和document对象的属性.location对象表示载入窗口 ...
- 5月15日上课笔记-js中 location对象的属性、document对象、js内置对象、Date事件对象、
location的属性: host: 返回当前主机名和端口号 定时函数: setTimeout( ) setInterval() 二.document对象 getElementById(); 根据ID ...
- js 的Location对象
Location对象 location用于获取或设置窗体的URL,并且可以用于解析URL. 语法: location.[属性|方法] location对象属性图示: location 对象属性: ha ...
- JS浏览器对象:window对象、History、Location对象、Screen对象
一.JS浏览器对象-window 1.window对象 window对象是BOM的核心,window对象指当前的浏览器窗口 所有JavaScript全局对象.函数以及变量均自动成为window对象的成 ...
- 【2017-03-28】JS基础、windows对象、history对象、location对象
一.JS基础 JS - javaScript 1.js功能: 1).进行数据的运算.2).控制浏览器的一些功能.3).控制元素(属性.内容.样式) js引用位置: 可以放在html页的任意位置. 推荐 ...
- js location对象
location提供了与当前窗口中加载文档有关的信息.还提供了一些导航功能.它既是window对象的属性,又是document对象的属性,window.location与document.locati ...
- JS BOM对象 History对象 Location对象
一.BOM对象 BOM(浏览器对象模型),可以对浏览器窗口进行访问和操作 window对象 所有浏览器都支持 window 对象. 概念上讲.一个html文档对应一个window对象. 功能上讲: 控 ...
- js location对象相关命令
Location.href 返回整个当前url,若对其赋值:location.href="http://www.sina.com.cn"则跳转其urllocation.host 返 ...
- JS window对象 Location对象 location用于获取或设置窗体的URL,并且可以用于解析URL。 语法: location.[属性|方法]
Location对象 location用于获取或设置窗体的URL,并且可以用于解析URL. 语法: location.[属性|方法] location对象属性图示: location 对象属性: lo ...
随机推荐
- worklight 中添加时间控件
在我们使用worklight开发的过程中,由于文档的不开源和插件的缺少,总是自己琢磨很多东东,更有胜者 需要调用源代码实现某些不易实现的功能.在这里把实现的功能代码贴出来,如有不足之处还望指正! 实现 ...
- 从运行原理及使用场景看Apache和Nginx
用正确的工具,做正确的事情. 本文只作为了解Apache和Nginx知识的一个梳理,想详细了解的请阅读文末参考链接中的博文. Web服务器 Web服务器也称为WWW(WORLD WIDE WEB)服务 ...
- php代码-1
- CSS实现背景透明/半透明效果的方法
全透明代码:{background:transparent} 半透明代码:{filter:alpha(opacity=80);-moz-opacity:0.8;width:auto !importan ...
- JS 多种变量定义
对象直接量创建一个对象: var obj = {x:[1,2],y:23}; 代码跟下面是一样的. var obj=new Object(); obj.x=new Array(1,2); obj. ...
- Scala学习笔记--函数式编程
一.定义 简单说,"函数式编程"是一种"编程范式"(programming paradigm),也就是如何编写程序的方法论. 它属于"结构化编程&qu ...
- Linux - Reset a MySQL root password
Use the following steps to reset a MySQL root password by using the command line interface. Stop the ...
- Spring Data JPA之Hello World
Spring Data Jpa 配置 使用 Spring Data JPA 进行持久层开发需要的四个步骤: 1.配置 Spring 整合 JPA 2.在 Spring 配置文件中配置 Spring D ...
- jQuery对象转换为DOM对象
第一种方法:借助数组下标来读取jQuery对象集合中的某个DOM元素对象. <script src="Scripts/jquery-1.4.1.js" type=" ...
- 《Programming WPF》翻译 第9章 6.我们进行到哪里了?
原文:<Programming WPF>翻译 第9章 6.我们进行到哪里了? 只有当任何内嵌控件都没有提供你需要的底层行为时,你将要写一个自定义控件.当你写一个自定义控件,你将要使用到依赖 ...