javaScript 的用法
HTML 中的脚本必须位于 <script> 与 </script> 标签之间。
脚本可被放置在 HTML 页面的 <body> 和 <head> 部分中。
如需在 HTML 页面中插入 JavaScript，请使用 <script> 标签。
JavaScript 函数和事件
通常，我们需要在某个事件发生时执行代码，比如当用户点击按钮时。
如果我们把 JavaScript 代码放入函数中，就可以在事件发生时调用该函数。
在 <head> 或者 <body> 的JavaScript
常的做法是把函数放入 <head> 部分中，或者放在页面底部。这样就可以把它们安置到同一处位置，不会干扰页面的内容。
JavaScript 输出
使用 window.alert()
<script>
window.alert(5 + 6);
</script>
如需从 JavaScript 访问某个 HTML 元素，您可以使用 document.getElementById(id) 方法。
<script>
document.getElementById("demo").innerHTML = "段落已修改。";
</script>
请使用 document.write() 仅仅向文档输出写内容。
如果在文档已完成加载后执行 document.write，整个 HTML 页面将被覆盖。
JavaScript 语法
在编程语言中，一般固定值称为字面量，如 3.14。
字符串（String）字面量 可以使用单引号或双引号:
表达式字面量 用于计算：
数组（Array）字面量 定义一个数组：
[40, 100, 1, 5, 25, 10]
对象（Object）字面量 定义一个对象：
{firstName:"John", lastName:"Doe", age:50, eyeColor:"blue"}
函数（Function）字面量 定义一个函数：
function myFunction(a, b) { return a * b;}
JavaScript 使用关键字 var 来定义变量， 使用等号来为变量赋值：
JavaScript使用 算术运算符 来计算值:
(5 + 6) * 10
JavaScript 关键字
JavaScript 关键字用于标识要执行的操作。
和其他任何编程语言一样，JavaScript 保留了一些关键字为自己所用。
是所有的 JavaScript 语句都是"命令"。双斜杠 // 后的内容将会被浏览器忽略：
JavaScript 语句
通常我们在每条可执行的语句结尾添加分号。
实例:
a = 5; b = 6; c = a + b;
JavaScript 代码块
JavaScript 可以分批地组合起来。
代码块以左花括号开始，以右花括号结束。
实例
function myFunction()
{
document.getElementById("demo").innerHTML="你好Dolly";
document.getElementById("myDIV").innerHTML="你最近怎么样?";
}
JavaScript 语句标识符
| 语句 | 描述 |
|---|---|
| break | 用于跳出循环。 |
| catch | 语句块，在 try 语句块执行出错时执行 catch 语句块。 |
| continue | 跳过循环中的一个迭代。 |
| do ... while | 执行一个语句块，在条件语句为 true 时继续执行该语句块。 |
| for | 在条件语句为 true 时，可以将代码块执行指定的次数。 |
| for ... in | 用于遍历数组或者对象的属性（对数组或者对象的属性进行循环操作）。 |
| function | 定义一个函数 |
| if ... else | 用于基于不同的条件来执行不同的动作。 |
| return | 退出函数 |
| switch | 用于基于不同的条件来执行不同的动作。 |
| throw | 抛出（生成）错误 。 |
| try | 实现错误处理，与 catch 一同使用。 |
| var | 声明一个变量。 |
| while | 当条件语句为 true 时，执行语句块。 |
| JavaScript 会忽略多余的空格。您可以向脚本添加空格，来提高其可读性。 |
JavaScript 注释
单行注释以 // 开头。
多行注释以 /* 开始，以 */ 结尾。
使用注释来阻止执行：// document.getElementById("myH1").innerHTML="欢迎来到我的主页";
JavaScript 变量
- 变量必须以字母开头
- 变量也能以 $ 和 _ 符号开头（不过我们不推荐这么做）
- 变量名称对大小写敏感（y 和 Y 是不同的变量）
在 JavaScript 中，类似 "Bill Gates" 这样一条文本被称为字符串。
您可以在一条语句中声明很多变量。该语句以 var 开头，并使用逗号分隔变量即可：
var lastname="Doe", age=30, job="carpenter";
JavaScript 数据类型
字符串（String）、数字(Number)、布尔(Boolean)、数组(Array)、对象(Object)、空（Null）、未定义（Undefined）
JavaScript 拥有动态类型。这意味着相同的变量可用作不同的类型：
var x; // x 为 undefined
var x = 5; // 现在 x 为数字
var x = "John"; // 现在 x 为字符串
JavaScript 数组
下面的代码创建名为 cars 的数组：
var cars=new Array();
cars[0]="Saab";
cars[1]="Volvo";
cars[2]="BMW";
或者 (condensed array):
var cars=new Array("Saab","Volvo","BMW");
对象由花括号分隔。在括号内部，对象的属性以名称和值对的形式 (name : value) 来定义。属性由逗号分隔：
var person={firstname:"John", lastname:"Doe", id:5566};
对象属性有两种寻址方式：
实例
name=person.lastname;
name=person["lastname"];
Undefined 这个值表示变量不含有值。
可以通过将变量的值设置为 null 来清空变量。
实例
cars=null;
person=null;
JavaScript 对象
在 JavaScript中，几乎所有的事物都是对象。
对象也是一个变量，但对象可以包含多个值（多个变量）。
var car = {type:"Fiat", model:500, color:"white"};
可以说 "JavaScript 对象是变量的容器"。
但是，我们通常认为 "JavaScript 对象是键值对的容器"。
键值对通常写法为 name : value (键与值以冒号分割)。
键值对在 JavaScript 对象通常称为 对象属性。
对象的方法定义了一个函数，并作为对象的属性存储。
对象方法通过添加 () 调用 (作为一个函数)。
<script>
var person = {
firstName: "John",
lastName : "Doe",
id : 5566,
fullName : function()
{
return this.firstName + " " + this.lastName;
}
};
document.getElementById("demo").innerHTML = person.fullName();
</script>
JavaScript 函数
函数就是包裹在花括号中的代码块，前面使用了关键词 function：
function functionname()
{
执行代码
}
当调用该函数时，会执行函数内的代码。
可以在某事件发生时直接调用函数（比如当用户点击按钮时），并且可由 JavaScript 在任何位置进行调用。
在调用函数时，您可以向其传递值，这些值被称为参数。
这些参数可以在函数中使用。您可以发送任意多的参数，由逗号 (,) 分隔：
myFunction(argument1,argument2)
实例
<p>点击这个按钮，来调用带参数的函数。</p> <button onclick="myFunction('Harry Potter','Wizard')">点击这里</button> <script> function myFunction(name,job){ alert("Welcome " + name + ", the " + job); } </script>
有时，我们会希望函数将值返回调用它的地方。
通过使用 return 语句就可以实现。
语法
function myFunction()
{
var x=5;
return x;
}
在 JavaScript 函数内部声明的变量（使用 var）是局部变量，所以只能在函数内部访问它。
在函数外声明的变量是全局变量，网页上的所有脚本和函数都能访问它。
如果您把值赋给尚未声明的变量，该变量将被自动作为 window 的一个属性。
这条语句：
carname="Volvo";
JavaScript 作用域
局部变量：只能在函数内部访问。
局部变量在函数开始执行时创建，函数执行完后局部变量会自动销毁。
全局变量有 全局作用域: 网页中所有脚本和函数均可使用。
如果变量在函数内没有声明（没有使用 var 关键字），该变量为全局变量。
// 此处可调用 carName 变量 function myFunction() { carName = "Volvo"; // 此处可调用 carName 变量 }
局部变量在函数执行完毕后销毁。
全局变量在页面关闭后销毁。
在 HTML 中, 全局变量是 window 对象: 所有数据变量都属于 window 对象。
JavaScript 事件
- HTML 页面完成加载
- HTML input 字段改变时
- HTML 按钮被点击
在以下实例中，按钮元素中添加了 onclick 属性 (并加上代码):
实例
<button onclick="getElementById('demo').innerHTML=Date()">现在的时间是?</button>
下面是一些常见的HTML事件的列表:
| 事件 | 描述 |
|---|---|
| onchange | HTML 元素改变 |
| onclick | 用户点击 HTML 元素 |
| onmouseover | 用户在一个HTML元素上移动鼠标 |
| onmouseout | 用户从一个HTML元素上移开鼠标 |
| onkeydown | 用户按下键盘按键 |
| onload | 浏览器已完成页面的加载 |
事件可以用于处理表单验证，用户输入，用户行为及浏览器动作:
- 页面加载时触发事件
- 页面关闭时触发事件
- 用户点击按钮执行动作
- 验证用户输入内容的合法性
- 等等 ...
可以使用多种方法来执行 JavaScript 事件代码：
- HTML 事件属性可以直接执行 JavaScript 代码
- HTML 事件属性可以调用 JavaScript 函数
- 你可以为 HTML 元素指定自己的事件处理程序
- 你可以阻止事件的发生。
- 等等 ...