需求
最简单的进度条实现方式:两个div嵌套,父层div背景填充底色,子层div背景填充高亮颜色,然后改变子层的宽度来表示进度条。
这次实现的效果稍微复杂一些,除了按宽度显示进度以外,还需要添加以下3个东西:
- 进度条需要有节点,节点的样式根据进度进行变化
- 当前节点上方需要配置图片,图片位置需要根据进度进行变化
- 当前节点上方需要配置文字,文字位置根据图片位置而变化
点击查看效果(略有修改,请把大圆球想象成图片)
http://runjs.cn/code/q7tnucdj
最简单的进度条实现方式:两个div嵌套,父层div背景填充底色,子层div背景填充高亮颜色,然后改变子层的宽度来表示进度条。
这次实现的效果稍微复杂一些,除了按宽度显示进度以外,还需要添加以下3个东西:
点击查看效果(略有修改,请把大圆球想象成图片)
http://runjs.cn/code/q7tnucdj
jquery算是最先了解的一个js库,算是一种工具库,提供了很多实用的工具函数,也为其它很多插件提供了开发基础,但是用了这么久,我看不出其中有什么核心的思想性的东西。
requirejs的核心思想用一个单词可以概括:AMD。它只做了一件事:模块化。而且这件事做得还挺好:通过简单的配置、调用方式,加速、优化了代码。结合我在项目中的一些使用经验,从以下几个方面总结了一下requirejs的特点。
经常在写代码的时候碰到这样的场景:页面初始化时显示loading页,同时启动多个ajax并发请求获取数据,当每个ajax请求返回时结束loading。
举个例子,一个下订单的页面,要查询常用地址信息、商品信息、地市信息…而这些请求都是异步的,希望等到所有数据加载完成后再允许用户操作。
要实现这个场景容易碰到的一个问题就是多并发怎么控制?下面是一些解决方法和思路:
Less write,less bug.
Don’t repeat it.
这是我写代码奉行的原则,而underscore.js很好地体现了上面两句话的精髓。
之前学习angular的时候了解到了同类型的类库有backbone,然后一看backbone的介绍顿时莫名其妙了:轻度依赖jquery,重度依赖underscore。jquery不是最流行的js类库么?竟然重度依赖个没听说过的underscore,打开underscore官网,介绍别具一格:
他解决了这个问题:“如果我面对一个空白的 HTML 页面,并希望立即开始工作,我需要什么?” 他弥补了 jQuery 没有实现的功能,同时又是 Backbone 必不可少的部分。
“弥补了”、“必不可少”这牛皮吹得有点过了吧,于是了解使用了一下,发现确实是个好工具,于是把常用的几个函数做了一下整理。
编写一个 HTTP 服务器,每当接收到一个路径为 ‘/api/parsetime’ 的 GET 请求的时候,响应一些 JSON 数据。我们期望请求会包含一个查询参数(query string),key 是 “iso ,值是 ISO 格式的时间。
如:
/api/parsetime?iso=2013-08-10T12:10:15.474Z
所响应的 JSON 应该只包含三个属性:’hour’,’minute’ 和 ‘second’。例如:
{
"hour": 14,
"minute": 23,
"second": 15
}
然后增再加一个接口,路径为 ‘/api/unixtime’,它可以接收相同的查询参数(query strng),但是它的返回会包含一个属性:’unixtime’,相应值是一个 UNIX 时间戳。例如:
{ "unixtime": 1376136615474 }
服务器需要监听第一个命令行参数所指定的端口。