实验03 HTML5中JavaScript和事件_第1页
实验03 HTML5中JavaScript和事件_第2页
实验03 HTML5中JavaScript和事件_第3页
实验03 HTML5中JavaScript和事件_第4页
实验03 HTML5中JavaScript和事件_第5页
已阅读5页，还剩25页未读， 继续免费阅读

下载本文档

版权说明：本文档由用户提供并上传，收益归属内容提供方，若内容存在侵权，请进行举报或认领

文档简介

实验03HTML5中JavaScript和事件广州大学华软软件学院概述JavaScript简称js，是一种可以嵌入到HTML页面中的脚本语言，HTML5提供的很多API都可以在JavaScript程序中调用，因此学习JavaScript编程是阅读本书后面内容的基础。本章知识点1在HTML中使用JavaScript语言2基本语法3常用语句4函数5面向对象程序设计6JavaScript事件处理1在HTML中使用JavaScript语言1.1在HTML中插入JavaScript代码1.2使用js文件1.1在HTML中插入JavaScript代码在HTML文件中使用JavaScript脚本时，JavaScript代码需要出现在<ScriptLanguage="JavaScript">和</Script>之间。在JavaScript中，使用//作为注释符。浏览器在解释程序时，将不考虑一行程序中//后面的代码。1.1在HTML中插入JavaScript代码【例2-1】一个简单的在HTML文件中使用JavaScript脚本实例。<HTML><HEAD><TITLE>简单的JavaScript代码</TITLE></HEAD><BODY><ScriptLanguage="JavaScript">//下面是JavaScript代码

document.write("这是一个简单的JavaScript程序!");

document.close();</Script></BODY></HTML>【例2-1】

1.2使用js文件另外一种插入JavaScript程序的方法是把JavaScript代码写到一个.js文件当中，然后在HTML文件中引用该js文件，方法如下：<scriptsrc=".js文件"></script>【例2-2】使用引用js文件的方法实现【例2-1】的功能。创建output.js，内容如下：

document.write("这是一个简单的JavaScript程序!");

document.close();HTML文件的代码如下：<HTML><HEAD><TITLE>简单的JavaScript代码</TITLE></HEAD><BODY><Scriptsrc="output.js"></Script></BODY></HTML>2基本语法2.1数据类型2.2变量2.3注释2.4运算符2.1数据类型JavaScript包含5种原始数据类型

类型具体描述Undefined当声明的变量未初始化时，该变量的默认值是undefinedNull空值，如果引用一个没有定义的变量，则返回空值Boolean布尔类型，包含true和falseString字符串类型，由单引号或双引号括起来的字符Number数值类型，可以是32位、64位整数或浮点数2.2变量变量是内存中命名的存储位置，可以在程序中设置和修改变量的值。在JavaScript中，可以使用var关键字声明变量，声明变量时不要求指明变量的数据类型。例如：varx;也可以在定义变量时为其赋值，例如：varx=1;或者不定义变量，而通过使用变量来确定其类型，例如：x=1;str="Thisisastring";exist=false;JavaScript变量名需要遵守两条简单的规则：

第一个字符必须是字母、下划线（_）或美元符号（$）；其他字符可以是下划线、美元符号或任何字母或数字字符。typeof运算符可以使用typeof运算符返回变量的类型，语法如下：typeof

变量名【例2-3】演示使用typeof运算符返回变量类型的方法，代码如下：vartemp;document.write(typeoftemp); //输出"undefined"temp="teststring";document.write(typeoftemp);//输出"String"temp=100;document.write(typeoftemp);//输出"Number"2.3注释1．//可以嵌套//是单行注释符，这种注释符可与要执行的代码处在同一行，也可另起一行。从//开始到行尾均表示注释。对于多行注释，必须在每个注释行的开始使用//。【例2-3】中已经演示了//注释符的使用方法。2./*...*/不可以嵌套/*...*/是多行注释符，…表示注释的内容。这种注释字符可与要执行的代码处在同一行，也可另起一行，甚至用在可执行代码内。对于多行注释，必须使用开始注释符（/*）开始注释，使用结束注释符（*/）结束注释。注释行上不应出现其他注释字符。【例2-4】

使用/*...*/给【例2-3】添加注释。/*一个简单的JavaScript程序,演示使用typeof运算符返回变量类型的方法作者：启明星日期：2012-11-25*/vartemp;document.write(typeoftemp);/*输出"undefined"*/temp="teststring";document.write(typeoftemp);/*输出"String"*/temp=100;document.write(typeoftemp);/*输出"Number"*/2.4运算符（略）运算符可以指定变量和值的运算操作，是构成表达式的重要元素。JavaScript支持一元运算符、算术运算符、位运算符、关系运算符、条件运算符、赋值运算符、逗号运算符等基本运算符。3常用语句(略)

3.1条件分支语句3.2循环语句4函数4.1创建自定义函数4.2调用函数4.3变量的作用域4.4函数的返回值4.1创建自定义函数可以使用function关键字来创建自定义函数，其基本语法结构如下：function函数名(参数列表){

函数体}参数列表可以为空，即没有参数；也可以包含多个参数，参数之间使用逗号（,）分隔。函数体可以是一条语句，也可以由一组语句组成。【例2-15】创建一个非常简单的函数PrintWelcome，它的功能是打印字符串“欢迎使用JavaScript”，代码如下：functionPrintWelcome(){

document.write("欢迎使用JavaScript");}【例2-16】创建函数PrintString()，通过参数决定要打印的内容。functionPrintString(str){

document.write(str);}【例2-17】定义一个函数sum()，用于计算并打印两个参数之和。函数sum()包含两个参数。参数$num1和$num2，代码如下：functionsum(num1,num2){

document.write(num1+num2);}4.2调用函数可以直接使用函数名来调用函数，无论是系统函数还是自定义函数，调用函数的方法都是一致的。【例2-18】要调用PrintWelcome()函数，显示“欢迎使用JavaScript”字符串，代码如下：<HTML><HEAD><TITLE>【例2-18】</TITLE></HEAD><BODY><ScriptLanguage="JavaScript"> functionPrintWelcome() {

document.write("欢迎使用JavaScript"); }

PrintWelcome();</Script></BODY></HTML>如果函数存在参数，则在调用函数时，也需要使用参数【例2-19】要调用PrintString()函数，打开用户指定的字符串，代码如下：<HTML><HEAD><TITLE>【例2-19】</TITLE></HEAD><BODY><ScriptLanguage="JavaScript"> functionPrintString(str) {

document.write(str); }

PrintString("传递参数");</Script></BODY></HTML>【例2-20】调用sum()函数，计算并打印1和2之和，代码如下：<HTML><HEAD><TITLE>【例2-20】</TITLE></HEAD><BODY><ScriptLanguage="JavaScript"> functionsum(num1,num2) {

document.write(num1+num2); } sum(1,2);</Script></BODY></HTML>4.3变量的作用域在函数中也可以定义变量，在函数中定义的变量被称为局部变量。局部变量只在定义它的函数内部有效，在函数体之外，即使使用同名的变量，也会被看作是另一个变量。相应地，在函数体之外定义的变量是全局变量。全局变量在定义后的代码中都有效，包括它后面定义的函数体内。如果局部变量和全局变量同名，则在定义局部变量的函数中，只有局部变量是有效的。【例2-21】局部变量和全局变量作用域的例子<HTML><HEAD><TITLE>【例2-21】</TITLE></HEAD><BODY><ScriptLanguage="JavaScript">

vara=100; //全局变量

functionsetNumber(){

vara=10; //局部变量

document.writ

人人文库> 全部分类> 教育资料 > 课件下载

温馨提示

  • 1. 本站所有资源如无特殊说明，都需要本地电脑安装OFFICE2007和PDF阅读器。图纸软件为CAD,CAXA,PROE,UG,SolidWorks等.压缩文件请下载最新的WinRAR软件解压。
  • 2. 本站的文档不包含任何第三方提供的附件图纸等，如果需要附件，请联系上传者。文件的所有权益归上传用户所有。
  • 3. 本站RAR压缩包中若带图纸，网页内容里面会有图纸预览，若没有图纸预览就没有图纸。
  • 4. 未经权益所有人同意不得将文件中的内容挪作商业或盈利用途。
  • 5. 人人文库网仅提供信息存储空间，仅对用户上传内容的表现方式做保护处理，对用户上传分享的文档内容本身不做任何修改或编辑，并不能对任何下载内容负责。
  • 6. 下载文件中如有侵权或不适当内容，请与我们联系，我们立即纠正。
  • 7. 本站不保证下载资源的准确性、安全性和完整性, 同时也不承担用户因使用这些下载资源对自己和他人造成任何形式的伤害或损失。

最新文档

评论

0/150

提交评论