JS(JavaScript)脚本库的积累
在现在互联网盛行的时代,使得B/S架构飞速发展。曾经在大学的时候我一直都梦想着毕业后要找一个像腾讯这样大企业做C/S方面的开发工作(其实现在腾讯也有很多B/S软件),因为C/S体验度非常高,感觉非常好。但是此时此刻,我却没有这样的想法了。这是为什么呢?对于有经验的软件工程师都很清楚,B/S的程序部署在服务器,客户端只需要浏览器即可使用,而C/S需要客户在终端安装客户端程序,所以B/S在维护和升级方面的简易性上,无疑有独有优势,而且对客户端的硬件要求相对于C/S软件一般都要低。B/S当然它也有它的弊病,就是客户端使用不同版本浏览器,显示结果会有所差异,这个其实就是浏览器的兼容性导致的,而C/S一般不存在。
现在随着经济水平的发展,对物质的要求越来越高,对互联网的体验度的也要求越来越高,所以网站设计体验越来越重要,它关系到产品的成败(产品的成败是指的客户是否接受,而不是产品可以正常运行)。一些中大型软件公司都有独立的UED部门,他们主要从事软件界面设计,小公司的话也有美工设计。其实对于一个网站前端设计,大致主要是四大技术HTML+CSS+IMAGE+JS(暂不谈论优化这一块的技术)。其中JS提高体验度的重中之重。因为JS是前端脚本,很多公司和工程师,为了方便开发,封装了很多JS库,供团队使用。其中互联网上有很多非常优秀开源JS库,都可以找到源码,示例和文档。一个网站如果用这些JS库就会加快项目开发速度,而且它们兼容性会更好,用户的体验度也会更高。我们通常可以使用JS库能帮助我们实现很多复杂的功能或者常用的功能,如:菜单树、弹窗、验证、文本编辑器、图表、日期等。
我们使用这些JS库的其实目的很简单,就是为了让他帮助实现自己想实现的部分功能。这里就需要考虑到了一些问题,如代码开源与否,是否还有团队维护,是否允许商用,同行使用率是否高等。以方便使用过程中遇到问题,可以得到维护团队的解决或自行解决。因为JS也是别人写的,它就是一个产品(开发团队可能公开源码却不允许商用。其中开源协议中有定义,可以百度找下),它就会存在bug。
我之所以废话这么多,其实就是想表述JS值得大家去学习和研究,网络上的资源很多。即使你是后台工程师,你学习它对工作会有非常大帮助。
下面我再来总结一下常用的JS脚本库,供大家学习参考。其实大多数的JS库都是基于jQuery
一、基本库
、jQuery
a、简介
JQuery是继prototype之后又一个优秀的Javascript库。它是轻量级的js库 ,它兼容CSS3,还兼容各种浏览器(IE 6.0+, FF 1.5+, Safari 2.0+, Opera 9.0+),jQuery2.0及后续版本将不再支持IE6/7/8浏览器。jQuery使用户能更方便地处理HTML(标准通用标记语言下的一个应用)、events、实现动画效果,并且方便地为网站提供AJAX交互。jQuery还有一个比较大的优势是,它的文档说明很全,而且各种应用也说得很详细,同时还有许多成熟的插件可供选择。jQuery能够使用户的html页面保持代码和html内容分离,也就是说,不用再在html里面插入一堆js来调用命令了,只需要定义id即可。
jQuery是一个兼容多浏览器的javascript库,核心理念是write less,do more(写得更少,做得更多)。jQuery在2006年1月由美国人John
Resig在纽约的barcamp发布,吸引了来自世界各地的众多JavaScript高手加入,由Dave Methvin率领团队进行开发。如今,jQuery已经成为最流行的javascript库,在世界前10000个访问最多的网站中,有超过55%在使用jQuery。jQuery是免费、开源的,使用MIT许可协议。jQuery的语法设计可以使开发者更加便捷,例如操作文档对象、选择DOM元素、制作动画效果、事件处理、使用Ajax以及其他功能。除此以外,jQuery提供API让开发者编写插件。其模块化的使用方式使开发者可以很轻松的开发出功能强大的静态或动态网页。
jQuery,顾名思议,也就是JavaScript和查询(Query),即是辅助JavaScript开发的库。
c、官方网站:http://jquery.com/
b、学习指南或文档
学习教程:http://www.w3school.com.cn/jquery/
在线API:http://www.css88.com/jqapi-1.9/
※注:jQuery2.*将不再支持IE6/7/8浏览器,如果你无法抛弃IE
6/7/8,那么你可以继续使用jQuery 1.*
二、常用JS库
、验证(jquery.validate)
a、简介
这个 jQuery 插件方便简单验证客户端表单,同时仍提供大量的自定义选项。如果您正在重新开始构建一些新的东西,但当想要的已有的东西(这里指的是JS脚本)融入现有的应用程序里,它使一个不错的选择。该插件捆绑了一组有用的验证方法,包括 URL 和电子邮件验证,同时提供一个 API 来让你您自己编写方法。所有验证方法可以默认错误提示消息语言是英语和已经翻译成的其他37语言。
b、官方网站:http://jqueryvalidation.org/
c、学习指南或文档:http://jqueryvalidation.org/documentation/
、弹窗(artDialog)
a、简介
artDialog是一个精巧的web对话框组件,压缩后只有十多KB,并且不依赖其他框架。
b、官方网站:http://jqueryvalidation.org/
c、学习指南或文档:http://jqueryvalidation.org/documentation/
、日期(My97日期控件)
a、简介
支持静态限制,动态限制,脚本自定义限制,以及无效天和无效日期功能,利用这样功能可以任意定制不能选择的日期,这些日期即使毫无规律,毫无连续性,也可以通过这些功能的组合使用轻松搞定。
b、官方网站:http://www.my97.net
c、学习指南或文档:见官网
、菜单树(zTree)
a、简介
zTree 是一个依靠 jQuery 实现的多功能 “树插件”。优异的性能、灵活的配置、多种功能的组合是 zTree 最大优点。专门适合项目开发,尤其是 树状菜单、树状数据的Web显示、权限管理等等。
b、官方网站: http://www.ztree.me
c、学习指南或文档: 见官网
、图表(ECharts)
a、简介
ECharts,缩写来自Enterprise Charts,商业级数据图表,一个纯Javascript的图表库,可以流畅的运行在PC和移动设备上,兼容当前绝大部分浏览器(IE6/7/8/9 /10/11,chrome,firefox,Safari等),底层依赖轻量级的Canvas类库ZRender,提供直观,生动,可交互,可高度个性化定制的数据可视化图表。创新的拖拽重计算、数据视图、值域漫游等特性大大增强了用户体验,赋予了用户对数据进行挖掘、整合的能力。
支持折线图(区域图)、柱状图(条状图)、散点图(气泡图)、K线图、饼图(环形图)、雷达图(填充雷达
图)、和弦图、力导向布局图、地图、仪表盘、漏斗图、事件河流图等12类图表,同时提供标题,详情气泡、图例、值域、数据区域、时间轴、工具箱等7个可交 互组件,支持多图表、组件的联动和混搭展现。b、官方网站:http://echarts.baidu.com
c、学习指南或文档: 见官网
、在线编辑器(KindEditor)
a、简介
KindEditor是一套开源的HTML可视化编辑器,主要用于让用户在网站上获得所见即所得编辑效果,兼容IE、Firefox、Chrome、Safari、Opera等主流浏览器。KindEditor使用JavaScript编写,可以无缝的于Java、.NET、PHP、ASP等程序接合。
b、官方网站:http://kindeditor.net
c、学习指南或文档: 见官网
三、WebUI
1、jQuery UI
a、简介
jQuery UI 是以 jQuery 为基础的开源 JavaScript 网页用户界面代码库。包含底层用户交互、动画、特效和可更换主题的可视控件。我们可以直接用它来构建具有很好交互性的web应用程序。所有插件测试能兼容IE 6.0+, Firefox 3+, Safari
3.1+, Opera 9.6+, 和GoogleChrome。b、官方网站:http://jqueryui.com/
c、学习指南或文档:
http://www.w3cschool.cc/jqueryui/jqueryui-intro.html2、EasyUI
a、简介
jQuery EasyUI是一组基于jQuery的UI插件集合体,而jQuery
EasyUI的目标就是帮助web开发者更轻松的打造出功能丰富并且美观的UI界面。开发者不需要编写复杂的javascript,也不需要对css样式 有深入的了解,开发者需要了解的只有一些简单的html标签。b、官方网站:http://www.jeasyui.com/
c、学习指南或文档:
http://www.w3cschool.cc/jeasyui/jqueryeasyui-tutorial.html
由于时间的关系有些JS库的资料还未整理好,等整理好后,再做更新。
JS(JavaScript)脚本库的积累的更多相关文章
- [Javascript] 40个轻量级JavaScript脚本库
诸如jQuery, MooTools, Prototype, Dojo和YUI等JavaScript脚本库,大家都已经很熟悉.但这些脚本库有利也有弊--比如说JavaScript文件过大的问题.有时你 ...
- React: React集成脚本库Fetch
一.简介 React功能虽然很强大,但是说到底它仍然只是一个简单的创建视图的脚本库,如果想要实现一些更为复杂的业务逻辑,我们还需要使用React搭配其他的脚本库协同工作,以提高应用程序的性能.其中,F ...
- 通用javascript脚本函数库
/* 名字:Common.js 功能:通用javascript脚本函数库 包括: 1.Trim(str)--去除字符串两边的空格 2.XMLEncode(str)--对字符串进行XML编码 3.Sho ...
- Vis.js – 基于浏览器的动态 JavaScript 可视化库
Vis.js 是一个动态的,基于浏览器的可视化库.该库被设计为易于使用,能处理大量的动态数据.该库由以下几部分组成:一是数据集和数据视图,基于灵活的键/值数据集,可以添加,更新和删除项目,订阅数据集变 ...
- 2018年你需要知道的13个JavaScript工具库
译者按: 你可能已经用到Underscore或者Lodash.本文列举了13个常用的JavaScript工具库来提高开发效率. 原文: 11 Javascript Utility Libraries ...
- 向 Web 开发人员推荐35款 JavaScript 图形图表库
图表是数据图形化的表示,通过形象的图表来展示数据,比如条形图,折线图,饼图等等.可视化图表可以帮助开发者更容易理解复杂的数据,提高生产的效率和 Web 应用和项目的可靠性. 在这篇文章中,我们收集了3 ...
- Javascript题库
一.填空题 JavaScript有两种引用数据类型 :__数组___.__对象__. Javascript通过__setTimeout___延迟指定时间后,去执行某程序. Javascript里Str ...
- 150个JS特效脚本
收集了其它一些不太方便归类的JS特效,共150个,供君查阅. 1. simplyScroll simplyScroll这个jQuery插件能够让任意一组元素产生滚动动画效果,可以是自动.手动滚动,水平 ...
- ABP+AdminLTE+Bootstrap Table权限管理系统第七节--登录逻辑及abp封装的Javascript函数库
经过前几节,我们已经解决数据库,模型,DTO,控制器和注入等问题.那么再来看一下登录逻辑.这里算是前面几节的一个初次试水. 首先我们数据库已经有的相应的数据. 模型和DTO已经建好,所以我们直接在服务 ...
随机推荐
- IOS--jenkins ,app,reengine
传统的对iOS逆向的工具要使用到下面很多: clutchotoolkeychain-dumpersqlitedumpdecryptedclass-dump-zTheos http://iosapp.m ...
- In MySQL, a zero number equals any string
最近在做项目的过程中发现了一个问题 数据库表 test 有个字段是 target_id int(11),这个字段可能为零 使用如下查询 select * from test where targe ...
- 如何删除word中多余的空格和空行
去除word中多余的空格及空行 一.去掉表格和格式 为了版面的整齐,网页文档都是以表格的形式存在的,只是一般情况下表格的颜色被设为无色或表格宽度被设为0,所以我们在网页上看不到表格.另外,网 页文档中 ...
- LightOj 1118 - Incredible Molecules(两圆的交集面积)
题目链接:http://lightoj.com/volume_showproblem.php?problem=1118 给你两个圆的半径和圆心,求交集的面积: 就是简单数学题,但是要注意acos得到的 ...
- HTML5 web 存储
简介: HTML5 web 存储,一个比cookie更好的本地存储方式. 首先我们先了解一下: 什么是 HTML5 Web 存储? 使用html5可以在本地存储用户的浏览数据. 早些时候,本地存储使用 ...
- 如何bitbucket上删除项目
老外网页操作习惯不同,删除项目的按钮,我花了半天,突然瞟到delete,如下图(真他妈的隐蔽,记住这2017/3/7):
- php表单身份验证
1. index.php <form method="post" action="dbtest.php"> 姓名: ...
- Python3学习之路~2.1 列表、元组操作
列表 列表是我们以后最常用的数据类型之一,通过列表可以对数据实现最方便的存储.修改等操作. 定义列表(list) names=['Amy','Bob','Cindy','David'] 通过下标访问列 ...
- 006-Redis 发布订阅
Redis 发布订阅(pub/sub)是一种消息通信模式:发送者(pub)发送消息,订阅者(sub)接收消息. Redis 客户端可以订阅任意数量的频道. 下图展示了频道 channel1 , 以及订 ...
- 使用tagName定位报错
使用标签进行定位元素,页面报错,由于input标签不唯一,webdriver默认会取第一个元素,但是第一个input元素的类型是‘hidden’,无法展示,因此程序就报错了 如何解决,未完待续...