Velocity.js初步
Js越来越强大了,超乎我的想象,以前JS仅仅只能通过ajax与后台交互,后来又有了Node.js,JS可以用于服务端,然后今天我又发现了JS的动态语言。明天呢?也许不少前端的小伙伴会说,慢些吧,慢些吧,太快的我承受不住。的确,我们每天的时间有限。单身的朋友忙着加班,有对象的朋友,每天除了工作之外,得花时间陪陪对象,有了孩子的朋友,每天还得花点时间陪陪孩子。学习的时间哪会有这么多呢?虽然不少人说,可以利用地铁的时间、午休的时间学习,但是真到那个时候不一定有人一定能沉得下心去学习。
所以我们对于学习,就必须有选择性,这个选择性就是你自己的职业定位,你觉得那些比较适合你,同时你很感兴趣的。当然了,工作中学习也很重要。
一、介绍
源码地址: https://github.com/shepherdwind/velocity.js
velocity.js是velocity模板语法的javascript实现。
特征:
- 支持客户端和服务器端使用
- 语法分析和模板渲染分离
- 基本完全支持velocity语法
- Vim Syntax
浏览器兼容性:
兼容支持es5的浏览器,可以通过测试来验证test case。
对于低端浏览器需要实现以下方法
- Array.prototype的map, forEach, some, filter, every, indexOf
- Date.now
- Object.keys
二、 安装
npm install velocityjs或者cnpm install velocityjs
二、 使用
git clone https://github.com/shepherdwind/velocity.js.git
cd velocity.js
cd examples
运行对应的index.html即可
index.html内容,可以在克隆下的代码库中找到。
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Velocity Test</title>
</head>
<body> <script id="tmpl" type="text/tmplate">
#foreach($item in $items)
$item.a
#end
</script> hello world
<div class="foo"></div>
<script src="bundle.js"></script>
</body>
</html>
运行结果如下:
Velocity.js初步的更多相关文章
- velocity.js用法整理1
velocity.js 此框架相对于JQ的运动算法, 有很大的优势. 例如,A和B两个元素,position:absolute; top:0; 现在让A元素用JQ的animate,B用velocit ...
- JQuery动画插件Velocity.js发布:更快的动画切换速度
5月3日,Julian在其GitHub上发布了Velocity.js.Velocity.js是一款动画切换的jQuery插件,它重新实现了jQuery的$.animate()方法从而加快动画切换的速度 ...
- Velocity.js发布:更快的动画切换速度
Velocity.js是一款动画切换的jQuery插件,它重新实现了jQuery的$.animate()方法从而加快动画切换的速度.Velocity.js只有7k的大小,它不仅包含了$.animate ...
- javascript动画:velocity.js学习
第二章:基础知识 一.velocity和jQuery: Velocity函数是独立于jQuery的,但两者可以结合使用.通常这么做的好处是可以利用jQuery的链式操作:当你先用jQuery选择了一个 ...
- Velocity.js的使用
前面的话 Velocity是一款优秀的JS动画库,完全可以作为jQuery的animate的替代品.需要动画功能时,使用Velocity是一个好选择.本文将详细介绍Velocity.js的使用 概述 ...
- jQuery动画切换引擎插件Velocity.js
Velocity.js 官网 Velocity.js实现弹出式相框 慕课网 极棒的jquery动画切换引擎插件Velocity.js jQ库 (function($){ // 普通调用 /*$('#d ...
- Velocity.js初识
Velocity.js官网:http://julian.com/research/velocity/ 兼容IE8和Android2.3 Velocity.js基本用法 效果图: CSS .box{ w ...
- velocity.js 动画插件
1. velocity.js 插件介绍 Velocity 是独立于jQuery的,但两者可以结合使用的动画插件.用法类似 jq 的 animate ,但是支持更高级动画. ( 颜色动画.转换动画(tr ...
- vue中使用js动画与velocity.js
一:vue中使用js动画 根据上一篇安装animate.css之后 vue中有动画的钩子函数,@before-enter是内容由无到有的时候自动监听触发的函数,函数会接收到参数el,这样可以动态设置样 ...
随机推荐
- es7新增的2个特性
- Linux常用基本命令(chmod)
chmod命令用来改变文件或者目录的权限,只有文件的属主和超级用户才能够执行这个命令 格式: chmod [option] [mode] [file] >常用参数选项 -R : 递归修改目录以及 ...
- 排序算法(5)--Selection Sorting--选择排序[2]--Heap Sort--堆排序
1.基本思想 具有n个元素的序列 (h1,h2,...,hn),当且仅当满足(hi>=h2i,hi>=2i+1)或(hi<=h2i,hi<=2i+1) (i=1,2,...,n ...
- org.springframework.beans.factory.xml.XmlBeanDefinitionStoreException Line 47 in
org.springframework.beans.factory.xml.XmlBeanDefinitionStoreException: Line 47 in XML document from ...
- 设定linux为多用户模式
1.显示系统已经安装的组件,和可以安装的组件: #yum grouplist 2.如果系统安装之初采用最小化安装,没有安装xwindow,那么先安装: #yum groupinstall " ...
- [Android] 锁定屏幕
最近玩的比较欢脱,欠了好多东西没写.今天先简单地补一篇简单的内容.就是最近涉及到一个锁定Android设备屏幕的设计,大概就是通过一个按钮或者服务消息,来控制设备界面完全锁定,不能点击任何东西.感觉上 ...
- [Android] 图片裁剪总结——自定义裁剪工具
上次弄完调用系统裁剪之后,我又试着做一个自定义的裁剪工具. 原文地址请保留http://www.cnblogs.com/rossoneri/p/3988405.html 老习惯,文章开始前还是先把我参 ...
- SpringBoot中redis的使用介绍
REmote DIctionary Server(Redis) 是一个由Salvatore Sanfilippo写的key-value存储系统. Redis是一个开源的使用ANSI C语言编写.遵守B ...
- 从零自学Java-4.使用字符串来交流
1.使用字符串来存储文本: 2.在程序中显示字符串: 3.在字符串中包含特殊的字符: 4.拼接字符串: 5.在字符串中包含变量: 6.比较字符串: 7.判断字符串的长度: 程序Credits:显示一部 ...
- SQL Server存储过程输入参数使用表值
转载自:http://blog.csdn.net/smithliu328/article/details/9996149 在2008之前如果我们想要将表作为输入参数传递给SQL Server存储过程使 ...