什么是JavaScript框架

2016-02-20 01:06 1 1 收藏

get新技能是需要付出行动的,即使看得再多也还是要动手试一试。今天图老师小编跟大家分享的是什么是JavaScript框架,一起来学习了解下吧!

【 tulaoshi.com - Web开发 】

摘要:现代网站和web应用程序趋向于依赖客户端的大量的javascript来提供丰富的交互。特别是通过不刷新页面的异步请求来返回数据或从服务器端的脚本(或数据系统)中得到响应。在这篇文章中,你将会了解到javascript框架如何更快、更方便的创建互动性强、响应快得网站和web应用程序。

导言:JavaScript是一种面向对象的脚本语言,一直以来用作Web浏览器应用程序客户端脚本接口的选择。JavaScript允许Web开发人员编程与网页上的对象的工作,为凭空操作这些对象提供了一个平台。当JavaScript最初推出时,它通常用来提供一些微不足道的功能,如时钟、在浏览器状态栏中滚动文本。另外一个常用特色就是rollover link,即当用户的鼠标滑过对象时,其文本的颜色或背景图片发生改变。然而,近年来Ajax为网络编程带来了全新的互动,JavaScript几经发展变得更加有用。在Ajax之前,任何服务器端处理或数据库访问都需要整页面被刷新或由浏览器呈现新的页面。这不仅缓慢,令用户失望,而且也浪费了带宽和资源。

Ajax就是异步的JavaScript和XML,虽然引用XML不在有效,但是Ajax能对除了XMl的其它几种格式的数据作出响应,如JSON(JavaScript对象表示法)。 Ajax的工作原理是,以异步的方式提交一个 HTTP请求提交到web服务器,不刷新也不呈现整个页面,仅呈现响应的内容。相反,开发人员通常使用DOM(文档对象模型)操作修改网页的一部分,HTTP响应返回的数据将反映这些改变。

什么是JavaScript框架?

(本文来源于图老师网站,更多请访问https://www.tulaoshi.com/webkaifa/)

JavaScript本身是一种非常强大的语言,你不需要任何额外的框架就可以创建由它支持的富互联网应用系统(RIA)。但是,使用JavaScript并不是一件容易的事,主要是因为在试图提供多种浏览器支持时各种并发症的出现。和HTML和CSS一样,不同的浏览器的JavaScript执行方式不同,那么确保您的JavaScript代码跨浏览器兼容可以说是一个恶梦。

一个JavaScript框架或库实际上是一系列工具和函数,它能更容易产生跨浏览器兼容的JavaScript代码。每个库在许多流行的最新版本的Web浏览器经过了严格测试。因此,您完全可以相信,使用这些框架中的任何一个,您的基于JavaScript的RIA在不同的浏览器和平台中将大体一致。

除了浏览器兼容性问题外,JavaScript框架可以更容易地编写代码去获取、遍历及操纵DOM元素。它们不仅能提供一个快捷的函数来获取一个DOM元素的引用,而且还允许菊花式的DOM遍历函数链查找父母、子女或任何深度的兄弟节点元素。最后,框架提供了一系列的函数,使其更容易的操纵这些对象,允许其内容更改、添加、删除,或者操纵class的样式而影响元素的外观。

JavaScript框架的另一个重要特色就是能更好的支持事件处理。由于浏览器之间的不同实现,跨浏览器事件处理可以说是一个恶梦。因此,JavaScript框架通常将浏览器事件包装起来,并提供一系列有用的跨浏览器函数来处理它们。一些框架也提供了标准化的代表键盘键码系列的事件(如Esc键、Enter键、光标等等)。

所有这些功能是非常有用的,JavaScript框架已在其最近流行Ajax应用中起重要作用。和JavaScript其他方面一样,每个Web浏览器倾向于支持以不同的方式Ajax,使Ajax支持所有的浏览器将是很繁重的工作。几乎所有的JavaScript框架都包括一定形式的Ajax库,通常是提供Ajax请求和响应对象,在对响应作出评价后,更新DOM元素,轮询一个特定的请求。

一个JavaScript框架的典型特征

现在让我们看看大多数JavaScript框架都具有的一些功能。这些特色有:

选择器 DOM遍历 DOM操作 实用函数 事件处理 Ajax

为了更好的诠释这些特色,我将从下面一个或多个JavaScript框架中列举一个例子:Prototype, jQuery, YUI,ExtJS和 MooTools。虽然每个框架的执行情况和语法不同,但其概念大致相同。每个框架有一个详细的API参考,你可以参考它决定如何使用这些特定库的特色功能。

(本文来源于图老师网站,更多请访问https://www.tulaoshi.com/webkaifa/)

来源:https://www.tulaoshi.com/n/20160220/1633267.html

延伸阅读
标签: Web开发
提升用户体验(UE) 到目前为止,这篇文章完全集中于使用 JavaScript框架 的好处,以及如何更容易的构建交互式应用程序。但是,另一方面,各个框架都有各自诱人的前景,包括用户界面(UI)组件和用户体验(UE)增强,这需要花大量的精力。 这章将分别探讨下面框架的用户体验: Prototype、 jQuery、YUI、ExtJS和MooTools。 Prototype...
标签: Web开发
先回顾在html中是如何使用框架的: Code html frameset cols="66%,34%" frame src="chicken.html" name="chicken" frameset rows="100,*" frame src="pastasalad.html" name="pastasalad" frame src="jellocubes.html" name="jellocubes" /frameset /frameset /html现在就来看在框架中运用JavaScript的例子: Code html frameset rows="25%,*" fr...
标签: Web开发
框架比较 表1对本文中讨论的五个框架提供详细的比较   Prototype jQuery YUI ExtJS MooTools Browser Compatibility Core Features UX/UI Enhancements 其他值得注意的框架 为了简洁,本文只讨论五个比较流行的框架,这并不意味着这是最流行的、最好的、功能最丰富的。 其它的一些框架也值得一提、值得一...
标签: Web开发
Dean Edwards 最近有篇文章很精彩,忍不住在这里翻译下。 -- Split -- 很多 Javascript 框架都提供了自定义事件(custom events),例如 jQuery、YUI 以及 Dojo 都支持document ready事件。而部分自定义事件是源自回调(callback)。 回调将多个事件句柄存储在数组中,当满足触发条件时,回调系统则会从数组中获取对应的句柄并执行。那...
标签: Web开发
      下面以三个页面分别命名为framedemo.html,top.html,button.html为例来具体说明如何做。       其中framedemo.html由上下两个页面组成,代码如下: 以下是引用片段: !DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN" HTML HEAD TITLE frameDemo /TITLE /...

经验教程

453

收藏

45
微博分享 QQ分享 QQ空间 手机页面 收藏网站 回到头部