CODE 项目整体迁移至码云平台(https://gitee.com)公告
埋名中 / JSLite.io JavaScript

与jQuery有着类似的api,让web开发更迅速,下载执行更快、量级更轻,针对现代高级浏览器的JavaScript库。 推进前端开发标准对于攻城师来说,人人有责。

http://JSLite.io

javascript web开发 前端开发 jslite

项目最近一次提交:2 年多 前 cef2bf1cd

README.md

JSLite

   __     ______     __         __     ______   ______    
  /\ \   /\  ___\   /\ \       /\ \   /\__  _\ /\  ___\   
 _\_\ \  \ \___  \  \ \ \____  \ \ \  \/_/\ \/ \ \  __\   
/\_____\  \/\_____\  \ \_____\  \ \_\    \ \_\  \ \_____\ 
\/_____/   \/_____/   \/_____/   \/_/     \/_/   \/_____/ 

让web开发更迅速,下载执行更快、量级更轻,针对现代高级浏览器的JavaScript库。 推进前端开发标准对于攻城师来说,人人有责。

如有疑问欢迎到这些地方交流:

QQ交流群:397463673
segmentfault社区 | 官方网站 | 官方文档-更详细

  1. jQuery 的目标是兼容所有主流浏览器,这就意味着它的大量代码对移动端的浏览器是无用或者低效的。
  2. 而 JSLite 只针对先进浏览器(支持HTML5,CSS3)、移动端浏览器编写,使用js新方法实现jQuery API,因此体积更小、效率更高.
  3. 更重要的是,JSLite 的 API 完全仿照 jQuery ,所以学习成本也很低。
  4. JSLite与jQuery有着绝大部分类似的api,通用库只有5-10k,手机上每一kb都是钱。
  5. 让web开发更迅速,下载执行更快、量级更轻,针对现代高级浏览器的JavaScript库。 推进前端开发标准对于攻城师来说,人人有责。

100% compatibility with common browsers - 主要兼容的浏览器(100% 的兼容)

此兼容,是根据我使用的一些js方法函数的支持情况来判断的。设备过少,部分是根据developer.mozilla.org的方法函数兼容数据来判断的,下面的我们的主要兼容目标

Safari 6+ (Mac)
Chrome 30+ (Windows, Mac, Android, iOS, Linux, Chrome OS)
Firefox 24+ (Windows, Mac, Android, Linux, Firefox OS)
iOS 5+ Safari Android 2.3+ Browser
Internet Explorer 10+ (Windows, Windows Phone)

Installation - 安装

您需要在系统上安装 Node.js的。

#npm 下载到 node_modules
$ npm install jslite

#bower 下载到 bower_components
$ bower install jslite

#安装grunt依赖
$ npm install

#启动grunt自动压缩合并,进入开发模式.... 
#默认合并所有模块生成到一个build目录中
$ npm start

Test - 测试

测试需要在系统上安装 Node.js4.x 以上版本。

# 安装全局的 gulp
$ npm install gulp -g && npm install 

# 先生成新的 压缩版本的JSLite
$ gulp  

# 在命令行中 - 查看测试结果
# 进行单元测试
$ npm test 

# 在浏览器中查看 - 编写预览测试结果
# 打开 test/index.html

JSLite模块

JSLite 模块中的 src/ 目录的各个文件。

模块 默认加载 描述
JSLite 核心模块,包含大多数方法。
function 内部函数调用
polyfill - 支持桌面浏览器IE和移动端 Windows Phone 8。
form - 表单方法。
event - 事件处理。
ajax - 异步请求的方法,发起任意Ajax请求。

默认合并 polyfill function JSLite 。上面打 都为默认加载的核心模块。其它均可选择性加载。

# 运行下面任务请确认依赖是否安装 安装方法 `npm install`
# 模块选择合并,做一个自定义生成
# 默认不传环境变量全部合并
$ MODULES="polyfill event" gulp

# on Windows
c:\JSLite> SET MODULES=polyfill event
c:\JSLite> gulp

生成map文件

gulp map

传统方法

  1. 官网下载JSLite
  2. 页面Head标签内引用 JSLite.js
<script type="text/javascript" src="JSLite.js"></script>

Usage - 用法

$("#box") //⇒ 返回节点数组  //⇒ [<div>​…​</div>​]
$("<div></div>") //⇒ 生成div节点
//JSLite(func) 相当于ready
JSLite(function($){
    console.log("在节点加载完成之后执行")
})
//$(func) 相当于ready
$(function($){
    console.log("在节点加载完成之后执行")
})