hash值是啥,单页面应用的实质
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值是啥,单页面应用的实质的更多相关文章
- 利用hash或history实现单页面路由
目录 html代码 css代码 JavaScript代码 hash方式 history 方式 浏览器端代码 服务器端 在chrome(版本 70.0.3538.110)测试正常 编写涉及:css, h ...
- window.location.hash(hash应用)---跳转到hash值制定的具体页面
location是javascript里边管理地址栏的内置对象,比如location.href就管理页面的url,用location.href=url就可以直接将页面重定向url.而location. ...
- 单页面实现之hash
至学了angularJs后,发现这个单页面应用不知道在没有angularJs的情况下怎么实现. 所以就此对这个思考与资料并行,终于知道这个的实现基本原理. 首先angularJs的实现是hash值的变 ...
- 单页面SPA应用路由原理 history hash
<!DOCTYPE html> <html lang="zh"> <head> <meta charset="UTF-8&quo ...
- 每天记录一点:NetCore获得配置文件 appsettings.json vue-router页面传值及接收值 详解webpack + vue + node 打造单页面(入门篇) 30分钟手把手教你学webpack实战 vue.js+webpack模块管理及组件开发
每天记录一点:NetCore获得配置文件 appsettings.json 用NetCore做项目如果用EF ORM在网上有很多的配置连接字符串,读取以及使用方法 由于很多朋友用的其他ORM如S ...
- 快速构建H5单页面切换骨架
在Web App和Hybrid App横行的时代,为了拥有更好的用户体验,单页面应用顺势而生,单页面应用简称`SPA`,即Single Page Application,就是只有一个HTML页面的应用 ...
- IOS9.0中hash值的bug与解决方案
事件起因 事情是这样的:产品上线发布,突然出现了问题.运营Gg过来反应,当场给露珠演示,运营同事的手机是iphone,bug确实是存在的.奇怪的是露珠用了其他iphone手机(借别人的,露珠的是吊死安 ...
- 浅谈HTML5单页面架构(二)——backbone + requirejs + zepto + underscore
本文转载自:http://www.cnblogs.com/kenkofox/p/4648472.html 上一篇<浅谈HTML5单页面架构(一)--requirejs + angular + a ...
- 关于js单页面实现跳转原理以及利用angularjs框架路由实现单页面跳转
还记得我们刚开始学习html时使用的锚节点实现跳转吗? <a href="#target">我想跳转至目标位置</a> <p>第一条</p ...
随机推荐
- LoadRunner中的异常处理
在脚本的Run-time Settings中,可以设置在脚本运行过程中发生错误的处理方式.进入到Run-time Settings中,切换到Miscellaneous标签页,可以看到Error Han ...
- 【NLP】course
http://52opencourse.com/235/%E6%96%AF%E5%9D%A6%E7%A6%8F%E5%A4%A7%E5%AD%A6%E8%87%AA%E7%84%B6%E8%AF%AD ...
- hdu 2809(状压dp)
题目链接:http://acm.hdu.edu.cn/showproblem.php?pid=2809 思路:简单的状压dp,看代码会更明白. #include<iostream> #in ...
- ArcGIS GP应用-GP模型创建-缓冲区分析
一.参考资料 http://www.cnblogs.com/HPhone/archive/2012/11/05/2755974.html 二.关键步骤 1.缓冲分析数据源可以选择:点.面.线 2.构建 ...
- OSG简单测试框架
#include <osgDB/ReadFile> #include <osgDB/FileUtils> #include <osg/ArgumentParser> ...
- Securi-Pi:使用树莓派作为安全跳板
导读 像很多 LinuxJournal 的读者一样,我也过上了当今非常普遍的“科技游牧”生活,在网络之间,从一个接入点到另一个接入点,我们身处现实世界的不同地方却始终保持连接到互联网和日常使用的其它网 ...
- 二、Android Studio使用——导入jar包,运行、debug都不是问题
[新建AndroidStudio工程,lib导入jar包] 我们的项目代码都在app里面,可以看作是一个Model. src 下面除了我们的代码之外,还有单元测试. 把JAR复制到libs文件 ...
- 从远程(包括ftp,http等协议)地址获取文件流信息
URL url = new URL("ftp://172.18.251.155:8010/recordsImg/2019-01-28/000008_1548649813267.jpg&quo ...
- 170420、maven内置常量
Maven工程插件配置中通常会用到一些Maven变量,因此需要找个地方对这些变量进行统一定义,下面介绍如何定义自定义变量. 在根节点project下增加properties节点,所有自定义变量均可以定 ...
- windows下安装google protocbuf
首先安装setuptools: windows:======== 1.下载 ez_setup.py,安装setuptoolshttps://bitbucket.org/pypa/setuptools/ ...