搜索
JavaScript第一章JavaScript简介一、什么是JavaScript？•JavaScript最早是由NetscapeCommunication（网景）公司开发出来的一种客户端脚本语言。它是一种通用的、跨平台的、基于对象和事件驱动的解释型脚本语言。它的代码可以直接嵌入在HTML页面中，把静态页面变成支持用户交互并响应相应事件的动态页面。最初这种脚本语言只能在网景公司的浏览器—Navigator中使用。为了抢占浏览器市场，微软在其IE浏览器里也加入了对JavaScript的支持，从此JavaScript得到了广泛的支持。目前几乎所有的主流浏览器都支持JavaScript。二、JavaScript可以做什么？•对表单数据进行验证；例题1-1.html1-2.html•操作HTML文档（如读取文档内容，动态写入文本）；例题1-3.html1-4.html•对客户端事件进行响应；例题1-5.html•控制浏览器窗口（如打开新窗口，调整窗口大小等）；例题1-6.html•创建和读取Cookies；•实现网页特效，提供更好的用户体验。三、JavaScript不可以做什么？•JavaScript不允许写服务器上的文件；•JavaScript不可以关闭不是由它自己打开的窗口；•JavaScript不能读取已经打开的其他窗口中的信息；四、JavaScript的基本特点•解释性—JavaScript不同于一些编译性的语言，如C、C++等，它是一种解释性的语言，它的源代码不需要经过编译，而是在浏览器中运行时被解释。•基于对象—JavaScript是一种基与对象的语言，它内置了多种对象并允许用户自己创建对象。•事件驱动—JavaScript可以直接对用户的输入做出响应，无需经过Web服务程序，它对用户的响应，是以事件（如鼠标事件、键盘事件）驱动的方式进行的。•跨平台—JavaScript是一种跨平台的语言，它依赖于浏览器本身，与操作系统无关。只要计算机能运行浏览器，并且浏览器支持JavaScript就可执行。五、JavaScript的发展历史•1995年，就职于Netscape（网景）公司的布兰登·艾奇着手为即将发布的Navigator2开发一种脚本语言，命名为LiveScript。为了赶在发布日期前完成LiveScript的开发，Netscape与Sun公司建立了一个开发联盟。在Navigator2正式发布前夕，为了搭上当时媒体热炒的Java的顺风车，Netscape临时把LiveScript改名为JavaScript。•加入了JavaScript的Navigator2浏览器在市场上取得了巨大成功，1996年，微软公司决定在IE3.0中加入自己的脚本语言功能，它与Navigator2中的JavaScript非常类似，但微软将其命名为JScript。五、JavaScript的发展历史•微软推出Jscript，这意味着有了两个不同版本的JavaScript：Navigator中的JavaScript和IE中的Jscript。由于没有标准规定JavaScript的语法和特性，两个不同版本并存的局面暴露出各种问题，JavaScript的标准化被提上了议事日程。•1997年，以JavaScript1.1为蓝本的建议被提交给了欧洲及技术制造商协会（ECMA)，该协会指定39号技术委员会负责JavaScript的标准化工作。经过数月的努力，一种名为ECMAScript的脚本语言标准被定义完成，它被称为ECMA-262。五、JavaScript的发展历史•1998年，ISO/IEC（国际标准化组织和国际电工委员会）也采用了ECMAScript做为标准。自此以后，浏览器开发商就开始致力于将ECMAScript做为各自JavaScript实现的基础。六、JavaScript的构成一个完整的JavaScript实现由三个不同的部分组成：•核心（ECMAScript）•文档对象模型（DOM）•浏览器对象模型（BOM）ECMAScriptDOMBOMJavaScript六、JavaScript的构成•ECMAScript它规定了JavaScript这门语言的一些组成部分：语法、类型、语句、关键字、保留字、操作符、对象。它与WEB浏览器之间没有依赖关系。•DOM-文档对象模型是针对XML但经过扩展用于HTML的应用程序编程接口。DOM把整个页面映射为一个多层节点结构。六、JavaScript的构成DOM通过创建树来表示文档，从而使开发者对文档的内容和结构具有空前的控制力。用DOMAPI可以轻松地删除、添加和替换节点。htmlheadtitleSamplePagebodypHelloworld!htmlheadtitleSamplepage/title/headbodypHelloWorld!/p/body/html六、JavaScript的构成•BOM-浏览器对象模型可以对浏览器窗口进行访问和操作，由于没有相关的BOM标准，每种浏览器都有自己的BOM实现。这个问题在HTML5中得到了解决，HTML5致力于把很多BOM功能写入正式规范。主要实现：1、弹出新窗口2、移动、缩放和关闭浏览器窗口3、提供浏览器详细信息4、对Cookie的支持七、JavaScript的开发工具•JavaScript中可以使用的开发工具主要有两大类，一类是基本的文本编辑工具，一类是专业可视化开发工具。1.文本编辑工具：UltraEdit、EditPlus、Notepad++、记事本…2.可视化的集成开发工具：Dreamweaver、NetBeans…七、JavaScript的开发工具七、JavaScript的开发工具•调试JavaScript脚本Firefox中Firebug一款功能强大的JavaScript脚本调试器，它不仅可以调试JavaScript脚本，还具备了DOM查看、CSS可视化查看、HTTP监控等多种功能。例题1-7.html七、JavaScript的开发工具八、在HTML中使用JavaScript•编写第一个JavaScript程序例题1-8.html八、在HTML中使用JavaScript•script元素从上面的例子我们可以看出，在HTML页面中插入JavaScript的方法就是使用script元素。具体形式:八、在HTML中使用JavaScript•script元素在HTML页面中的放置位置传统的做法是将script元素放在页面的head元素中实际使用中，既可以将它放在head元素中，也可以将它放在body元素中。例题1-9.html八、在HTML中使用JavaScript•使用script元素的方式1、直接在HTML页面中嵌入JavaScript代码2、包含外部JavaScript文件例题1-10.html1-10.js八、在HTML中使用JavaScript•外部脚本的位置将JavaScript脚本放在文档的head元素中，意味着必须等到全部JavaScript代码被下载、解析、和执行完成以后，才能开始呈现页面的内容。对于那些需要很多JavaScript代码的页面来说，这无疑会导致浏览器呈现页面时出现明显的延迟，而延迟期间的浏览器窗口将是一片空白。为了避免这个问题，现代Web应用程序一般把全部JavaScript脚本放在body元素页面内容的后面。例题1-11.html1-10.js•知识扩充：1、事件驱动：用户与网页交互时产生的操作，称为事件。事件可以由用户引发，也可能是页面发生改变，甚至还有你看不见的事件（如Ajax的交互进度改变）。绝大部分事件都由用户的动作所引发，如：用户按鼠标的按键，就产生click事件，若鼠标的指针在链接上移动，就产生mouseover事件等等。在JavaScript中，事件往往与事件处理程序配套使用。三、JavaScript开发及运行环境1、开发环境：JavaScript是一种脚本语言，代码不需要变异成二进制，而是以文本的形式存在，因此任何文本编辑器都可以作为其开发环境，比如记事本（虽然很少人使用）、EditPlus、UltraEdit（UE）、Dreamweaver等。2、运行环境：JavaScript依赖于浏览器，即浏览器是JavaScript的运行环境。当前主流浏览器都能运行今后学习的JavaScript代码，若出现浏览器兼容问题，到时会请同学们注意。不同的编辑器会对语法进行简单的错误识别，不同的浏览器也提供对JavaScript程序的调试功能。问：还记得当前主流的浏览器吗？注意：一个页面中只要一个地方JavaScript语法错误，则整个JavaScript程序都不执行。为我们找错和调试带来了困难。第二节定义和使用JavaScript方式1、定义方式（1）嵌入HTML文件中一般放在head/head(事实上可以放在任何位置)中，格式：scripttype=text/javascript//此处为JavaScript代码/script（2）定义专门的外部文件将JavaScript代码写在一个独立的脚本文件（扩展名为.js)中，在页面中使用时直接导入该脚本文件即可，导入的格式：scripttype=text/javascriptsrc=要导入的js文件.js/script注意：不能这么写:scripttype=text/javascriptsrc=要导入的js文件.js/错误！必须有结束标签•知识扩充：除了上面两种最为常用的方式外，还可以在一下地方定义JavaScript代码：（1）在HTML的元素事件属性中比如，按钮的单击事件，代码：inputtype=buttononclick=javascript:js脚本代码/示例：（2）在超链接中定义语法：ahref=javascript:js脚本代码超链接/a示例：效果：2、一个简单的JavaScript的例子（1）嵌入到HTML文件中单击后显示的效果（2）定义专门的js文件A、定义一个扩展名为.js的文件，其中定义如下代码：B、定义一个HTML文件，导入该外部js文件，并调用js文件中的代码：C、单击“按钮”后，同样实现效果：三、作业1、在HTML嵌入一段JavaScript代码，并定义一个按钮，当点击按钮时，弹出“欢迎学习JavaScript”。2、将上题的JavaScript代码放在单独的js文件中，运行。第二章JavaScript语言基础一、对一些问题的说明：1、区分大小写：JavaScript中的变量、函数名和操作符都区分大小写，关键字不能做变量或函数名字。所以，test和Test是两个变量，typeof因是关键字所以不能是函数名或者变量名。2、标识符：就是变量、函数、属性、函数的参数等。规定：（1）第一个字符必须是字母、下划线(_)、美元符号（$）。（2）其他字符可以是字母、下划线、美元符号或数字。第一节：数据类型、变量和运算符3、注释：包括单行注释和多行注释。（1）单行注释：//如：//这是一个单行注释（2）多行注释/**/如：/**这是一个多行注释*/4、语句：JavaScript中语句以一个;结尾（英文分号）。但可以省略;。比如：注：分号虽不是必须的，但建议必须加上它，这样可以提高效率（解析器不必再花时间推测应该在哪里插入分号了）和避免错误。5、在控制语句中，单行语句可以不加{}（不放在代码块中），但强烈加上——即使代码块中只有一条语句。多行语句如果放在一个代码块中执行，必须加{}二、数据类型JavaScript是弱类型脚本语言，使用变量之前，无须定义，想使用某个变量时直接使用即可，JavaScript会根据需要自动确定数据类型和进行数据类型的转换，但每个变量还是要确定数据类型的。JavaScript中数据类型基本数据类型（简单数据类型）和复合数据类型（复杂数据类型）两类，不同大类下面又有自己的小类，如下表：大类数据类型说明基本数据类型数值