第三次上课javascript.docx

《第三次上课javascript.docx》由会员分享，可在线阅读，更多相关《第三次上课javascript.docx（36页珍藏版）》请在冰豆网上搜索。

第三次上课javascript

javascript简介

javascript介绍

JavaScript是互联网上最流行的脚本语言，这门语言可用于HTML和web，更可广泛用于服务器、PC、笔记本电脑、平板电脑和智能手机等设备。

javascript因为兼容于ECMA标准，因此也称为ECMAScript。

JavaScript作为一种脚本语言，已经被广泛地应用于Web页面当中，通过嵌入HTML来实现各种酷炫的动态效果，为用户提供赏心悦目的浏览效果。

除此之外，也可以用于控制cookies以及基于Node.js技术进行服务器端编程。

javascript是甲骨文公司的注册商标，完整的JavaScript实现包含三个部分：

ECMAScript，文档对象模型和浏览器对象模型。

发展初期，JavaScript的标准并未确定，同期有Netscape的JavaScript，微软的JScript和CEnvi的ScriptEase三足鼎立。

1997年，在ECMA（欧洲计算机制造商协会）的协调下，由Netscape、Sun、微软、Borland组成的工作组确定统一标准：

ECMA-262。

JavaScript是脚本语言

JavaScript是一种轻量级的编程语言。

JavaScript是可插入HTML页面的编程代码。

JavaScript插入HTML页面后，可由所有的现代浏览器执行。

JavaScript很容易学习。

javascript应用

1.制作一些简单的小游戏，比如说象棋游戏、消除游戏、闯关游戏等等

**实例

3.利用javascript实现网页的前端逻辑

4.利用javascript实现移动应用的框架

JavaScript：

直接写入HTML输出流

JavaScript能够直接写入HTML输出流中：

您只能在HTML输出流中使用document.write。

如果您在文档已加载后使用它（比如在函数中），会覆盖整个文档。

JavaScript：

对事件的反应

我的第一个JavaScript

JavaScript能够对事件作出反应。

比如对按钮的点击：

'）">点我!

JavaScript：

改变HTML内容

我的第一段JavaScript

JavaScript能改变HTML元素的内容。

点击这里

JavaScript：

改变HTML样式

我的第一段JavaScript

JavaScript能改变HTML元素的样式。

点击这里

JavaScript用法

JavaScript用法

HTML中的脚本必须位于标签之间。

脚本可被放置在HTML页面的和部分中。

会告诉JavaScript在何处开始和结束。

之间的代码行包含了JavaScript:

您无需理解上面的代码。

只需明白，浏览器会解释并执行位于之间的JavaScript代码 

中的JavaScript

DOCTYPEhtml>

外部的JavaScript

也可以把脚本保存到外部文件中。

外部文件通常包含被多个网页使用的代码。

外部JavaScript文件的文件扩展名是.js。

如需使用外部文件，请在

JavaScript输出

JavaScript输出

JavaScript没有任何打印或者输出的函数。

JavaScript可以通过不同的方式来输出数据：

使用window.alert（）弹出警告框。

使用document.write（）方法将内容写到HTML文档中。

使用innerHTML写入到HTML元素。

使用console.log（）写入到浏览器的控制台。

使用window.alert（）

你可以弹出警告框来显示数据：

DOCTYPEhtml>

我的第一个页面

我的第一个段落。

操作HTML元素

如需从JavaScript访问某个HTML元素，您可以使用document.getElementById（id）方法。

请使用"id"属性来标识HTML元素，并innerHTML来获取或插入元素内容：

DOCTYPEhtml>

我的第一个Web页面

我的第一个段落。

以上JavaScript语句（在

请使用document.write（）仅仅向文档输出写内容。

如果在文档已完成加载后执行document.write，整个HTML页面将被覆盖。

写到控制台

如果您的浏览器支持调试，你可以使用console.log（）方法在浏览器中显示JavaScript值。

浏览器中使用F12来启用调试模式，在调试窗口中点击"Console"菜单。

DOCTYPEhtml>

我的第一个Web页面

浏览器中（Chrome,IE,Firefox）使用F12来启用调试模式，在调试窗口中点击"Console"菜单。

JavaScript语法

JavaScript语法

JavaScript是一个程序语言。

语法规则定义了语言结构。

JavaScript是一个脚本语言。

它是一个轻量级，但功能强大的编程语言。

JavaScript字面量

在编程语言中，一个字面量是一个常量，如3.14。

数字（Number）字面量 可以是整数或者是小数，或者是科学计数（e）。

**

1001

123e5

字符串（String）字面量可以使用单引号或双引号bewrittenwithdoubleorsinglequotes:

"JohnDoe"

'JohnDoe'

表达式字面量用于计算：

5+6

5*10

数组（Array）字面量定义一个数组：

[40,100,1,5,25,10]

对象（Object）字面量定义一个对象：

{firstName:

"John",lastName:

"Doe",age:

50,eyeColor:

"blue"}

函数（Function）字面量定义一个函数：

functionmyFunction（a,b）{returna*b;}

JavaScript变量

在编程语言中，变量用于存储数据值。

JavaScript使用关键字 var 来定义变量，使用等号来为变量赋值：

varx,length

x=5

length=6

变量可以通过变量名访问。

在指令式语言中，变量通常是可变的。

字面量是一个恒定的值。

变量是一个名称。

字面量是一个值。

JavaScript操作符

JavaScript使用算术运算符来计算值:

（5+6）*10

JavaScript使用赋值运算符给变量赋值

x=5

y=6

z=（x+y）*10

JavaScript语言有多种类型的运算符：

JavaScript关键词

JavaScript语句通常以关键词为开头。

 var 关键词告诉浏览器创建一个新的变量：

varx=5+6;

vary=x*10;

JavaScript标识符

和其他任何编程语言一样，JavaScript保留了一些标识符为自己所用。

JavaScript同样保留了一些关键字，这些关键字在当前的语言版本中并没有使用，但在以后JavaScript扩展中会用到。

JavaScript标识符必须以字母、下划线（_）或美元符（$）开始。

后续的字符可以是字母、数字、下划线或美元符（数字是不允许作为首字符出现的，以便JavaScript可以轻易区分开标识符和数字）。

以下是JavaScript中最​​重要的保留字（按字母顺序）：

JavaScript注释

JavaScript多行注释

多行注释以/*开始，以*/结尾。

下面的例子使用多行注释来解释代码：

/*

下面的这些代码会输出

一个标题和一个段落

并将代表主页的开始

*/

**（"myH1"）.innerHTML="欢迎来到我的主页";

**（"myP"）.innerHTML="这是我的第一个段落。

";

在行末使用注释

在下面的例子中，我们把注释放到代码行的结尾处：

varx=5;//声明x并把5赋值给它

vary=x+2;//声明y并把x+2赋值给它

JavaScript数据类型

JavaScript有多种数据类型：

数字，字符串，数组，对象等等：

varlength=16;//Number通过数字字面量赋值

varpoints=x*10;//Number通过表达式字面量赋值

varlastName="Johnson";//String通过字符串字面量赋值

varcars=["Saab","Volvo","BMW"];//Array通过数组字面量赋值

varperson={firstName:

"John",lastName:

"Doe"};//Object通过对象字面量赋值

JavaScript对大小写敏感。

JavaScript对大小写是敏感的。

当编写JavaScript语句时，请留意是否关闭大小写切换键。

函数getElementById与getElementbyID是不同的。

同样，变量myVariable与MyVariable也是不同的。

空格

JavaScript会忽略多余的空格。

您可以向脚本添加空格，来提高其可读性。

下面的两行代码是等效的：

varperson="Hege";

varperson="Hege";

JavaScript语句

JavaScript语法

avaScript语句是发给浏览器的命令。

这些命令的作用是告诉浏览器要做的事情。

下面的JavaScript语句向id="demo"的HTML元素输出文本"你好Dolly"：

**（"demo"）.innerHTML= "HelloDolly.";

我的网页

我的第一个段落。

分号;

分号用于分隔JavaScript语句。

通常我们在每条可执行的语句结尾添加分号。

使用分号的另一用处是在一行中编写多条语句。

a= 5;

b= 6;

c=a+b;

a= 5;b= 6;c=a+b;

**（"demo"）.innerHTML="你好Dolly";

document.getElementById（"myDIV"）.innerHTML="你最近怎么样?

";

JavaScript代码块

JavaScript可以分批地组合起来。

代码块以左花括号开始，以右花括号结束。

代码块的作用是一并地执行语句序列。

本例向网页输出一个标题和两个段落：

JavaScript代码

JavaScript代码是JavaScript语句的序列。

浏览器按照编写顺序依次执行每条语句。

本例向网页输出一个标题和两个段落：

JavaScript变量

JavaScript变量

变量是用于存储信息的"容器"。

varx=5;

vary=6;

varz=x+y;

就像代数那样

x=5

y=6

z=x+y

在代数中，我们使用字母（比如x）来保存值（比如5）。

通过上面的表达式z=x+y，我们能够计算出z的值为11。

在JavaScript中，这些字母被称为变量。

您可以把变量看做存储数据的容器。

与代数一样，JavaScript变量可用于存放值（比如x=5）和表达式（比如z=x+y）。

变量可以使用短名称（比如x和y），也可以使用描述性更好的名称（比如age,sum,totalvolume）。

变量必须以字母开头

变量也能以$和_符号开头（不过我们不推荐这么做）

变量名称对大小写敏感（y和Y是不同的变量）

JavaScript语句和JavaScript变量都对大小写敏感。

JavaScript数据类型

JavaScript变量还能保存其他数据类型，比如文本值（name="BillGates"）。

在JavaScript中，类似"BillGates"这样一条文本被称为字符串。

JavaScript变量有很多种类型，但是现在，我们只关注数字和字符串。

当您向变量分配文本值时，应该用双引号或单引号包围这个值。

当您向变量赋的值是数值时，不要使用引号。

如果您用引号包围数值，该值会被作为文本来处理。

varpi=3.14;

varperson="JohnDoe";

varanswer='YesIam!

';

声明（创建）JavaScript变量

在JavaScript中创建变量通常称为"声明"变量。

我们使用var关键词来声明变量：

varcarname;//variable

变量声明之后，该变量是空的（它没有值）。

如需向变量赋值，请使用等号：

carname="Volvo";

不过，您也可以在声明变量时对其赋值

varcarname="Volvo";

一个好的编程习惯是，在代码开始处，统一对需要的变量进行声明。

一条语句，多个变量

您可以在一条语句中声明很多变量。

该语句以var开头，并使用逗号分隔变量即可：

varlastname="Doe",age=30,job="carpenter";

声明也可横跨多行：

varlastname="Doe",

age=30,

job="carpenter";

Value=undefined

在计算机程序中，经常会声明无值的变量。

未使用值来声明的变量，其值实际上是undefined。

在执行过以下语句后，变量carname的值将是undefined：

varcarname;

重新声明JavaScript变量

如果重新声明JavaScript变量，该变量的值不会丢失：

在以下两条语句执行后，变量carname的值依然是"Volvo"：

varcarname="Volvo";

varcarname;

JavaScript数据类型

JavaScript数据类型

字符串（String）、数字（Number）、布尔（Boolean）、数组（Array）、对象（Object）、空（Null）、未定义（Undefined）。

JavaScript拥有动态类型

JavaScript拥有动态类型。

这意味着相同的变量可用作不同的类型：

varx;//x为undefined

varx=5;//现在x为数字

varx="John";//现在x为字符串

JavaScript字符串

字符串是存储字符（比如"BillGates"）的变量。

字符串可以是引号中的任意文本。

您可以使用单引号或双引号：

varcarname="VolvoXC60";

varcarname='VolvoXC60';

您可以在字符串中使用引号，只要不匹配包围字符串的引号即可：

varanswer="It'salright";

varanswer="Heiscalled'Johnny'";

varanswer='Heiscalled"Johnny"';

JavaScript数字

JavaScript只有一种数字类型。

数字可以带小数点，也可以不带：

varx1=34.00;//使用小数点来写

varx2=34;//不使用小数点来写

极大或极小的数字可以通过科学（指数）计数法来书写：

vary=123e5;     //12300000

varz=123e-5;    //0.00123

JavaScript布尔

布尔（逻辑）只能有两个值：

true或false。

varx=true;

vary=false;

JavaScri