`
hugang357
  • 浏览: 187454 次
  • 性别: Icon_minigender_2
  • 来自: 深圳
社区版块
存档分类
最新评论

window.location.hash解析

    博客分类:
  • js
 
阅读更多
location是javascript里边管理地址栏的内置对象,比如location.href就管理页面的url,用location.href=url就可以直接将页面重定向url。而location.hash则可以用来获取或设置页面的标签值。比如http://domain/#admin的location.hash="#admin"。利用这个属性值可以做一个非常有意义的事情。

很多人都喜欢收藏网页,以便于以后的浏览。不过对于Ajax页面来说的话,一般用一个页面来处理所有的事务,也就是说,如果你浏览到一个Ajax页面里边有意思的内容,想将它收藏起来,可是地址只有一个呀,下次你打开这个地址,还是得像以往一样不断地去点击网页,找到你钟情的那个页面。另外的话,浏览器上的“前进”“后退”按钮也会失效,这于很多习惯了传统页面的用户来说,是一个很大的使用障碍。

那么,怎么用location.hash来解决这两个问题呢?其实一点也不神秘。

比如,我的作者管理系统,主要功能有三个:普通搜索、高级搜索、后台管理,我分别给它们分配一个hash值:#search、#advsearch、#admin,在页面初始化的时候,通过window.location.hash来判断用户需要访问的页面,然后通过javascript来调整显示页面。比如:

var hash;
hash=(!window.location.hash)?"#search":window.location.hash;
window.location.hash=hash;
  //调整地址栏地址,使前进、后退按钮能使用
switch(hash){  
case "#search": 
    selectPanel("pnlSearch");   //显示普通搜索面板 
    break;   
case "#advsearch":   
     
case "#admin": 
    
}
通过window.location.hash=hash这个语句来调整地址栏的地址,使得浏览器里边的“前进”、“后退”按钮能正常使用(实质上欺骗了浏览器)。然后再根据hash值的不同来显示不同的面板(用户可以收藏对应的面板了),这就使得Ajax页面的浏览趋于传统化了。
分享到:
评论

相关推荐

    javascrip获取url方式

    例如,通过`window.location.search`,我们可以解析出查询字符串中的参数,从而在页面加载时自动执行某些功能,或者根据参数的值动态修改页面内容。同样,`window.location.hash`常用于单页应用中实现平滑滚动至页面...

    JS 获取当前页面的URL

    8. `window.location.hash`:返回URL的哈希值,即`#`后面的部分,如`#hash`。 此外,`window.location`对象还提供了`assign()`、`reload()`和`replace()`等方法,用于导航到新的URL、刷新当前页面或替换历史记录中...

    小发现之浅谈location.search与location.hash的问题

    var r = window.location.search.substr(1).match(reg); if (r != null) return unescape(r[2]); return null; } // 调用方法 alert(GetQueryString("参数名1")); ``` 2. 字符串方式: ```javascript ...

    AS语言获取url参数的说明

    var hash:String = ExternalInterface.call("eval", "window.location.hash"); ``` 这段代码将返回片段标识符部分,例如`#love`。 #### 获取URL参数的实例 为了更好地理解如何处理查询字符串中的参数,下面提供了...

    js获取URL的信息

    var hash = window.location.hash; // 例如:#imhere // 注意,这里包括 # 号 ``` #### 四、解析 Query(查询参数) 除了以上提到的基本方法外,很多时候还需要进一步解析查询参数。这可以通过对 `search` ...

    (JS获取地址栏url所有信息的方法

    - `window.location.hash`:返回URL中的片段标识符。 - 示例:`#a1` #### 其他获取URL地址的方法 除了上述方法外,还可以通过以下方式获取当前页面的URL: - `document.URL`:返回当前文档的URL,与`window....

    [removed]和[removed]的区别分析

    8. **`window.location.hash`**:返回URL的片段标识符,即井号 "#" 后面的部分,通常用于页面内的锚点定位。 在实际应用中,`window.location` 的这些属性可以用于解析、修改和重定向URL。例如,如果你想在用户点击...

    js获取location.href的参数实例代码

    总的来说,JavaScript中的`location.href` 和 `window.location.search` 属性提供了方便的方式来访问和解析URL参数。理解这些概念以及如何使用它们,对于开发Web应用时处理URL数据至关重要。通过上面的实例代码,你...

    location.href用法总结(最主要的)

    `location.href`还可以与URL的其他部分结合使用,如`location.pathname`获取路径名,`location.search`获取查询字符串,`location.hash`获取URL的哈希部分,这些可以用于构建和解析URL,实现更复杂的页面操作。...

    [removed] 对象所包含的属性

    `window.location.hash`是URL的锚点部分,从井号 (`#`) 开始,常用于页面内部定位。例如`#anchor`。通过设置`hash`,可以实现页面内部的跳转,而无需重新加载整个页面。 在实际工作中,这些属性常常被用来处理页面...

    JavaScript获取URL汇总

    - 使用window.location.hash可以获取URL的片段标识符。例如:`var test = window.location.hash; alert(test);` 在获取URL组成部分时需要注意的是,如果URL没有明确指定某个部分,如端口或查询字符串,使用相应属性...

    网络游戏-使用JavaScript对在网络浏览器中的分层URI解除引用的机制.zip

    若想更改页面URL而不实际导航,可以设置`window.location.hash`来更新页面的片段标识符,这样可以实现锚点跳转。对于查询字符串的处理,JavaScript还提供了`URLSearchParams`接口,它允许我们方便地添加、删除和修改...

    js获取当前页的URL与[removed].href简单方法

    如果你想要获取URL的特定部分,如路径、查询参数或片段标识符,可以使用不同的属性,如`window.location.pathname`、`window.location.search`和`window.location.hash`。 然而,如果需要手动解析URL的不同部分,...

    微信小程序开发附源码:详解Vue开发微信H5微信分享签名失败问题解决方案.doc

    一种简单且实用的解决方案是在需要分享的页面中,放弃使用Vue的`router.push`进行跳转,而是改用`window.location.href`进行页面跳转。这种方法可以强制浏览器刷新URL,从而解决签名失败的问题。 在代码实现上,...

    js 实现iframe 之间传值

    总结,JavaScript提供了多种在`iframe`之间传递值的方法,包括`postMessage()`、`window.name`、`location.hash`、Web存储API以及`window.parent`和`window.frames`。选择哪种方法取决于具体的需求,如是否跨域、...

    一个非常全面的javascript URL解析函数和分段URL解析方法

    8. window.location.hash - 返回URL中的锚点部分,以井号(#)开头。 这些属性和方法可以在大多数现代浏览器中使用,从而获取或解析当前页面的URL。 总结而言,本文所提到的自定义JavaScript URL解析函数和...

    BOM知识点汇总

    - **URL操作**:`location.href`获取或设置整个URL,`location.pathname`获取路径名,`location.search`获取查询字符串,`location.hash`获取URL的锚点部分。 - **导航**:`location.reload()`刷新页面,`location...

    Javascript解析URL方法详解

    window.location.host返回主机部分,window.location.port返回端口号,window.location.pathname返回路径部分,window.location.search返回查询部分,而window.location.hash返回fragment部分。 接下来,我们介绍两...

Global site tag (gtag.js) - Google Analytics