<!doctype html>

<html lang="en">

<body>

    <a href="#/home">首页</a>

    <a href="#/course">课程</a>

    <div id="app"></div>

    <script>

        window.onhashchange = function(){

            console.log(location.hash);

            switch (location.hash) {

                case '#/home':

                    document.getElementById('app').innerHTML = '<h2>我是首页</h2>';

                    break;

                case '#/course':

                    document.getElementById('app').innerHTML = '<h2>我是课程</h2>';

                    break;

                default:

                    // statements_def

                    break;

            }

        }

    </script>

</body>

</html>

javascript实例:路由的跳转的更多相关文章

  1. Vue总结第五天：vue-router （使用模块化（创建Vue组件）机制编程）、router-link 标签的属性、路由代码跳转、懒加载、路由嵌套（子路由）、路由传递数据、导航守卫）

    Vue总结第五天:vue-router ✿ 路由(器)目录: □  vue中路由作用 □  vue-router基本使用 □  vue-router嵌套路由 □  vue-router参数传递 □  ...

  2. JavaScript实例

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xht ...

  3. 每天一个JavaScript实例-从一个div元素删除一个段落

    <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content ...

  4. 每天一个JavaScript实例-推断图片是否载入完毕

    <!doctype html> <html lang="en"> <head> <meta charset="utf-8&quo ...

  5. 每天一个JavaScript实例-动态省份选择城市

    <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content ...

  6. 每天一个JavaScript实例-递归实现反转数组字符串

    <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content ...

  7. 每天一个JavaScript实例-html5拖拽

    <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content ...

  8. 每天一个JavaScript实例-canvas绘图

    <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content ...

  9. 一些有用的javascript实例分析(三)

    原文:一些有用的javascript实例分析(三) 10 输入两个数字,比较大小 window.onload = function () { var aInput = document.getElem ...

随机推荐

  1. VS2017、netcore版本更新升级

    VS2017 剩下的就是下一步了. netcore 访问:https://www.microsoft.com/net/download/archives 找到对应版本(最新版本) 下载安装就可以了 装 ...

  2. svn:database disk image is malformed问题解决方法

    今天一客户使用我们软件时突然停电,再次启动软件查询SQLite数据库报 The database disk image is malformed 错误. 百度一下基本上全部是http://www.cn ...

  3. java 使用Date类、Calendar类，实现增加日期

    Date date= new Date(); System.out.println("Date date= new Date()中的date: "+date); 输出对象date: ...

  4. centos6.5下redis的安装与配置

    参照官网描述(https://redis.io/download),linux下redis安装步骤如下: $ wget http://download.redis.io/releases/redis- ...

  5. GitBlit （1）-- 在linux 安装 GitBlit 并运行

    Git是一款注重速度.数据完整性.分布式支持和非线性工作流的分布式版本控制工具.Git最初由Linus Torvalds在2005年为Linux内核开发而设计,如今已经成为被广泛接受的版本控制系统. ...

  6. mybatis like用法

    针对不同的数据库,like的用法是不一样的,现在具体来说一下 1,SQL SERVER SELECT * FROM user WHERE name like '%'+#{name}+'%' 2,Ora ...

  7. go的sync.Map

    sync.Map这个数据结构是线程安全的(基本类型Map结构体在并发读写时会panic严重错误),它填补了Map线程不安全的缺陷,不过最好只在需要的情况下使用.它一般用于并发模型中对同一类map结构体 ...

  8. (C#)System.Security.SecureString(表示应保密的文本)

    正常的String类型值,在脱离开作用域之后,其值在内存中并不会被立即销毁,这时如果有人恶意扫描你的内存,程序中所保存的机密信息就会暴露;于是就有了System.Security.SecureStri ...

  9. pip依赖安装与记录

    pip freeze requirements.txt是一个常常被许多Flask应用用于列出它所依赖的包的文本文件.它是通过pip freeze > requirements.txt生成的. 使 ...

  10. Editor编辑器的一些用法

    共有两个脚本,一个是有关Inspector面板的,一个是window的 using UnityEngine; using System.Collections; using UnityEditor; ...