javascript程序员教程(javascript下载官方)

编程之家2026-06-04737次浏览

大家好，关于javascript程序员教程很多朋友都还不太明白，今天小编就来为大家分享关于javascript下载官方的知识，希望对各位有所帮助！

请简单说明javascript中处理事件的步骤

Javascript事件处理程序的3种方式

产生了事件，我们就要去处理他，据马海祥了解Javascript事件处理程序主要有3种方式：

1、HTML事件处理程序

即我们直接在HTML代码中添加事件处理程序，如下面这段代码：

function showmsg(){

alert("HTML添加事件处理");

}

</script>

从上面的代码中我们可以看出，事件处理是直接嵌套在元素里头的，这样有一个毛病：就是html代码和js的耦合性太强，如果哪一天我想要改变js中showmsg，那么我不但要再js中修改，我还需要到html中修改，一两处的修改我们能接受，但是当你的代码达到万行级别的时候，修改起来就需要劳民伤财了，所以，这个方式我们并不推荐使用。

2、DOM0级事件处理程序

即为指定对象添加事件处理，看下面的一段代码

var btn2= document.getElementById("btn2");

btn2.onclick=function(){

alert("DOM0级添加事件处理");

}

btn.onclick=null;//如果想要删除btn2的点击事件，将其置为null即可

</script>

从上面的代码中，我们能看出，相对于HTML事件处理程序，DOM0级事件，html代码和js代码的耦合性已经大大降低。但是，聪明的程序员还是不太满足，期望寻找更简便的处理方式，下面马海祥就来说说第三种处理方法。

3、DOM2级事件处理程序

DOM2也是对特定的对象添加事件处理程序（具体可查看马海祥博客的《JavaScript对象属性的基础教程指南》相关介绍），但是主要涉及到两个方法，用于处理指定和删除事件处理程序的操作：addEventListener()和 removeEventListener()。

它们都接收三个参数：要处理的事件名、作为事件处理程序的函数和一个布尔值（是否在捕获阶段处理事件），看下面的一段代码：

var btn3=document.getElementById("btn3");

btn3.addEventListener("click",showmsg,false);//这里我们把最后一个值置为false，即不在捕获阶段处理，一般来说冒泡处理在各浏览器中兼容性较好

function showmsg(){

alert("DOM2级添加事件处理程序");

}

btn3.removeEventListener("click",showmsg,false);//如果想要把这个事件删除，只需要传入同样的参数即可

</script>

这里我们可以看到，在添加删除事件处理的时候，最后一种方法更直接，也最简便。但是马海祥提醒大家需要注意的是，在删除事件处理的时候，传入的参数一定要跟之前的参数一致，否则删除会失效！

前端程序员怎么自学

自学方法：

1、作为一个初学者，你必须明确系统的学习方案，我建议一定有一个指导的人，全靠自己学，放弃的几率非常大，在你对于web前端还没有任何概念的时候，需要一个人领进门，之后就都靠自己钻研，第一步就是确定web前端都需要哪些内容，并且在多少时间内学完，建议时间6个月保底。

2、视频为主，书为辅。很多初学者在学习前端的时候非常喜欢去买书，但是最后的结果是什么？看来看去什么都不会写，所以在这里给大家提醒，书可以看，但是是在建立于你已经对于某个知识点有了具体操作的执行后，在用书去巩固概念，这样更加利于你对于知识的理解。

3、对于学习技术来讲，掌握一个学习方法是非常重要的，其实对于学习web前端来讲，学习方法确实很多都是相通的，一旦学习方法不对，可能就会造成“方法不对，努力白费”。其实关于这方面还是很多的，我就简单说个例子，有的人边听课边跟着敲代码，这样就不对，听课的时候就专心听，做题的时候就专心做题，这都是过来人的经验，一定要听。根据每个人的不同，可能学习方法也会有所出路，找到适合你自己的学习法方法是学习的前提。

4、不建议自己一个人瞎学，在我了解学习编程的这些人来看，从零基础开始学并且最后成功做这份工作的其实并没有几个，我觉得大部分原因就是因为他们都不了解web前端是干什么的，学什么的，就盲目的买书看，到处找视频看，最后看着看着就放弃了，所以我建议初学者在没有具体概念之前，还是找有经验的人请教一下，聊过之后你就会知道web前端具体是干什么的，该怎么学，这是我个人的小建议，可以不采纳。

自学路线：

第1阶段：前端页面重构(4周)

内容包含了：(PC端网站布局项目、HTML5+CSS3基础项目、WebApp页面布局项目)

第2阶段：JavaScript高级程序设计(5周)

内容包含：(原生JavaScript交互功能开发项目、面向对象进阶与ES5/ES6应用项目、JavaScript工具库自主研发项目)

第3阶段：PC端全栈项目开发(3周)

内容包含：(jQuery经典交互特效开发、HTTP协议、Ajax进阶与PHP/JAVA开发项目、前端工程化与模块化应用项目、PC端网站开发项目、PC端管理信息系统前端开发项目)

第4阶段：移动端项目开发(6周)

内容包含：(Touch端项目、微信场景项目、应用Angular+Ionic开发WebApp项目、应用Vue.js开发WebApp项目、应用React.js开发WebApp项目)

第5阶段：混合(Hybrid,ReactNative)开发(1周)

内容包含：(微信小程序开发、ReactNative、各类混合应用开发)

第6阶段：NodeJS全栈开发(1周)

内容包括：(WebApp后端系统开发、一、NodeJS基础与NodeJS核心模块二、Express三、noSQL数据库)

基础书籍：

1、《Head First HTML与CSS(第2版)》，入门真的是经典书籍，手把手教学，丰富的案例让你从 0开始学前端。

2、《CSS权威指南(第三版)》，这本书作为 CSS的经典著作，把原理讲得非常的通透，除了 w3c标准，算最权威的一本了，毕竟权威指南。

3、《CSS揭秘》神书，47个 css技巧让你在面对各种 css问题的时候游刃有余。是 css书籍中评分最高的了，css进阶必备。

4、《javascript语言精粹》，这本书可以在入门之前了解一下基本语法，以及在学习之前可以了解下 JS里面的精粹以及糟粕，虽然这本书很薄很薄，但是值得反复去读的一本书。

5、《JavaScript DOM编程艺术(第2版)》，本书在简洁明快地讲述JavaScript和DOM的基本知识之后，通过几个实例演示了专业水准的网页开发技术，透彻阐述了平稳退化等一批至关重要的 JavaScript编程原则和最佳实践。

6、《JavaScript权威指南》：犀牛书是每个FE都绕不过的一本书，可以先大致通读几遍，也可以把其当作工具书，时时翻阅。

视频教程:

网页链接

程序员入门:如何自学编程

首要之首：不要急于选择一种语言新手们有一个常见的错误就是犹豫于判断哪种编程语言是做好的、最该先学的。我们有很多的选择，但你不能说那种语言“最好”。我们应该理解：说到底，什么语言并不重要。重要的是理解数据结构、控制逻辑和设计模式。任何一种语言—甚至一种简单的脚本语言—都会具有所有编程语言都共有的各种特征，也就是说各种语言是贯通的。我正在攻读我的计算机学学位，我编程使用Pascal，汇编，和C语言，事实上我从来没有把它当成职业以求获得回报。我一直在自学编程，工作上用不到它，我使用现有的知识，参考各种文档和书本，学习它们的用法。因此，不要急于选择何种编程语言。找出你想要开发的东西，使用一种能够完成这项任务的语言，这就可以了。根据各种开发平台的不同，有很多不同的软件开发形式可供你选择：从网站应用到桌面软件到智能手机软件到命令行脚本工具。这篇文章里，我将重点介绍一些很受欢迎的入门教程和资源，它们能帮助你学会如何在各种主流的平台上编程开发。我先假设你是一个悟性很强的读者，但对于新手，当我谈论程序代码时还是要按照入门级的水平。因为即使是你自己看一篇编程入门手册，如果发现都能理解时，心情自然会很高兴，这样利于你进一步学习。桌面脚本想要动手在Windows里或苹果系统里编程，最简单的方法是从一种脚本语言或宏语言开始，例如AutoHotkey(Windows)或Automator(苹果系统)。如今一些硬件程序员冲着他们的屏幕大喊大叫，说AHK和AppleScript并不是“真正”的编程语言。也许他们说的是对的—技术上，这些种类的语言只能做一些上层的编程。但是对于那些只是想来脱盲、想在他们的电脑里实现一些能自动运行的程序的新手来说，这些语言会是一个绝妙的入门入口—而且你会吃惊于它们丰富的功能。例如，大家都喜爱的Texter就是Adam使用AutoHotkey开发的能独立运行的Windows应用程序，所以说这种脚本语言远不是只能开发小规模脚本软件。如果你想从AutoHotkey入手，可以参考Adam的指导：how to turn any action into a keyboard shortcut using AutoHotkey（然后，你可以下载Texter源代码看看这个功能齐全的使用AHK开发的Windows应用程序的内部结构)。 Web开发 HTML和 CSS：开发网站，你第一件要知道的事情就是HTML(网页就是由它组成的)和CSS(一种让外观更好看的样式标记)。 HTML和 CSS并不是编程语言—它们只是页面的结构和样式信息。然而，在开始开发web应用程序之前你必须要学会如何手工的编写简单的HTML和CSS，web页面是任何webapp的前端显示部分。这个HTML指导是你入手的好地方。 JavaScript:当你可以通过HTML和CSS构建一个静态页面后，事情就开始变得有趣了—因为到了该学JavaScript的时候了。 JavaScript是一种web浏览器上的编程语言，它的魔力就是能在页面里制造一些动态效果。 JavaScript可以做bookmarklets,Greasemonkey脚本,和Ajax,所以它是web上各种好东西的关于因素。学习JavaScript从这里开。服务器端脚本：一旦你学会了网页里的知识，你就要开始对它添加一些动态服务器操作—为了实现这些，你需要把目光转移到服务器端脚本语言，例如PHP, Python, Perl,或 Ruby。举个例子，如果想要制作一个网页形式的联系方式表单，根据用户的输入发送邮件，你就需要使用服务器端脚本来实现。像PHP这样的脚本语言可以让你跟web服务器上的数据库进行沟通，所以如果你想搭建一个用户可以登录注册的网站，这样的语言正是你需要的。Webmonkey是一个优秀的web开发资源网站，里面有大量的各种web编程语言的指导手册。阅读一下他们的PHP初学者指南。当你感觉差不多了的时候，看看WebMonkey’s PHP and MySQL tutorial学习如何使用PHP跟数据库交互。网上最好的要数PHP语言官方的在线文档和函数参考了。每个知识点上(例如strlen function这个)都在后面列出来用户的评论注释，这些对于文档的本身是非常有价值的。（我很喜欢PHP，但还有很多其他种服务器端的脚本语言你们都可以选择。) Web框架：过去数年里，web开发人员在开发动态网站的过程中不得不一遍又一遍的针对重复遇到的问题写出重复的代码。为了避免这种每次开发一些新网站都会重复劳动一次的问题，一些程序员动手搭建了一些框架，让框架替我们完成重复性的工作。非常流行的Ruby on Rails框架，作为一个例子，它利用Ruby编程语言，为我们提供了一个专门面向web的架构，普通的web应用程序都能使用它来完成。事实上，Adam使用Rails开发了他的第一个正式的（而且是叹为观止的！）web应用程序，MixTape.me。这就是他的如何在没有任何经验的情况下搭建一个网站。还有一些其他的web开发框架包括CakePHP(针对 PHP编程者),Django(针对 Python编程中),以及jQuery(针对 JavaScript). Web APIs:API(应用层序编程接口)是指不同的软件之间相互交换的程序途径。例如，如果你想在你的网站上放一个动态的地图，你可以使用Google Map，而不需要开发自己的地图。The Google Maps API可以轻松的让你通过JavaScript在程序中引入一个地图到你的页面上。几乎所有的现代的你所知道的和喜爱的web服务都提供了API，通过这些API你可以获取到他们的数据和小工具，在你的应用程序里就可以使用这些交互过来的东西了，例如Twitter, Facebook, Google Docs, Google Maps,这个列表远不止这些。通过API把其他web应用集成到你的web应用里是现在富web开发的前沿地带。每个优秀的主流的web服务API都附带有完整的文档和一些快速入手的指导(例如，这个就是Twitter的)。疯狂吧。命令行脚本如果你想开发一个程序，让它读取文字或文件、输入输出一些有用的东西，那么，命令行脚本语言将是个不错的选择。然而它并不像web应用程序和桌面应用程序那样有吸引力和好看的外观，但是作为快速开发的脚本语言，你却不能忽视它们。很多的在linux平台上运行的web脚本同样能以命令行模式运行，例如Perl，Python和PHP，所以如果你学会了使用它们，你将能在两种环境中使用它们。我的学习道路一直没离开Perl太远，我自学Python使用的是这本优秀的在线免费书Dive into Python。如果成为一个Unix高手也是你学习的目标，那么你绝对要精通bash这个脚本语言。 Bash是Unix和Linux环境下的一种命令行脚本语言，它能够为你做所以的事情：从自动备份数据库脚本到功能齐全的用户交互程序。起初我没有任何使用bash脚本的经验，但最终我用bash开发了一个全功能的个人代办任务管理器：Todo.txt CLI。插件（Add-ons）如今的web应用程序和浏览器都可以通过一些扩展软件来丰富自己的功能。由于一些现有的软件，例如Firefox、WordPress越来越受到开发人员的关注，插件的开发也日益流行，人们都在说“But if only it could do THIS…”只要你掌握了HTML，JavaScript和CSS，你就可以在任何的浏览器里开发你想要的很多东西。 Bookmarklets,Greasemonkeyuser scripts,和Stylishuser styles这些软件都是用的更普通页面一样的语言写成的,这几个东西都值得你去研究一些。更高级的浏览器扩展程序，例如Firefox的扩展，它们可以帮助你很多。开发Firefox的扩展，举个例子，需要你精通JavaScript和XML（一种标记语言，类似HTML，但具有更严格的格式）。早在2007年我就写下来how to build a Firefox extension,这是我在笨手笨脚的研究网上的一些学习资料后获得的成果。很多免费的、受欢迎的web应用程序都提供了扩展框架，例如WordPress和 MediaWiki。这些应用程序都是用PHP写成的，所以只有对PHP熟悉你才能做这些事情。这个就是如何编写WordPress插件。而想驾驭Google Wave前沿技术的开发人员可以从使用HTML, JavaScript, Java,和 Python写小组件和小工具开始。我写的第一个Wave bot是跟着这个一个下午时间的快速入门指导开始的。开发桌面上的Web应用程序学习编程最好的结果是你在一个环境下学的东西可以应用到另外的环境中。先学习开发web应用程序的好处就是我们有一些方法可以让web应用程序直接在桌面上运行。例如，Adobe AIR是一个跨平台的即时运行平台，它能让你编写的程序运行在任何装有AIR的操作系统的桌面上。 AIR应用程序都是由HTML, Flash,或 Flex写成的，所以它能让你的web程序在桌面环境中运行。 AIR是开发部署桌面应用程序的一个优秀的选择，就像我们提到过的10个让你值得去安装AIR的应用程序。移动应用开发能在iPhone或者Android智能手机上运行的手机应用程序的开发如今正呈现井喷之势，所以你也可以梦想一下如何在iTunes应用商店里通过你的天才程序大赚一笔。但是，作为一个编码新手，直接奔向移动开发所经历的学习曲线可能会很陡，因为它需要你熟悉高级的编程语言，例如Java和Objective C。然而，你当然应该看看iPhone和 Android编程究竟是什么样子的。阅读这个简单的iPhone应用开发例子可以初步认识一下iPhone程序的开发过程。 Android程序都是由Java写成的，这有一个简单的视频教程教你如何开发第一个”Hello Android“程序（注：可能需要代理才能看这个视频）。耐心，刻苦，尝试，失败好的程序员都有一个不达目的誓不罢休的品质，他们会惊喜于通过长期推敲和失败换来的一点成绩。学会编程会有很好的回报的，但是学习的过程可能会是饱受挫折和孤独的。如果有可能，最好找个伴一起陪你做这件事。想精通编程，这和其他事情一样，需要坚持，反复尝试，获得更多的经验。

OK，本文到此结束，希望对大家有所帮助。