1.什么hash

Location hash属性,http://www.runoob.com/jsref/prop-loc-hash.html,hash 属性是一个可读可写的字符串,该字符串是 URL 的锚部分(从 # 号开始的部分)。通俗地说,就是html中#号及#号后面的所有字符串。比如:file:///C:/Users/wulinzi/Desktop/test/index.html#??####????haha#123?234,console.info(window.location.hash);

//#??####????haha#123?234

Location对象:http://www.runoob.com/jsref/obj-location.html可以参考。

2.单页面应用实际上就是:利用hash值的改变(进行监听),一旦改变hash就切换单页面,利用壳儿load或ajax加载html页面及对应的js。

$( container ).load( router.view, function() {
container
.find( "script[type='amd']" )
.each( function() {
var module = this.src;
module = module.substr( module.indexOf( "src/modules" ) ).substr(4).replace( /\.js$/i, "" );
require( [ module ], function( module ) {
module( container.children() );
} );
} );
/**
* require( [ module ], function( module ) {
module( container.children() );
} );
* require( [ "modules/bindTip/index" ], function( func ) {
func( container.children() );
} );
*
* 单页js返回一整个方法,而且是define,所有这里可以require,并且可以立即执行。
*
*/
} );

加载:app.js里很多when()执行完----otherwise()----listen(监听window.onhashchange==dispatch)----dispatch(previous,current,window.hash)----run(ajax,load,js);一个页的加载结束。

切换页:path.where(”hash“,window.hash=hash)----监听到了改变onhashchange()----dispatch()----run().换页结束。

hash值是啥,单页面应用的实质的更多相关文章

  1. 利用hash或history实现单页面路由

    目录 html代码 css代码 JavaScript代码 hash方式 history 方式 浏览器端代码 服务器端 在chrome(版本 70.0.3538.110)测试正常 编写涉及:css, h ...

  2. window.location.hash(hash应用)---跳转到hash值制定的具体页面

    location是javascript里边管理地址栏的内置对象,比如location.href就管理页面的url,用location.href=url就可以直接将页面重定向url.而location. ...

  3. 单页面实现之hash

    至学了angularJs后,发现这个单页面应用不知道在没有angularJs的情况下怎么实现. 所以就此对这个思考与资料并行,终于知道这个的实现基本原理. 首先angularJs的实现是hash值的变 ...

  4. 单页面SPA应用路由原理 history hash

    <!DOCTYPE html> <html lang="zh"> <head> <meta charset="UTF-8&quo ...

  5. 每天记录一点:NetCore获得配置文件 appsettings.json vue-router页面传值及接收值 详解webpack + vue + node 打造单页面(入门篇) 30分钟手把手教你学webpack实战 vue.js+webpack模块管理及组件开发

    每天记录一点:NetCore获得配置文件 appsettings.json   用NetCore做项目如果用EF  ORM在网上有很多的配置连接字符串,读取以及使用方法 由于很多朋友用的其他ORM如S ...

  6. 快速构建H5单页面切换骨架

    在Web App和Hybrid App横行的时代,为了拥有更好的用户体验,单页面应用顺势而生,单页面应用简称`SPA`,即Single Page Application,就是只有一个HTML页面的应用 ...

  7. IOS9.0中hash值的bug与解决方案

    事件起因 事情是这样的:产品上线发布,突然出现了问题.运营Gg过来反应,当场给露珠演示,运营同事的手机是iphone,bug确实是存在的.奇怪的是露珠用了其他iphone手机(借别人的,露珠的是吊死安 ...

  8. 浅谈HTML5单页面架构(二)——backbone + requirejs + zepto + underscore

    本文转载自:http://www.cnblogs.com/kenkofox/p/4648472.html 上一篇<浅谈HTML5单页面架构(一)--requirejs + angular + a ...

  9. 关于js单页面实现跳转原理以及利用angularjs框架路由实现单页面跳转

    还记得我们刚开始学习html时使用的锚节点实现跳转吗? <a href="#target">我想跳转至目标位置</a> <p>第一条</p ...

随机推荐

  1. MySQL--执行mysql脚本及其脚本编写

    http://www.cnblogs.com/kex1n/archive/2010/03/26/2286504.html

  2. 自定义View中的Path

    我们用Path可以画返回图标,可以画搜索图标,也可以画一个圆,DIDI

  3. 【BZOJ3881】[Coci2015]Divljak fail树+树链的并

    [BZOJ3881][Coci2015]Divljak Description Alice有n个字符串S_1,S_2...S_n,Bob有一个字符串集合T,一开始集合是空的. 接下来会发生q个操作,操 ...

  4. android-修改TextView中部分文字的颜色

    :

  5. Vue.js_构造器及其实例化概念

    Vue构造器 1.Vue.js是一个构造函数,编程中称之为构造器 2.每一个new Vue() 都是一个Vue构造函数的实例,这个过程叫做实例化 3.构造函数需要将其实例化后才会启用 var vm = ...

  6. XML External Entity attack

    解析外部xml给本地带来的安全隐患. https://en.wikipedia.org/wiki/XML_external_entity_attack An XML External Entity ( ...

  7. 会议室预订系统 td 宽度 php 浏览器 兼容性

    w获取浏览器标识 <style> .w > td { <?php $wua=$_SERVER['HTTP_USER_AGENT']; if(strpos($wua, 'Chro ...

  8. navicat导入数据出现中文乱码

    1.问题描述: excel转为csv后,导入英文时没错.但中文就是显示的乱码. 2.解决方法: 将csv用记事本打开,调整编码格式为UTF-8, 点击保存覆盖掉原文件,然后再 导入,乱码问题就解决

  9. Spark源码分析 – Deploy

    参考, Spark源码分析之-deploy模块   Client Client在SparkDeploySchedulerBackend被start的时候, 被创建, 代表一个application和s ...

  10. 给input文本框添加灰色提示文字,三种方法.

    1.这个是HTML5的属性. h5的好简单.... placeholder="这里输入文字" 2.HTML的: value="你的提示文字" onFocus=& ...