专栏首页web前端教室javascript-购物车(1)

javascript-购物车(1)

这是之前文章提到过的JS购物车,当时简单的介绍了下它的思路和结构。

然后有同学发信息说,看的不太明白,最好能有代码,,

于是就录了这个视频教程,主要就是介绍它的开发过程,

这个JS购物车说简单也不难,大概思路几句话就介绍完了,

但要细说,,其实它也是满复杂的,,

一是用window.onhashchange事件来监听页面链接的变化,

二是用localStorage来存储数据,

三是用switch来实现了一个简单的页面路由。。

四是整个应用只有一个html文件,就是index.html,它也是一个页面的容器。

所有的页面都是做为它的子节点,通过load事件来加载进页面中来的,实际就是单页应用了。

其实这个购物车就是一个应用了hash事件的,mvc结构的H5单页应用。

第一节视频教程内容只是简单的介绍了它的功能、需求和大概的思路,并没有深入讲解代码及开发过程。

在以后的视频教程中,将带领大家一步步的实现它,明后天我把代码整理下放个DEMO上来,让大家可以在手机上试试看。。

下面就是视频了,大家先看看,有什么意见可以在评论中留言给我。

视频链接,请点此:

https://v.qq.com/iframe/player.html?vid=g0174l6dvqo&width=670&height=502.5&auto=0

本文分享自微信公众号 - web前端教室(webfeel),作者:老尚

原文出处及转载信息见文内详细说明,如有侵权,请联系 yunjia_community@tencent.com 删除。

原始发表时间:2015-11-25

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

我来说两句

0 条评论
登录 后参与评论

相关文章

  • WEB前端架构(四)

    今天是第三天,把购物车的基本功能算是都写完了。 这东西吧,思路想清楚之后,其实不难实现。 就是里面的逻辑交互很多,来来回回的,神烦啊,, 每一步每个操作都是对数...

    web前端教室
  • 你可以从面试中学到什么?

    讲一下我对面试的一些。。。“偏见”,哈哈,熟悉我的同学们一定要批判的读接下来的内容哈。

    web前端教室
  • 电话面试能成功,全靠开头3分钟

    前端开发到目前为止,依然是个新鲜岗位,大规模的需要前端开发的城市,估计也就是北上广了,但求职的同学们全国哪里都有,所以如果你也在找前端工作的话,很有可能会遇到电...

    web前端教室
  • 如何在 Kubernetes 环境中搭建 MySQL (二):在 cloud native 环境下配置 MySQL 的几个关键点

      MySQL 在 Kubernetes 环境中运行这件事情本身并不困难,最简单的方式就是找到 MySQL 的 Docker image,跑起来就行了,但是要做...

    用户2443625
  • ITIL 2011 -- 服务运营的5个流程简介 (上)

    要做一个IT运维管理的项目,客户提到了ITIL(IT Infrastructure Library),所以谈需求之前我研究了一下ITIL,发现东西比较多,但是里...

    solenovex
  • Git命令记录

    試毅-思伟
  • 使用Java代码以multiple form的格式给ABAP Netweaver发送数据

    版权声明:本文为博主原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接和本声明。

    Jerry Wang
  • 使用Java代码向SAP ABAP Netweaver发送HTTP post请求

    Jerry Wang
  • java获取ip和地区 原

    wuweixiang
  • Saga分布式事务解决方案与实践

    我先介绍一下我自己,我叫姜宁,来自于华为开源研究中心,现在负责的是ServiceComb这个开源项目。ServiceComb这个项目已经进到Apache孵化,应...

    程序员小王

扫码关注云+社区

领取腾讯云代金券