<!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. FD_SET 详解

    http://blog.csdn.net/stephen_yin/article/details/7441165

  2. Ioc(控制反转)、DI(依赖注入)

    一篇非常好的有关控制反转和依赖注入非常不错的文章,简单易通,与大家共同学习,这里只引用了一篇文章,还有很多相关的文章可以通过文章引用地址来看,相信大家看完理解的就比较深刻了 文章摘自:http://j ...

  3. HDU 4421 Bit Magic(2-sat）

    HDU 4421 Bit Magic pid=4421" target="_blank" style="">题目链接 题意:就依据题目,给定b数 ...

  4. C#中ArrayList类的使用

    ArrayList类 使用大小可按须要动态添加的数组实现IList接口 命名空间:System.Collections 程序集:mscorlib 语法: public class ArrayList: ...

  5. Linux 下 grep 命令常用方法简介

    1.从单个文件中搜索指定的字符串: $ grep "literal-string" filename 该命令会输出字符串在文件中所在行的内容,如果字符串没有空格,则可以不加双引号. ...

  6. 复杂可编程逻辑器件CPLD的基本结构

    复杂可编程逻辑器件CPLD的基本结构 文章出处:czhlcai 发布时间: 2008/12/08 | 6911 次阅读 专业薄膜开关打样工厂,12小时加急出货   1．基于乘积项的CPLD结构 CPL ...

  7. APACHE KYLIN™ 概览

    APACHE KYLIN™ 概览 Apache Kylin™是一个开源的分布式分析引擎,提供Hadoop之上的SQL查询接口及多维分析(OLAP)能力以支持超大规模数据,最初由eBay Inc. 开发 ...

  8. MD5摘要（Java实现）

    消息摘要算法又成散列算法,其核心在于散列函数的单向性.即通过散列函数可获得对应的散列值,但不可以通过散列值反推其原始信息.   消息摘要算法分为以下三大类:       MD(Message Dige ...

  9. 获取jsapi_ticket

    String accessTokenUrl = "https://api.weixin.qq.com/cgi-bin/token?grant_type=client_credential&a ...

  10. SlidingMenu——使用前的配置

    一: 首先下载lib:SlidingMenu.然后将起导入eclipse中,然后将其clean一下,重新生成R文件. 二: 因为SlidingMenu依赖ActionBarSherlock,所以需要下 ...