1简介
1、JavaScript 是脚本语言
1.1轻量级的编程语言
1.2可插入 HTML 页面的编程代码
1.3可由所有的现代浏览器执行
2、您将学到什么
2.1JavaScript：写入 HTML 输出
document.write("<h1>This is a heading</h1>");
document.write("<p>This is a paragraph</p>");
2.2JavaScript：对事件作出反应
<button type="button" onclick="alert('Welcome!')">点击这里</button>
2.3JavaScript：改变 HTML 内容
x=document.getElementById("demo") //查找元素
x.innerHTML="Hello JavaScript"; //改变内容
2.4JavaScript：改变 HTML 图像
2.5JavaScript：改变 HTML 样式
x=document.getElementById("demo") //找到元素
x.style.color="#ff0000"; //改变样式
2.6JavaScript：验证输入
if isNaN(x) {alert("Not Numeric")};
2实现
1、<script> 标签
1.1<script> 和 </script> 会告诉 JavaScript 在何处开始和结束。
<script>
alert("My First JavaScript");
</script>
2、JavaScript 函数和事件
2.1通常，我们需要在某个事件发生时执行代码，比如当用户点击按钮时。
如果我们把 JavaScript 代码放入函数中，就可以在事件发生时调用该函数。
2.2<head> 或 <body> 中的 JavaScript
3、外部的 JavaScript
3.1外部 JavaScript 文件的文件扩展名是 .js。
<!DOCTYPE html>
<html>
<body>
<script src="myScript.js"></script>
</body>
</html>
3输出
1、操作 HTML 元素
1.1如需从 JavaScript 访问某个 HTML 元素，您可以使用 document.getElementById(id) 方法。
<!DOCTYPE html>
<html>
<body>
<h1>My First Web Page</h1>
<p id="demo">My First Paragraph</p>
<script>
document.getElementById("demo").innerHTML="My First JavaScript";
</script>
</body>
</html>
2、写到文档输出
2.1下面的例子直接把 <p> 元素写到 HTML 文档输出中：
<!DOCTYPE html>
<html>
<body>
<h1>My First Web Page</h1>
<script>
document.write("<p>My First JavaScript</p>");
</script>
</body>
</html>
4语句
1、JavaScript 语句
1.1JavaScript 语句向浏览器发出的命令。语句的作用是告诉浏览器该做什么。
document.getElementById("demo").innerHTML="Hello World";
1.2分号用于分隔 JavaScript 语句。
2、JavaScript 代码
2.1JavaScript 代码（或者只有 JavaScript）是 JavaScript 语句的序列。
document.getElementById("demo").innerHTML="Hello World";
document.getElementById("myDIV").innerHTML="How are you?";
3、JavaScript 代码块
3.1JavaScript 语句通过代码块的形式进行组合。
3.2块由左花括号开始，由右花括号结束。
3.3块的作用是使语句序列一起执行。
function myFunction()
{
document.getElementById("demo").innerHTML="Hello World";
document.getElementById("myDIV").innerHTML="How are you?";
}
4、JavaScript 对大小写敏感。
5、空格
5.1JavaScript 会忽略多余的空格。
6、对代码行进行折行
6.1您可以在文本字符串中使用反斜杠对代码行进行换行。
document.write("Hello
World!");
5注释
1、JavaScript 注释
1.1我们可以添加注释来对 JavaScript 进行解释，或者提高代码的可读性。
1.2单行注释以 // 开头。
// 输出标题：
document.getElementById("myH1").innerHTML="Welcome to my Homepage";
// 输出段落：
document.getElementById("myP").innerHTML="This is my first paragraph.";
2、JavaScript 多行注释
2.1多行注释以 /* 开始，以 */ 结尾。
/*
下面的这些代码会输出
一个标题和一个段落
并将代表主页的开始
*/
document.getElementById("myH1").innerHTML="Welcome to my Homepage";
document.getElementById("myP").innerHTML="This is my first paragraph.";
3、使用注释来阻止执行
//document.getElementById("myH1").innerHTML="Welcome to my Homepage";
document.getElementById("myP").innerHTML="This is my first paragraph.";
/*
document.getElementById("myH1").innerHTML="Welcome to my Homepage";
document.getElementById("myP").innerHTML="This is my first paragraph.";
*/
4、在行末使用注释
var x=5; // 声明 x 并把 5 赋值给它
var y=x+2; // 声明 y 并把 x+2 赋值给它
6变量
1、变量是存储信息的容器。
var x=2;
var y=3;
var z=x+y;
2、JavaScript 变量
2.1变量可以使用短名称（比如 x 和 y），也可以使用描述性更好的名称（比如 age, sum, totalvolume）。
2.2变量必须以字母开头
2.3变量也能以 $ 和 _ 符号开头（不过我们不推荐这么做）
2.4变量名称对大小写敏感（y 和 Y 是不同的变量）
3、JavaScript 数据类型
3.1当您向变量分配文本值时，应该用双引号或单引号包围这个值。
3.2当您向变量赋的值是数值时，不要使用引号。如果您用引号包围数值，该值会被作为文本来处理。
var pi=3.14;
var name="Bill Gates";
var answer='Yes I am!';
4、声明（创建） JavaScript 变量
var carname="Volvo";
5、一条语句，多个变量
var name="Gates", age=56, job="CEO";
6、Value = undefined
6.1在计算机程序中，经常会声明无值的变量。未使用值来声明的变量，其值实际上是 undefined。
7、重新声明 JavaScript 变量
如果重新声明 JavaScript 变量，该变量的值不会丢失：
var carname="Volvo";
var carname;
8、JavaScript 算数
y=5;
x=y+2;
7数据类型
1、JavaScript 拥有动态类型
1.1这意味着相同的变量可用作不同的类型：
var x // x 为 undefined
var x = 6; // x 为数字
var x = "Bill"; // x 为字符串
2、JavaScript 字符串
2.1字符串是存储字符（比如 "Bill Gates"）的变量。
2.2字符串可以是引号中的任意文本。您可以使用单引号或双引号：
var carname="Bill Gates";
var carname='Bill Gates';
3、JavaScript 数字
3.1JavaScript 只有一种数字类型。
var x1=34.00; //使用小数点来写
var x2=34; //不使用小数点来写
var y=123e5; // 12300000
var z=123e-5; // 0.00123
4、JavaScript 布尔
4.1布尔（逻辑）只能有两个值：true 或 false。
var x=true
var y=false
5、JavaScript 数组
var cars=new Array("Audi","BMW","Volvo");
6、JavaScript 对象
6.1对象由花括号分隔。在括号内部，对象的属性以名称和值对的形式 (name : value) 来定义。属性由逗号分隔：
var person={firstname:"Bill", lastname:"Gates", id:5566};
7、Undefined 和 Null
7.1Undefined 这个值表示变量不含有值。
7.2可以通过将变量的值设置为 null 来清空变量。
cars=null;
person=null;
8、声明变量类型
8.1当您声明新变量时，可以使用关键词 "new" 来声明其类型：
var carname=new String;
var x= new Number;
var y= new Boolean;
var cars= new Array;
var person= new Object;
8对象
1、属性和方法
1.1属性是与对象相关的值。
1.2方法是能够在对象上执行的动作。
2、JavaScript 中的对象
2.1在 JavaScript 中，对象是数据（变量），拥有属性和方法。
3、创建 JavaScript 对象
3.1JavaScript 中的几乎所有事务都是对象：字符串、数字、数组、日期、函数，等等。
4、访问对象的属性
objectName.propertyName
5、访问对象的方法
objectName.methodName()
9函数
函数是由事件驱动的或者当它被调用时执行的可重复使用的代码块。
1、JavaScript 函数语法
1.1函数就是包裹在花括号中的代码块，前面使用了关键词 function：
function functionname()
{
这里是要执行的代码
}
2、调用带参数的函数
myFunction(argument1,argument2)
3、带有返回值的函数
function myFunction()
{
var x=5;
return x;
}
4、局部 JavaScript 变量
4.1在 JavaScript 函数内部声明的变量（使用 var）是局部变量，所以只能在函数内部访问它。
5、全局 JavaScript 变量
5.1在函数外声明的变量是全局变量，网页上的所有脚本和函数都能访问它。
6、JavaScript 变量的生存期
6.1JavaScript 变量的生命期从它们被声明的时间开始。
6.2局部变量会在函数运行以后被删除。
6.3全局变量会在页面关闭后被删除。
7、向未声明的 JavaScript 变量来分配值
7.1如果您把值赋给尚未声明的变量，该变量将被自动作为全局变量声明。
carname="Volvo";
10运算符
1、运算符 = 用于赋值。
运算符 + 用于加值。
y=5;
z=2;
x=y+z;
2、JavaScript 算术运算符
2.1算术运算符用于执行变量与/或值之间的算术运算。
运算符描述例子结果+加x=y+2x=7-减x=y-2x=3*乘x=y*2x=10/除x=y/2x=2.5%求余数 (保留整数)x=y%2x=1++累加x=++yx=6--递减x=--yx=4
3、JavaScript 赋值运算符
3.1赋值运算符用于给 JavaScript 变量赋值。
运算符例子等价于结果=x=y x=5+=x+=yx=x+yx=15-=x-=yx=x-yx=5*=x*=yx=x*yx=50/=x/=yx=x/yx=2%=x%=yx=x%yx=0
4、用于字符串的 + 运算符
4.1+ 运算符用于把文本值或字符串变量加起来（连接起来）。
txt1="What a very";
txt2="nice day";
txt3=txt1+txt2;
5、对字符串和数字进行加法运算
x=5+5;
document.write(x);
x="5"+"5";
document.write(x);
x=5+"5";
document.write(x);
x="5"+5;
document.write(x);
如果把数字与字符串相加，结果将成为字符串。
11比较
1、比较运算符
1.1比较运算符在逻辑语句中使用，以测定变量或值是否相等。
运算符描述例子==等于x==8 为 false===全等（值和类型）x===5 为 true；x==="5" 为 false!=不等于x!=8 为 true>大于x>8 为 false<小于x<8 为 true>=大于或等于x>=8 为 false<=小于或等于x<=8 为 true
2、如何使用
2.1可以在条件语句中使用比较运算符对值进行比较，然后根据结果来采取行动：
if (age<18) document.write("Too young");
3、逻辑运算符
3.1逻辑运算符用于测定变量或值之间的逻辑。
运算符描述例子&&and(x < 10 && y > 1) 为 true||or(x==5 || y==5) 为 false!not!(x==y) 为 true
4、条件运算符
variablename=(condition)?value1:value2
12If...Else 语句
1、条件语句
1.1通常在写代码时，您总是需要为不同的决定来执行不同的动作。
1.2在 JavaScript 中，我们可使用以下条件语句：
if 语句 - 只有当指定条件为 true 时，使用该语句来执行代码
if...else 语句 - 当条件为 true 时执行代码，当条件为 false 时执行其他代码
if...else if....else 语句 - 使用该语句来选择多个代码块之一来执行
switch 语句 - 使用该语句来选择多个代码块之一来执行
2、If 语句
2.1只有当指定条件为 true 时，该语句才会执行代码。
if (条件)
{
只有当条件为 true 时执行的代码
}
3、If...else 语句
3.1请使用 if....else 语句在条件为 true 时执行代码，在条件为 false 时执行其他代码。
if (条件)
{
当条件为 true 时执行的代码
}
else
{
当条件不为 true 时执行的代码
}
4、If...else if...else 语句
4.1使用 if....else if...else 语句来选择多个代码块之一来执行。
if (条件 1)
{
当条件 1 为 true 时执行的代码
}
else if (条件 2)
{
当条件 2 为 true 时执行的代码
}
else
{
当条件 1 和 条件 2 都不为 true 时执行的代码
}
13Switch 语句
1、JavaScript Switch 语句
1.1请使用 switch 语句来选择要执行的多个代码块之一。
switch(n)
{
case 1:
执行代码块 1
break;
case 2:
执行代码块 2
break;
default:
n 与 case 1 和 case 2 不同时执行的代码
}
2、default 关键词
2.1请使用 default 关键词来规定匹配不存在时做的事情：
var day=new Date().getDay();
switch (day)
{
case 6:
x="Today it's Saturday";
break;
case 0:
x="Today it's Sunday";
break;
default:
x="Looking forward to the Weekend";
}
14For
1、JavaScript 循环
1.1如果您希望一遍又一遍地运行相同的代码，并且每次的值都不同，那么使用循环是很方便的。
for (var i=0;i<cars.length;i++)
{
document.write(cars[i] + "<br>");
}
2、不同类型的循环
2.1JavaScript 支持不同类型的循环：
for - 循环代码块一定的次数
for/in - 循环遍历对象的属性
while - 当指定的条件为 true 时循环指定的代码块
do/while - 同样当指定的条件为 true 时循环指定的代码块
3、For 循环
3.1for 循环是您在希望创建循环时常会用到的工具。
for (语句 1; 语句 2; 语句 3)
{
被执行的代码块
}
语句 1 在循环（代码块）开始前执行
语句 2 定义运行循环（代码块）的条件
语句 3 在循环（代码块）已被执行之后执行
4、语句 1
4.1通常我们会使用语句 1 初始化循环中所用的变量 (var i=0)。
5、语句 2
5.1通常语句 2 用于评估初始变量的条件。
5.2如果语句 2 返回 true，则循环再次开始，如果返回 false，则循环将结束。
6、语句 3
6.1通常语句 3 会增加初始变量的值。
7、For/In 循环
7.1JavaScript for/in 语句循环遍历对象的属性：
var person={fname:"John",lname:"Doe",age:25};
for (x in person)
{
txt=txt + person[x];
}
15While
1、while 循环
1.1While 循环会在指定条件为真时循环执行代码块。
while (条件)
{
需要执行的代码
}
2、do/while 循环
2.1do/while 循环是 while 循环的变体。该循环会执行一次代码块，在检查条件是否为真之前，然后如果条件为真的话，就会重复这个循环。
do
{
需要执行的代码
}
while (条件);
16Break
1、Break 语句
1.1break 语句可用于跳出循环。
1.2break 语句跳出循环后，会继续执行该循环之后的代码（如果有的话）：
for (i=0;i<10;i++)
{
if (i==3)
{
break;
}
x=x + "The number is " + i + "<br>";
}
2、Continue 语句
2.1continue 语句中断循环中的迭代，如果出现了指定的条件，然后继续循环中的下一个迭代。
for (i=0;i<=10;i++)
{
if (i==3) continue;
x=x + "The number is " + i + "<br>";
}
17错误
try 语句测试代码块的错误。
catch 语句处理错误。
throw 语句创建自定义错误。
1、错误一定会发生
1.1当 JavaScript 引擎执行 JavaScript 代码时，会发生各种错误。
2、JavaScript 抛出错误
2.1当错误发生时，当事情出问题时，JavaScript 引擎通常会停止，并生成一个错误消息。
3、JavaScript 测试和捕捉
3.1try 语句允许我们定义在执行时进行错误测试的代码块。
3.2catch 语句允许我们定义当 try 代码块发生错误时，所执行的代码块。
3.3JavaScript 语句 try 和 catch 是成对出现的。
try
{
//在这里运行代码
}
catch(err)
{
//在这里处理错误
}
4、Throw 语句
4.1throw 语句允许我们创建自定义错误。
4.2正确的技术术语是：创建或抛出异常（exception）。
throw exception
18验证
1、JavaScript 表单验证
1.1JavaScript 可用来在数据被送往服务器前对 HTML 表单中的这些输入数据进行验证。
1.2被 JavaScript 验证的这些典型的表单数据有：
用户是否已填写表单中的必填项目？
用户输入的邮件地址是否合法？
用户是否已输入合法的日期？
用户是否在数据域 (numeric field) 中输入了文本？
2、必填（或必选）项目
2.1下面的函数用来检查用户是否已填写表单中的必填（或必选）项目。
function validate_required(field,alerttxt)
{
with (field)
{
if (value==null||value=="")
{alert(alerttxt);return false}
else {return true}
}
}
3、E-mail 验证
3.1下面的函数检查输入的数据是否符合电子邮件地址的基本语法。
function validate_email(field,alerttxt)
{
with (field)
{
apos=value.indexOf("@")
dotpos=value.lastIndexOf(".")
if (apos<1||dotpos-apos<2)
{alert(alerttxt);return false}
else {return true}
}
}