javascript案例 javascript插件下载
这篇文章给大家聊聊关于javascript案例,以及javascript插件下载对应的知识点,希望对各位有所帮助,不要忘了收藏本站哦。
JavaScript的目的
从今天起我将陆续将 ppk on JavaScript的读书心得发布到这个blog上 ppk是我所景仰的一位web开发者原因无它只是因为作为一个JavaScript的开发者来说他涉及的领域包括web标准可用性无障碍等正是其他开发者所不关注或者故意忽略的并且他写了很多案例测试不同的浏览器总结出JavaScript的接口(API)兼容性成为JavaScript开发者重要参考资料几年如一日这种钻研精神是很多人所缺乏的
ppk在今年月出版了他的书我从去年起就在等的书今天拿到手迫不及待地把第一章阅读完毕果然让人充满惊喜他的功力非同一般虽然只是一个初学者但我认为我已经走在正确的学习道路上我想我若能将学习心得分享能让正在学习的人看到可以一起交流一起进步尽管我不敢确保你能从我这里得到什么启发但我可以确信我这些笔记会比你拷贝粘贴代码的学习方式更正确
这本书有十章章名都简洁明了分别是目的背景浏览器准备核心 BOM事件 DOM CSS更改和数据获取从来没有一本书能如此简洁地明确JavaScript的方方面面因此学习不会有太大负担前言不宜过多下面就开始我的第一章学习笔记
开篇宗义 JavaScript的目的是为网页增加特别的一层可用性听起来很简单但这条黄金定律经常被人误解就算编写有用的JavaScript开发者可能还是没能结合适当的情景 Web标准运动发展下与当代无障碍的HTML页面的配合更为不妙的是有些开发者不是为网页增加一层可用性而是用整层取代之后果是如果浏览器不支持JavaScript网站就完了
概念概述
JavaScript是一门由浏览器解释的脚本语言它通过在客户端而不是服务器端处理某些交互比如表单验证创建新菜单来给网站增添可用性传统的网页交互是客户端的一举一动都必须经过服务器端的出来才能反馈回来漫长的等待会让用户崩溃而JavaScript可以在客户端代替服务器端做某些事情(最明显的表单验证)从而提高用户体验
随着时代的发展 JavaScript能够处理越来越多的交互问题出现了 JavaScript能做这么多事情到底要多用还是少用?这就有了富与瘦的对决是整个页面都用JavaScript来控制交互还是只增加些许的JavaScript来增强可用性?就是说尽可能地使用JavaScript还是有所节制甚至不用?
瘦客户端很大程度上依赖于客户端-服务器的通讯而富客户端尽可能限制额外的数据通讯
哪种方式更好?尽管富客户端带来一些可用性益处但瘦客户端可能是更标准的JavaScript用法 Web被认为是文档集合而不是界面集合最明显的证据是浏览器有后退前进的功能让你在文档中跳转而界面会有么?浏览器可以收藏(书签)文档而界面可以么?从无障碍来说瘦客户端也更少出错
这种非平衡性是很难解决的富客户端当然也可以在更高级的界面做到前进后退或者收藏也可以做到完美的无障碍这必须需要大量的额外工作但不是每个项目都有超出预算的时间或金钱此外太过专注于可用性而忽略无障碍也是一个问题
那么JavaScript的目的是为富客户端还是瘦客户端服务?答案是看情况得看你的网站你的受众你的JavaScript水平
技术概述
JavaScript分为六个方面分别是核心(Core)浏览器对象模型(BOM)事件(Events)文档对象模型(DOM) CSS变更和数据获取(XMLHttpRequest)
上古时代 NetScape领头之时 NetScape是事实标准
当代却没有这么简单 ECMA标准化JavaScript Core W C标准化DOM而BOM尚在WHAT WG的标准化中 W C也刚有了XMLHttpRequest的第一份草稿今天 BOM依然遵循NetScape的事实标准而XMLHttpRequest还是遵照Microsoft的原始规范
JavaScript的目的在于为网站增加可用性而不是破坏用户的隐私和安全因此JavaScript不允许读写用户的文件(cookies除外)采取同源策略只允许来自相同域的交互不允许读取历史记录不能为上传文件的表单设置值由JavaScript控制的窗口关闭需经用户确认由JavaScript打开的窗口不能小于×的窗口不能移出屏幕之外
JavaScript的历史
探寻历史才能让我们知道JavaScript为什么会被误解得如此深 JavaScript的创造者是Brendan Eich首次在NetScape中实现它的目的是创建一门足够简单的语言让开发者能容易地为网页增加交互只要把代码拷贝过来调整一下就可以这确实令人赞叹很多JavaScript开发者是从拷贝粘贴开始的
不幸的是JavaScript生错了名字也生错了语法最初它叫LiveScript但年的时候Java炙手可热 NetScape想搭顺风车于是某产品经理(我想知道她/他是谁呵呵)命令更名命令Brendan Eich让 Javascript像Java这让很多人误认为JavaScript是Java的低级版不能引起严肃程序员的关注
年之时 NetScape是王 Microsoft只能照抄这是一个难得的和谐期当然那时候浏览器比起现在来瘦了仅限于表单验证鼠标轮换的一些小花招而已
接下来就是影响深远的浏览器大战了为了争夺市场两家浏览器纷纷实现不同的东西谁都想成为事实标准最有名的就是NetScape的document layer和IE的document all(忘记它们吧!)它们让DHTML流行起来
年Microsoft以推出良好支持CSS和DOM的IE胜出 NetScape的让位终于有足够的时间让一场革命发生那就是CSS WaSP首先从CSS入手而很多专家也发现/发明了许多浏览器的补救办法让这场革命成为可能
年一些先锋们在CSS革命的影响下开始探索新的JavaScript风格更多地关注无障碍改观人们对它的坏名声那就是unobstrusive——把JavaScript从HTML结构层分离出来遗憾的是那些在浏览器大战存活下来的程序员可能还没有发现这条新道路
年 Ajax热潮为JavaScript社区注入新的血液但某些方面 Ajax太像DHTML了无障碍是很多Ajax应用的难言之隐这个热潮趋向于关注技术(如何Ajax)而可用性和交互(为何Ajax)却被低估最后各种肿胀的库(现在称为框架)迅速发展起来
Ajax依然全速前进但这会像DHTML一样结果人们渐渐失去兴趣它们会土崩瓦解
lishixinzhi/Article/program/Java/JSP/201311/19410
HTML5 中引入了哪些新的JavaScript API具体有什么作用
简而言之,HTML5就是由新的标记引进的新元素形式和为现有元素新增的某些属性,与新的JavaScript APIs的结合体。那HTML5中引入了新增加了哪些新标签与JavaScript API结合体呢?我这里例举了我们平时最常用的几种:
1、 Canvas API是一个具有完整功能的JavaScript API并伴随产生了新HTML5元素<Canvas>。通过Canvas API,您可以利用它和WebGL在浏览器中创建一个2 D或3 D绘图场景,
2、 Contacts API主要应用在移动设备上,为浏览器提供对用户通用通讯录的访问。它在浏览器内建立一个本地存储库,来存储联系人信息。而不是通过访问让你所有联系人信息直接保存在Google+、Facebook或其他网站上, Contacts API将允许您有本地存储库,网站可以通过本地存储库访问存储的联系人信息。现在的主流浏览器都支持Contacts API
3、通过File API浏览器可以直接访问用户计算机的沙箱区域将数据存储到文件系统。
4、在HTML5中Forms API得到了发展,内置了验证功能,在接下来的课程中,您将会学习到如何通过使用内置的规则实现表单验证,以及如何添加自定义规则进行表单验证。
5、允许浏览器请求用户的位置信息,一旦获权,浏览器可以通过许多不同的方法来确定计算机或设备的实际位置,它将会有一个比例尺来确认精确的地点位置。通过该API能获取经纬度等数据,非常适合应用程序定位。
6、 Media Capture的功能是将本地设备通过JavaScript将与浏览器相连。你将能够访问摄像头,摄像头,等等。
7、 Messaging API被用来与其他API一起使用,比如web web workers,这个我们将将在后面的课程中进一步讨论。
8、选择(Selection)API的就像jQuery库一样运用非常广泛。在流行jQuery、HTML5的今天,试图从文档对象模型选择元素是比较复杂的。jQuery弥补了这一差距。其实变得很容易,HTML5将高级选择功能直接内置在浏览器中。使得浏览器的选择性能得到很大的改善,甚至于JQuery选择工具一样速度。我并不是贬低jQuery。jQuery的优势就是DOM的选择,但是,jQuery不仅仅只提供了选择功能,事实上,在本课程中未来的演示的案例中,您将清楚的知道什么时候使用jQuery会更加便利,然后什么时候切换到本地选择会更加方便。.
9、 Server-Sent Events API:一个网页获取新的数据通常需要发送一个请求到服务器,也就是向服务器请求的页面.使用Server-Sent Events API,服务器可以在任何时刻向我们的web页面推送数据和信息.这些被推送进来的信息可以在这个页面上作为事件/数据来处理。服务器推送事件(Server-Sent Events)的优点在于:只要响应的内容类型是事件/数据流,事件就通过HTTP发送,浏览器能够识别该传输。
10、 Web Notifications API即web消息提醒,它可以使页面可以发出通知,通知将被显示在页面之外的系统层面上(通常使用操作系统的标准通知机制,但是在不同的平台和浏览器上的表现会有差异)。这个功能使 web应用可以向用户发送信息,即使应用处于空闲状态。最明显的用例之一是一个网页版电子邮件应用程序,每当用户收到了一封新的电子邮件都需要通知用户,即使用户正在使用另一个应用程序。在2013年夏天,这个API还是在被W3C在试用,并没有被很多浏览器所应用。
11、 Web Sockets API:Web Sockets是一种基于 ws协议的技术,它使得建立全双工连接成为可能。websocket常见于浏览器中,但是这个协议不受使用平台的限制。它允许你收发信息到服务器端。这个典型的示例就是即时通信。你建立一个对话,如果没有sockets,你可能会去从服务器中去获取新的消息。如果具有了sockets,当消息通过浏览器发到服务端的时候,对方的客户端通过已经建立好的sockets链接就能自动的接收到信息。
12、 Web存储,它有两种版本,本地存储和会话存储。就WEB开发来说,一个会话就是你通过浏览器与服务器之间的一次通话,所以,如果你熟悉服务器端web开发,会话存储可能不是头一次听说。基本上,只要用户页在页面上的统一个会话内,工作数据就不会丢失。如果浏览器关闭或者转向另一个会话,那么此时数据就不复存在。本地存储在不同会话之间仍然能保存数据,本地存储与cookie和IndexedDB相比,它可以让你来贮存更多的信息。Web存储与cookie,数据不发送到请求的服务器而是保存在客户端。
这些都是HTML5中新加入的一些比较常用的功能API,如果你想要系统的了解HTML5的新功能,推荐你去一个叫做秒秒学的教程网站上看看,里面有专门的课程来讲解HTML5中的新特性,希望对你有帮助。
如何正确学习JavaScript
如今使用Javascript框架和插件构建的Web应用越来越多,并且已经能够实现3D动画特效、可交互的信息图等很有趣又实用的效果,如果想要做Web开发,Javascript是必需品。
目前自己的知识库中只对HTML和CSS这类非编程类的语言比较熟悉且能熟练应用。曾经有一段时间下了不少功夫在Processing这门基于Java再编译的语法相对简单的编程语言,但因为是基于Java,若想要将用Processing直接引用于Web,要么需要用户装个Java的web控件,要么,就需要把它转城Javascript来实现Web的无缝链接。如果Objective-C占尽了移动开发的风头,那么跟得上潮流的Web开发一定少不了Javascript。但是,作为一个有初步编程背景的人,如何自学,才能正确有效地掌握Javascript这门语言呢?
今天,终于在JavascriptIsSexy这个网站上的“How to Learn JavaScript Properly”这篇文章中找到了我比较认同的答案。
我目前接触和学习JavaScript的几个途径,一是Codecademy这个在线编程学习网站。正如JavaScriptIsSexy这篇文章的作者所言,Codecademy给出的案例任务大都是相对简单单一的小任务,即使完成了课程,也很难开始实战一款真正的Web App。
曾经有工程师向我推荐阅读“Javascript: The Good Parts”一书,但在这篇文章中作者则建议初学者不要阅读此书,等基础扎实了再读。
很开心的是,这篇文章推荐的入门书目之一是《JavaScript权威指南》,恰巧我已经在O’Reilly上购入了正版。虽然有些Web工程师觉得此书适合当参考书,但是经由JacaScriptIsSexy上的自学计划来看,如果合理地阅读权威指南上的部分章节,并亲手把书中配套的案例代码敲出来,对Javascipt初学者来说是非常重要的!
另一本推荐书目是《JavaScript高级程序设计》,不过如果有了《JavaScript权威指南》,没有这本书也没有关系。
“How to Learn JavaScript Properly”这篇文章给JavaScript初学者列出了6~8周的学习计划,除了阅读指定书目以及根据书中的内容敲代码。作者还建议初学者开通“StackExchange”的帐号以及JSFiddle的帐号,因为StackExchange如今以积累了大量技术开发问题和解答。而工程师们往往会使用JSFiddle这个在线的IDE来分享JS代码。
Codecademy不宜作为唯一的JavaScript学习平台,但在阅读作者推荐的书目的同时,配合Codecademy上的案例学习也是很有帮助的。
如果你想要自学JavaScript,又或者你已经有一定的JavaScript编程基础却觉得自己学艺不精,不妨读读“How to Learn JavaScript Properly”(英文),相信它会给你带去一些共鸣与收货的。
好了,本文到此结束,如果可以帮助到大家,还望关注本站哦!