Javaweb重要知识点总结(六)常见的前端框架

简介: Javaweb重要知识点总结(六)常见的前端框架

1. EasyUI


EasyUI 是一种基于 jQuery 的用户界面插件集合。easyui 为创建现代化,互动,JavaScript 应用程序,提供必要的功能。使用 easyui 你不需要写很多代码,你只需要通过编写一些简单 HTML 标记,就可以定义用户界面。优势:开源免费,页面也还说的过去。

2. MiniUI


基于 jquery 的框架,开发的界面功能都很丰富。jQuery MiniUI - 快速开发 WebUI。它能缩短开发时间,减少代码量,使开发者更专注于业务和服务端,轻松实现界面开发,带来绝佳的用户体验。使用 MiniUI,开发者可以快速创建 Ajax 无刷新、 B/S 快速录入数据、 CRUD、 Master-Detail、菜单工具栏、弹出面板、布局导航、数据验证、分页表格、树、树形表格等典型 WEB 应用系统界面。缺点:收费,没有源码,基于这个开发如果想对功能做扩展就需要找他们的团队进行升级!

提供以下几大类控件:

表格控件树形控件

布局控件:标题面板、弹出面板、折叠分割器、布局器、表单布局器等导航控件:分页导航器、导航菜单、选项卡、菜单、工具栏等。

表单控件:多选输入框、弹出选择框、文本输入框、数字输入框、日期选择框、下拉选择框、下拉树形选择框、下拉表格选择框、文件上传控件、多选框、列表框、多选框组、单选框组、按钮等

富文本编辑器

图表控件:柱状图、饼图、线形图、双轴图等。

技术亮点:

快速开发:使用 Html 配置界面,减少 80%界面代码量。易学易用:简单的 API 设计,可以独立、组合使用控件。

性能优化:内置数据懒加载、低内存开销、快速界面布局等机制。丰富控件:包含表格、树、数据验证、布局导航等超过 50 个控件。

超强表格:提供锁定列、多表头、分页排序、行过滤、数据汇总、单元格编辑、详细行、Excel 导出等功能。

第三方兼容:与 ExtJS、jQuery、YUI、Dojo 等任意第三方控件无缝集成。浏览器兼容:支持 IE6+、FireFox、Chrome 等。

跨平台支持:支持 Java、.NET、PHP 等。

3. jQueryUI


jQuery UI 是一套 jQuery 的页面 UI 插件,包含很多种常用的页面空间,例如 Tabs(如本站首页右上角部分) 、拉帘效果(本站首页左上角)、对话框、拖放效果、日期选择、颜色选择、数据排序、窗体大小调整等等非常多的内容。

技术亮点

简单易用:继承 jQuery 简易使用特性,提供高度抽象接口,短期改善网站易用性。

开源免费:采用 MIT & GPL 双协议授权,轻松满足自由产品至企业产品各种授权需求。

广泛兼容:兼容各主流桌面浏览器。包括 IE 6+、Firefox 2+、Safari 3+、Opera 9+、Chrome 1+。轻便快捷:组件间相对独立,可按需加载,避免浪费带宽拖慢网页打开速度。

标准先进:支持 WAI-ARIA,通过标准 XHTML 代码提供渐进增强,保证低端环境可访问性。

美观多变:提供近 20 种预设主题,并可自定义多达 60 项可配置样式规则,提供 24 种背景纹理选择。度娘上搜 jQueryUI 的 api,其用法与 easyUI、MiniUI 都大同小异,此处将不再举例。

4. Vue.js


参考原文:介绍 — Vue.js

Vue.js (读音 /vjuː/,类似于 view) 是一套构建用户界面的渐进式框架。与其他重量级框架不同的是,Vue 采用自底向上增量开发的设计。Vue 的核心库只关注视图层,它不仅易于上手,还便于与第三方库或既有项目整合。另一方面, 当与单文件组件和 Vue 生态系统支持的库结合使用时,Vue 也完全能够为复杂的单页应用程序提供驱动。

5. AngularJS


参考原文:AngularJS中文手册

AngularJS 是 google 开发者设计的一个前端开发框架,它是由是由 JavaScript 编写的一个 JS 框架。通常它是用来在静态网页构建动态应用不足而设计的。

AngularJS                                    

特 点 如 下 :

1、 数据绑定: AngularJS 是数据双向绑定。

2、 MVVM(Model-View-ViewModel)模式: Model 简单数据对象,View 视图(如 HTML,JSP 等), ViewModel 是用来提供数据和方法,和 View 进行交互。这种设计模式使得代码解耦合。

3、依赖注入:AngularJS 支持注入方式把需要的对象,方法等注入到指定的对象中。

4、 指令: AngularJS 内部自带各种常用指令,同时也支持开发者自定义指令。

5、HTML 模板和扩展 HTML: AngularJS 可以定义与 HTML 兼容的自定义模板。AngularJS 的 Api:

AngularJS 提供了很多功能丰富的组件,处理核心的 ng 组件外,还扩展了很多常用的功能组件,如ngRoute(路由),ngAnimate(动画),ngTouch(移动端操作)等,只需要引入相应的头文件,并依赖注入你的工作模块,则可使用。

ng (core module):AngularJS 的默认模块,包含 AngularJS 的所有核心组件。

6. AngularJS


React主要用于构建UI。你可以在React里传递多种类型的参数,如声明代码,帮助你渲染出UI、也可以是静态的HTML DOM元素、也可以传递动态变量、甚至是可交互的应用组件。

1.声明式设计:React 使创建交互式 UI 变得轻而易举。为你应用的每一个状态设计简洁的视图,当数据变动时 React 能高效更新并渲染合适的组件

2.组件化: 构建管理自身状态的封装组件,然后对其组合以构成复杂的 UI。

3.高效:React通过对DOM的模拟,最大限度地减少与DOM的交互。

4.灵活:无论你现在使用什么技术栈,在无需重写现有代码的前提下,通过引入 React 来开发新功能。


作者:zhulin1028

著作权归作者所有。商业转载请联系作者获得授权,非商业转载请注明出处。

相关文章
|
前端开发 应用服务中间件 nginx
Javaweb之前端工程打包部署的详细解析
6 打包部署 我们的前端工程开发好了,但是我们需要发布,那么如何发布呢?主要分为2步: 前端工程打包 通过nginx服务器发布前端工程 6.1 前端工程打包
395 0
Javaweb之前端工程打包部署的详细解析
|
JavaScript 前端开发 C++
Javaweb之前端工程化的详细解析(2)
3.2.2.3 运行vue项目 那么vue项目开发好了,我们应该怎么运行vue项目呢?主要提供了2种方式 第一种方式:通过VS Code提供的图形化界面 ,如下图所示:(注意:NPM脚本窗口默认不显示,可以参考本节的最后调试出来)
161 0
|
存储 JavaScript 前端开发
Javaweb之前端工程化的详细解析(1)
3 前端工程化 3.1 前端工程化介绍 我们目前的前端开发中,当我们需要使用一些资源时,例如:vue.js,和axios.js文件,都是直接再工程中导入的,如下图所示:
163 0
|
缓存 前端开发 JavaScript
【JavaWeb】Web前端性能优化
【JavaWeb】Web前端性能优化
160 1
【JavaWeb】Web前端性能优化
|
XML 存储 前端开发
JavaWeb 前端工程化
JavaWeb 前端工程化
134 0
|
前端开发
初学JavaWeb,前端css要不要了解一下啊?一文学会JavaWeb中css的简单应用
初学JavaWeb,前端css要不要了解一下啊?一文学会JavaWeb中css的简单应用
初学JavaWeb,前端css要不要了解一下啊?一文学会JavaWeb中css的简单应用
|
前端开发 JavaScript Java
Javaweb第一章:Web前端的入门理论
Javaweb第一章:Web前端的入门理论
435 0
|
JSON JavaScript 前端开发
初学JavaWeb需要的前端js,JavaScript是什么样的?
初学JavaWeb需要的前端js,JavaScript是什么样的?
初学JavaWeb需要的前端js,JavaScript是什么样的?
|
存储 前端开发 数据库
JavaWeb综合项目——快递e栈(微信前端部分)(三)
JavaWeb综合项目——快递e栈(微信前端部分)(三)
JavaWeb综合项目——快递e栈(微信前端部分)(三)
|
JavaScript 安全 前端开发
JavaWeb综合项目——快递e栈(微信前端部分)(二)
JavaWeb综合项目——快递e栈(微信前端部分)(二)
JavaWeb综合项目——快递e栈(微信前端部分)(二)

热门文章

最新文章

  • 1
    前端如何存储数据:Cookie、LocalStorage 与 SessionStorage 全面解析
    602
  • 2
    【CSS】前端三大件之一,如何学好?从基本用法开始吧!(九):强势分析Animation动画各类参数;从播放时间、播放方式、播放次数、播放方向、播放状态等多个方面,完全了解CSS3 Animation
    252
  • 3
    【CSS】前端三大件之一,如何学好?从基本用法开始吧!(八):学习transition过渡属性;本文学习property模拟、duration过渡时间指定、delay时间延迟 等多个参数
    234
  • 4
    【CSS】前端三大件之一,如何学好?从基本用法开始吧!(七):学习ransform属性;本文学习 rotate旋转、scale缩放、skew扭曲、tanslate移动、matrix矩阵 多个参数
    186
  • 5
    【CSS】前端三大件之一,如何学好?从基本用法开始吧!(六):全方面分析css的Flex布局,从纵、横两个坐标开始进行居中、两端等元素分布模式;刨析元素间隔、排序模式等
    293
  • 6
    【CSS】前端三大件之一,如何学好?从基本用法开始吧!(五):背景属性;float浮动和position定位;详细分析相对、绝对、固定三种定位方式;使用浮动并清除浮动副作用
    424
  • 7
    【CSS】前端三大件之一,如何学好?从基本用法开始吧!(四):元素盒子模型;详细分析边框属性、盒子外边距
    183
  • 8
    【CSS】前端三大件之一,如何学好?从基本用法开始吧!(三):元素继承关系、层叠样式规则、字体属性、文本属性;针对字体和文本作样式修改
    125
  • 9
    【CSS】前端三大件之一,如何学好?从基本用法开始吧!(二):CSS伪类:UI伪类、结构化伪类;通过伪类获得子元素的第n个元素;创建一个伪元素展示在页面中;获得最后一个元素;处理聚焦元素的样式
    196
  • 10
    【CSS】前端三大件之一,如何学好?从基本用法开始吧!(一):CSS发展史;CSS样式表的引入;CSS选择器使用,附带案例介绍
    273