前端开发JS框架之jQuery的基础知识分享

JavaScript010

前端开发JS框架之jQuery的基础知识分享,第1张

jQuery对象是通过jQuery包装DOM对象后产生的对象

注意:jQuery对象只能使用jQuery里的方法,DOM对象只能使用DOM对象的方法

基本选择器

层级选择器:

基本筛选器:

属性选择器:

表单筛选器:

筛选器方法:

jQuery的一些方法:

注意:对于标签上有的能够看到的属性和自定义属性用attr()方法

对于返回布尔值比如checkbox,radion,option这三个标签是否被选中,用prop方法

事件绑定方式:

注意:DOM定义的事件可以用 .on()方法来绑定事件,但是jQuery定义的事件就不可以

常用事件有:

移除事件:把on改成off,就是移除 .on()绑定的事件

阻止后续事件执行:事件函数中添加 return false(常用于阻止表单提交等)或者e.preventDefault()

阻止事件冒泡:添加e.stopPropagation()

利用父标签去捕获子标签的事件

推荐阅读:

前端开发框架之jQuery 和 Vue 的选择

前端开发之15个jQuery小技巧分享

前端开发之JQuery入门基础操作

前端开发框架jQuery的优势与基础知识分享

前端开发者的都知道3大框架:Angular,Vue,React。但是除了这三个框架以外的前端框架还有那些?下面具体介绍下前端都有哪些框架:一.前端UI框架1.bootstrap框架,它来自 Twitte,是目前最受欢迎的前端框架。具有简洁、直观的前端开发特点。2.EasyUI框架,EasyUI是一种基于jQuery、Angular.、Vue和React的用户界面插件集合。通过使用easyui不需要写很多代码,只需要通过编写一些简单HTML标记,就可以定义用户界面。二.前端框架1.Node.js框架。Node.js是一个事件驱动I/O服务端JavaScript环境,基于Google的V8引擎,V8引擎执行Javascript的速度非常快,性能非常好。2.Vue.js框架。 Vue.js是当下很火的一个JavaScript MVVM库,它是以数据驱动和组件化的思想构建的。相比于Angular.js,Vue.js提供了更加简洁、更易于理解的API。3.React框架。React 起源于 Facebook 的内部项目,用来架设 Instagram 的网站,是一个用于构建用户界面的 JAVASCRIPT 库。4.Angular.Js框架。angular.Js框架是一款优秀的前端JS框架,已经被用于Google的多款产品当中。AngularJS有着诸多特性,最为核心的是:MVC(Model–view–controller)、模块化、自动化双向数据绑定、语义化标签。

Yui-ext

基于Yahoo UI的扩展包yui-ext是具有cs风格的web用户界面组件,能实现复杂的Layou布局,界面效果可以和backbase比美,而且使用纯JavaScript代码开发。真正的可编辑的表格edit Grid,支持XML和Json数据类型。许多组件实现了对数据源的支持,如动态布局,动态加载Tree控件,动态拖拽效果等等。从1..0beta版开始同jQuery合作,推出基于jQuery的ext1.0,提供了更多有趣的功能。

优点:结构化,清晰明了,底层用到了jQuery的一些函数,使整合使用有了选择,最重要的一点是界面太 让人震撼了。

缺点:太过于复杂,整个界面的构造过于复杂。

Jquery

任何使用场景都适用;jQuery是一款同prototype一样优秀的js开发类库,特别是针对css和xpath的支持,使我们写JS变得更加方便。

优点:注重简洁和高效,js效果有yui-ext的选择,因为yui-ext重用了很多jquery的函数;

缺点:据说太嫩,历史不悠久。

Extjs 内部系统,后台系统,管理系统等,有很好的UI设计;

Dojo

功能是最为强大的JS框架,Dojo是一个用JavaScript编写的开源的DHTML工具箱。Dojo包括Ajax、browser、event、widget等跨浏览器API,包括了js本身的语言扩展,以及各个方面的工具类库,和比较完善的UI组件库。Dojo强大的地方在于界面和特效的封装,可以 让开发者快速构建一些兼容标准的界面。适合企业应用和产品开发;

优点:库相当完善,发展时间也比较长,得到sun和IBM的持。

缺点:文件体积比较大,200多kb,JS语法增强方面不如prototype。

Prototype

最成熟的框架;定义了JS的面向对象扩展,Dom操作API,事件等等,以prototype为核心,形成一个外围的各种各样的JS扩展库;

优点:基本底层,易学易用,甚至是其他一些JS特效开发包的底层,体积算是最小的;

缺点:如果说缺点,可能就是功能是它的弱项;