01 直接输出文本

document.write("<h1>这是一个标题</h1>"); //直接写入 HTML 输出流

02 对事件的反应

<button type="button" onclick="alert('欢迎!')">点我!</button>

03 改变 HTML 内容

// 您会经常看到 document.getElementById("some id")。这个方法是 HTML DOM 中定义的。
// DOM (Document Object Model)（文档对象模型）是用于访问 HTML 元素的正式 W3C 标准。
<p id="demo">
JavaScript 能改变 HTML 元素的内容。
</p>
<script>
function myFunction()
{
    x=document.getElementById("demo");  // 找到元素
    x.innerHTML="Hello JavaScript!";    // 改变内容
    x.style.color="#ff0000";            // 改变样式
}
</script>
<button type="button" onclick="myFunction()">点击这里</button>

04 验证输入, JavaScript 常用于验证用户的输入。

<input id="demo" type="text">
<script>
function myFunction()
{
    var x=document.getElementById("demo").value;
    if(x==""||isNaN(x))
    {
        alert("不是数字");
    }
}
</script>
<button type="button" onclick="myFunction()">点击这里</button>

05 JavaScript 用法

// 如需在 HTML 页面中插入 JavaScript，请使用 <script> 标签。脚本可被放置在 HTML 页面的 <body> 和 <head> 部分中。
// 那些老旧的实例可能会在 <script> 标签中使用 type="text/javascript"。现在已经不必这样做了。JavaScript 是所有现代浏览器以及 HTML5 中的默认脚本语言。
// <body> 中的 JavaScript
<!DOCTYPE html>
<html>
<body>
.
.
<script>
document.write("<h1>这是一个标题</h1>");
document.write("<p>这是一个段落</p>");
</script>
.
.
</body>
</html>

通常的做法是把函数放入部分中，或者放在页面底部。这样就可以把它们安置到同一处位置，不会干扰页面的内容。

//<head> 中的 JavaScript 函数
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"> 
<title>菜鸟教程(runoob.com)</title> 
<script>
function myFunction(){
    document.getElementById("demo").innerHTML="我的第一个 JavaScript 函数";
}
</script>
</head>
<body>
    
<h1>我的 Web 页面</h1>
<p id="demo">一个段落。</p>
<button type="button" onclick="myFunction()">点击这里</button>
    
</body>
</html>

外部的 JavaScript, 也可以把脚本保存到外部文件中。外部文件通常包含被多个网页使用的代码。

<!DOCTYPE html>
<html>
<head> 
<meta charset="utf-8"> 
<title>菜鸟教程(runoob.com)</title> 
</head>
<body>
    
<h1>我的 Web 页面</h1>
<p id="demo">一个段落。</p>
<button type="button" onclick="myFunction()">点击这里</button>
<p><b>注释：</b>myFunction 保存在名为 "myScript.js" 的外部文件中。</p>
<script src="myScript.js"></script>
    
</body>
</html>

myScript.js中代码，外部脚本不能包含 <script> 标签。：

function myFunction() {
    document.getElementById("demo").innerHTML="我的第一个 JavaScript 函数";
}

06 JavaScript 输出

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

使用 window.alert() 弹出警告框。

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

使用 innerHTML 写入到 HTML 元素。

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

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>菜鸟教程(runoob.com)</title>
</head>
<body>
<h1>我的第一个页面</h1>
<p>我的第一个段落。</p>
<script>
    //window.alert(5 + 6);
    document.write(3-6);
    a = 5;
    b = 6;
    c = a + b;
    console.log(c);
</script>
</body>
</html>

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

document.getElementById("demo") 是使用 id 属性来查找 HTML 元素的 JavaScript 代码。

innerHTML = "段落已修改。" 是用于修改元素的 HTML 内容(innerHTML)的 JavaScript 代码。

<p id="demo">我的第一个段落</p>
<script>
document.getElementById("demo").innerHTML = "段落已修改。";
</script>

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

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

<!DOCTYPE html>
<html>
<head> 
<meta charset="utf-8"> 
<title>菜鸟教程(runoob.com)</title> 
</head>
<body>

    
<h1>我的第一个 Web 页面</h1>
<p>我的第一个段落。</p>
<button onclick="myFunction()">点我</button>
<script>
function myFunction() 
{
    document.write(Date());
}
</script>
    
</body>
</html>

运行整个页面会变成：Tue Mar 07 2017 10:14:41 GMT+0800 (中国标准时间)

07 JavaScript 语法

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

3.14

1001

123e5

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

"John Doe"

'John Doe'

数组（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 来定义变量，使用等号来为变量赋值：

var x, length
x = 5
length = 6

JavaScript 数据类型：数字，字符串，数组，对象等等：

var length = 16;                                  // Number 通过数字字面量赋值 
var points = x * 10;                              // Number 通过表达式字面量赋值
var lastName = "Johnson";                         // String 通过字符串字面量赋值
var cars = ["Saab", "Volvo", "BMW"];              // Array  通过数组字面量赋值
var person = {firstName:"John", lastName:"Doe"};  // Object 通过对象字面量赋值

数据类型的概念：

16 + "Volvo" 输出的是 "16Volvo"

【注意】

JavaScript 对大小写是敏感的。

JavaScript 中，常见的是驼峰法的命名规则，如 lastName (而不是lastname)。

JavaScript 会忽略多余的空格。您可以向脚本添加空格，来提高其可读性。

var person="Hege";
var person = "Hege";

对代码行进行折行，您可以在文本字符串中使用反斜杠对代码行进行换行。

document.write("你好 \
世界!");

JavaScript 单行注释

// 注释内容

JavaScript 多行注释

/*
下面的这些代码会输出
一个标题和一个段落
并将代表主页的开始
*/

08 JavaScript 变量

变量必须以字母开头

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

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

在下面的例子中，我们创建了名为 carname 的变量，并向其赋值 "Volvo"，然后把它放入 id="demo" 的 HTML 段落中：

<p>点击这里来创建变量，并显示结果。</p>
<button onclick="myFunction()">点击这里</button>
<p id="demo"></p>
<script>
function myFunction(){
    var carname="Volvo";
    document.getElementById("demo").innerHTML=carname;
}
</script>

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

var carname;

如果重新声明 JavaScript 变量，该变量的值不会丢失，在以下两条语句执行后，变量 carname 的值依然是 "Volvo"：

var carname="Volvo";

var carname;

09 JavaScript 数据类型

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

JavaScript 拥有动态类型。这意味着相同的变量可用作不同的类型：

JavaScript 布尔

var x=true;
var y=false;

JavaScript 数组

var cars=new Array();
cars[0]="Saab";
cars[1]="Volvo";
cars[2]="BMW";

或者:

var cars=new Array("Saab","Volvo","BMW");

JavaScript 对象

var person={firstname:"John", lastname:"Doe", id:5566};

或者:

var person={
firstname : "John",
lastname  : "Doe",
id        :  5566
};

实例：

name=person.lastname;
name=person["lastname"];

Undefined 和 Null

Undefined 这个值表示变量不含有值。

可以通过将变量的值设置为 null 来清空变量。

cars=null;
person=null;

声明变量类型

当您声明新变量时，可以使用关键词 "new" 来声明其类型：

var carname=new String;
var x=      new Number;
var y=      new Boolean;
var cars=   new Array;
var person= new Object;

10 JavaScript 对象

JavaScript 对象是拥有属性和方法的数据。JavaScript 对象是变量的容器。

var car = {type:"Fiat", model:500, color:"white"};

在以上实例中，3 个值 ("Fiat", 500, "white") 赋予变量 car。

在以上实例中，3 个变量 (type, model, color) 赋予变量 car。

访问对象属性

person.lastName;
person["lastName"];

对象方法

对象的方法定义了一个函数，并作为对象的属性存储。

对象方法通过添加 () 调用 (作为一个函数)。

你可以使用以下语法创建对象方法：

methodName : function() { code lines }

你可以使用以下语法访问对象方法：

objectName.methodName()

<p id="demo"></p>
<script>
var person = {
    firstName: "John",
    lastName : "Doe",
    id : 5566,
    fullName : function() 
    {
       return this.firstName + " " + this.lastName;
    }
};
document.getElementById("demo").innerHTML = person.fullName();
</script>

11 JavaScript 函数

函数是由事件驱动的或者当它被调用时执行的可重复使用的代码块。

<head>
<script>
function myFunction()
{
    alert("Hello World!");
}
</script>
</head>
 
<body>
<button onclick="myFunction()">Try it</button>
</body>

您可以发送任意多的参数，由逗号 (,) 分隔：

<p>点击这个按钮，来调用带参数的函数。</p>
<button onclick="myFunction('Harry Potter','Wizard')">点击这里</button>
<script>
function myFunction(name,job){
    alert("Welcome " + name + ", the " + job);
}
</script>

带有返回值的函数

即使不把它保存为变量，您也可以使用返回值：

function myFunction(a,b)
{
    return a*b;
}
 
document.getElementById("demo").innerHTML=myFunction(4,3);

局部 JavaScript 变量：

在 JavaScript 函数内部声明的变量（使用 var）是局部变量

全局 JavaScript 变量：

在函数外声明的变量是全局变量，网页上的所有脚本和函数都能访问它。

向未声明的 JavaScript 变量分配值：

如果您把值赋给尚未声明的变量，该变量将被自动作为全局变量声明。

这条语句：

carname="Volvo";

将声明一个全局变量 carname，即使它【在函数内】执行。

12 JavaScript 作用域

变量在函数内声明，变量为局部作用域。

局部变量：只能在函数内部访问。

// 此处不能调用 carName 变量
function myFunction() {
    var carName = "Volvo";
    // 函数内可调用 carName 变量
}

变量在函数外定义，即为全局变量。

全局变量有全局作用域: 网页中所有脚本和函数均可使用。

var carName = " Volvo";
// 此处可调用 carName 变量
function myFunction() {
    // 函数内可调用 carName 变量

}

如果变量在函数内没有声明（没有使用 var 关键字），该变量为全局变量。

// 此处可调用 carName 变量
function myFunction() {
    carName = "Volvo";
    // 此处可调用 carName 变量
}

HTML 中的全局变量

在 HTML 中, 全局变量是 window 对象: 所有数据变量都属于 window 对象。

//此处可使用 window.carName
function myFunction() {
    carName = "Volvo";
}

13 JavaScript 事件

HTML 事件

HTML 事件可以是浏览器行为，也可以是用户行为。如：【HTML 页面完成加载】【HTML input 字段改变时】【HTML 按钮被点击】

通常，当事件发生时，你可以做些事情。在事件触发时 JavaScript 可以执行一些代码。

在以下实例中，按钮元素中添加了 onclick 属性 (并加上代码):

<button onclick="getElementById('demo').innerHTML=Date()">现在的时间</button>
<p id="demo"></p>

在下一个实例中，代码将修改自身元素的内容 (使用 this.innerHTML):

<button onclick="this.innerHTML=Date()">现在的时间</button>

执行函数举例：

<button onclick="displayDate()">点这里</button>
<script>
function displayDate(){
    document.getElementById("demo").innerHTML=Date();
}
</script>
<p id="demo"></p>

常见的HTML事件

onchange HTML 元素改变

onclick 用户点击 HTML 元素

onmouseover 用户在一个HTML元素上移动鼠标

onmouseout 用户从一个HTML元素上移开鼠标

onkeydown 用户按下键盘按键

onload 浏览器已完成页面的加载

14 JavaScript 字符串

你可以使用索引位置来访问字符串中的每个字符：

var carname = "Volvo XC60";
var character = carname[7];

你可以在字符串中使用引号，字符串中的引号不要与字符串的引号相同，也可以在字符串添加转义字符:

var answer = "It's alright";
var answer = "He is called 'Johnny'";
var answer = 'He is called "Johnny"';
var x = 'It\'s alright';
var y = "He is called \"Johnny\"";

length 来计算字符串的长度：

var txt = "ABCDEFGHIJKLMNOPQRSTUVWXYZ";
var sln = txt.length;// 26

字符串可以是对象

使用 new 关键字将字符串定义为一个对象： var firstName = new String("John")

var x = "John";
var y = new String("John");
typeof x // 返回 String
typeof y // 返回 Object

【注意】不要创建 String 对象。它会拖慢执行速度，并可能产生其他副作用。

var x = "John";
var y = new String("John");

(x === y) // 结果为 false，因为是字符串，y 是对象

【注】=== 为绝对相等，即数据类型与值都必须相等。

15 JavaScript 运算符

加号+运算符用于把文本值或字符串变量加起来（连接起来）。

txt1="What a very";
txt2="nice day";
txt3=txt1+txt2;

两个数字相加，返回数字相加的和，如果数字与字符串相加，返回字符串，如下实例：

x=5+5;
y="5"+5;
z="Hello"+5;

x,y, 和 z 输出结果为

Hello5

16 JavaScript 比较和逻辑运算符

比较运算符，主要的几个：

== 等于

=== 绝对等于（值和类型均相等）

!= 不等于

!== 不绝对等于（值和类型有一个不相等，或两个都不相等）

JavaScript 还包含了基于某些条件对变量进行赋值的条件运算符。

voteable=(age<18)?"年龄太小":"年龄已达到";

17 条件语句

if (time<10)
{
    document.write("<b>早上好</b>");
}
else if (time>=10 && time<16)
{
    document.write("<b>今天好</b>");
}
else
{
    document.write("<b>晚上好!</b>");
}

举例：

<p id="demo"></p>
<script>
var r=Math.random();
var x=document.getElementById("demo")
if (r>0.5){
    x.innerHTML="<a href='http://www.runoob.com'>访问菜鸟教程</a>";
}
else{
    x.innerHTML="<a href='http://wwf.org'>Visit WWF</a>";
}
</script>

switch 实例

显示今天的星期名称。请注意 Sunday=0, Monday=1, Tuesday=2, 等等：

var d=new Date().getDay(); 
switch (d) 
{ 
  case 0:x="今天是星期日"; 
  break; 
  case 1:x="今天是星期一"; 
  break; 
  case 2:x="今天是星期二"; 
  break; 
  case 3:x="今天是星期三"; 
  break; 
  case 4:x="今天是星期四"; 
  break; 
  case 5:x="今天是星期五"; 
  break; 
  case 6:x="今天是星期六"; 
  break; 
  default:
    x="期待周末";
}

18 循环

for 循环

for (var i=0;i<cars.length;i++)
{ 
    document.write(cars[i] + "<br>");
}

For/In 循环

var person={fname:"John",lname:"Doe",age:25};
for (x in person)
{
    txt=txt + person[x];
}

结果为：JohnDoe25

while 循环

举例：

while (i<5)
{
    x=x + "The number is " + i + "<br>";
    i++;
}

举例：

do
{
    x=x + "The number is " + i + "<br>";
    i++;
}
while (i<5);

举例：

cars=["BMW","Volvo","Saab","Ford"];
var i=0;
while (cars[i])
{
    document.write(cars[i] + "<br>");
    i++;
}

19 typeof 操作符

用 typeof 操作符来检测变量的数据类型。
typeof "John" // 返回 string
typeof 3.14 // 返回 number
typeof false // 返回 boolean
typeof [1,2,3,4] // 返回 object 在JavaScript中，数组是一种特殊的对象类型。因此 typeof [1,2,3,4] 返回 object。
typeof {name:'John', age:34} // 返回 object

在 JavaScript 中 null 表示 "什么都没有"。
你可以设置为 null 来清空对象:
var person = null; // 值为 null(空), 但类型为对象
你可以设置为 undefined 来清空对象:
var person = undefined; // 值为 undefined, 类型为 undefined

var person; // 值为 null(空), 但仍然是一个对象
person = undefined; // 值为 undefined, 类型是undefined

Undefined 和 Null 的区别
typeof undefined // undefined
typeof null // object
null === undefined // false
null == undefined // true

20 JavaScript 类型转换

Number() 转换为数字， String() 转换为字符串， Boolean() 转化为布尔值。
constructor 属性返回所有 JavaScript 变量的构造函数。
实例
"John".constructor // 返回函数 String() { [native code] }
(3.14).constructor // 返回函数 Number() { [native code] }
false.constructor // 返回函数 Boolean() { [native code] }
[1,2,3,4].constructor // 返回函数 Array() { [native code] }
{name:'John', age:34}.constructor // 返回函数 Object() { [native code] }
new Date().constructor // 返回函数 Date() { [native code] }
function () {}.constructor // 返回函数 Function(){ [native code] }

可以使用 constructor 属性来查看是对象是否为数组 (包含字符串 "Array"):
function isArray(myArray) {

return myArray.constructor.toString().indexOf("Array") > -1;

}

使用 constructor 属性来查看是对象是否为日期 (包含字符串 "Date"):
function isDate(myDate) {

return myDate.constructor.toString().indexOf("Date") > -1;

}

转换为字符串
x.toString()
(123).toString()
(100 + 23).toString()
String(false) // 返回 "false"
String(true) // 返回 "true"
false.toString() // 返回 "false"
true.toString() // 返回 "true"
String(Date()) // 返回 Thu Jul 17 2014 15:38:19 GMT+0200 (W. Europe Daylight Time)
Date().toString() // 返回 Thu Jul 17 2014 15:38:19 GMT+0200 (W. Europe Daylight Time)

toExponential() 把对象的值转换为指数计数法。
toFixed() 把数字转换为字符串，结果的小数点后有指定位数的数字。
toPrecision() 把数字格式化为指定的长度。

字符串转换为数字
Number("3.14") // 返回 3.14
Number(" ") // 返回 0
Number("") // 返回 0
Number("99 88") // 返回 NaN
Number(false) // 返回 0
Number(true) // 返回 1

parseFloat() 解析一个字符串，并返回一个浮点数。
parseInt() 解析一个字符串，并返回一个整数。

Operator + 可用于将变量转换为数字：
var y = "5"; // y 是一个字符串
var x = + y; // x 是一个数字

自动转换类型
5 + null // 返回 5 null 转换为 0
"5" + null // 返回"5null" null 转换为 "null"
"5" + 1 // 返回 "51" 1 转换为 "1"
"5" - 1 // 返回 4 "5" 转换为 5

当你尝试输出一个对象或一个变量时 JavaScript 会自动调用变量的 toString() 方法：
document.getElementById("demo").innerHTML = myVar;
// if myVar = {name:"Fjohn"} // toString 转换为 "[object Object]"
// if myVar = [1,2,3,4] // toString 转换为 "1,2,3,4"
// if myVar = new Date() // toString 转换为 "Fri Jul 18 2014 09:08:55 GMT+0200"

21 JavaScript 错误

当 JavaScript 引擎执行 JavaScript 代码时，会发生各种错误。
可能是语法错误，通常是程序员造成的编码错误或错别字。
可能是拼写错误或语言中缺少的功能（可能由于浏览器差异）。
可能是由于来自服务器或用户的错误输出而导致的错误。
当然，也可能是由于许多其他不可预知的因素。

本例检测输入变量的值。如果值是错误的，会抛出一个异常（错误）。catch 会捕捉到这个错误，并显示一段自定义的错误消息：
function myFunction()
{
try
{

var x=document.getElementById("demo").value;
if(x=="")    throw "值为空";
if(isNaN(x)) throw "不是数字";
if(x > 10) throw "太大";
if(x < 5) throw "太小";

}
catch(err)
{

var y=document.getElementById("mess");
y.innerHTML="错误：" + err + "。";

}
}

21 JavaScript 调试

你可以使用 console.log() 方法在调试窗口上打印 JavaScript 值：
a = 5;
b = 6;
c = a + b;
console.log(c);

设置断点
在调试窗口中，你可以设置 JavaScript 代码的断点。
在每个断点上，都会停止执行 JavaScript 代码，以便于我们检查 JavaScript 变量的值。
如果没有调试可用，debugger 语句将无法工作。

var x = 15 * 5;
debugger;
document.getElementbyId("demo").innerHTML = x;

22 JavaScript 变量提升

JavaScript 中，函数及变量的声明都将被提升到### 函数的最顶部】。
JavaScript 中，变量可以在使用后声明，也就是变量可以先使用再声明。

以上两个例子结果一样
要理解以上实例就需要理解 "hoisting(变量提升)"。
变量提升：函数声明和变量声明总是会被解释器悄悄地被"提升"到方法体的最顶部。

JavaScript ### 初始化】### 不会】提升
JavaScript 只有声明的变量会提升，初始化的不会。
以下两个实例结果结果不相同：

结果：57

结果：x 为：5，y 为：undefined

对于大多数程序员来说并不知道 JavaScript 变量提升。如果程序员不能很好的理解变量提升，他们写的程序就容易出现一些问题。为了避免这些问题，通常我们在每个作用域开始前声明这些变量，这也是正常的 JavaScript 解析步骤，易于我们理解。JavaScript 严格模式(strict mode)不允许使用未声明的变量。

23 JavaScript 严格模式(use strict)

use strict" 指令在 JavaScript 1.8.5 (ECMAScript5) 中新增。它不是一条语句，但是是一个字面量表达式，在 JavaScript 旧版本中会被忽略。
"use strict" 的目的是指定代码在严格条件下执行。严格模式下你不能使用未声明的变量。
严格模式通过在脚本或函数的头部添加 "use strict"; 表达式来声明。
实例中我们可以在浏览器按下 F12 (或点击"工具>更多工具>开发者工具") 开启调试模式，查看报错信息。

严格模式的限制
不允许使用未声明的变量：
x = 3.14; // 报错 (x 未定义)
不允许删除变量或对象。不允许删除函数。
var x = 3.14;
delete x; // 报错
function x(p1, p2) {};
delete x; // 报错
不允许变量重名:
function x(p1, p1) {}; // 报错
不允许使用八进制:
var x = 010; // 报错
不允许使用转义字符:
var x = \010; // 报错
不允许对只读属性赋值:
var obj = {};
Object.defineProperty(obj, "x", {value:0, writable:false});
obj.x = 3.14; // 报错
不允许对一个使用getter方法读取的属性进行赋值
var obj = {get x() {return 0} };
obj.x = 3.14; // 报错
不允许删除一个不允许删除的属性：
delete Object.prototype; // 报错
变量名不能使用 "eval" 字符串:变量名不能使用 "arguments" 字符串:
var eval = 3.14; // 报错
var arguments = 3.14; // 报错
不允许使用以下这种语句:
with (Math){x = cos(2)}; // 报错
由于一些安全原因，在作用域 eval() 创建的变量不能被调用：
eval ("var x = 2");
alert (x); // 报错
禁止this关键字指向全局对象。
因此，使用构造函数时，如果忘了加new，this不再指向全局对象，而是报错。
function f(){

"use strict";
this.a = 1;

};
f();// 报错，this未定义

24 注意事项

浮点型数据使用注意事项
var x = 0.1;
var y = 0.2;
var z = x + y // z 的结果为 0.3
if (z == 0.3) // 返回 false
我解决以上问题，可以用整数的乘除法来解决：
var z = (x 10 + y 10) / 10; // z 的结果为 0.3

JavaScript 允许我们在字符串中使用断行语句:
var x =
"Hello World!";
但是，在字符串中直接使用回车换行是会报错的：
var x = "Hello
World!";
字符串断行需要使用反斜杠()，如下所示:
var x = "Hello \
World!";

以下实例结果会返回 undefined：
function myFunction(a) {

var
power = 10;  
return
a * power;

}
为什么会有这样的结果呢？因为在 JavaScript 中，实例 4 的代码与下面的代码一致：
function myFunction(a) {

var
power = 10;  
return;       // 分号结束，返回 undefined
a * power;

}

解析
如果是一个不完整的语句，如下所示:
var
JavaScript 将尝试读取第二行的语句：
power = 10;
但是由于这样的语句是完整的:
return
JavaScript 将自动关闭语句:
return;

数组中使用名字来索引
JavaScript 不支持使用名字来索引数组，只允许使用数字索引。
var person = [];
person[0] = "John";
person[1] = "Doe";
person[2] = 46;
var x = person.length; // person.length 返回 3
var y = person[0]; // person[0] 返回 "John"

在 JavaScript 中, 对象使用名字作为索引。
如果你使用名字作为索引，当访问数组时，JavaScript 会把数组重新定义为标准对象。
执行这样操作后，数组的方法及属性将不能再使用，否则会产生错误:
var person = [];
person["firstName"] = "John";
person["lastName"] = "Doe";
person["age"] = 46;
var x = person.length; // person.length 返回 0
var y = person[0]; // person[0] 返回 undefined

定义数组元素，定义对象，最后不能添加逗号
points = [40, 100, 1, 5, 25, 10];
websites = {site:"菜鸟教程", url:"www.runoob.com", like:460}

Undefined 不是 Null
如果我们想测试对象是否存在，在对象还没定义时将会抛出一个错误。
正确的方式是我们需要先使用 typeof 来检测对象是否已定义：
if (typeof myObj !== "undefined" && myObj !== null)

程序块作用域
在每个代码块中 JavaScript 不会创建一个新的作用域，一般各个代码块的作用域都是### 全局】的。
以下代码的的变量 i 返回 10，而不是 undefined：
for (var i = 0; i < 10; i++) {

// some code

}
return i;

25 JavaScript JSON

JSON 是用于存储和传输数据的格式。
JSON 通常用于服务端向网页传递数据。

什么是 JSON?
JSON 英文全称 JavaScript Object Notation
JSON 是一种轻量级的数据交换格式。
JSON是独立的语言 *
JSON 易于理解。

Note：* JSON 使用 JavaScript 语法，但是 JSON 格式仅仅是一个文本。
文本可以被任何编程语言读取及作为数据格式传递。

JSON 实例
以下 JSON 语法定义了 sites 对象: 3 条网站信息（对象）的数组:
{"sites":[

{"name":"Runoob", "url":"www.runoob.com"}, 
{"name":"Google", "url":"www.google.com"},
{"name":"Taobao", "url":"www.taobao.com"}

]}

JSON 格式化后为 JavaScript 对象
JSON 格式在语法上与创建 JavaScript 对象代码是相同的。
由于它们很相似，所以 JavaScript 程序可以很容易的将 JSON 数据转换为 JavaScript 对象。

JSON 语法规则
数据为键/值对。
数据由逗号分隔。
大括号保存对象
方括号保存数组

JSON 字符串转换为 JavaScript 对象
通常我们从服务器中读取 JSON 数据，并在网页中显示数据。
简单起见，我们网页中直接设置 JSON 字符串:
首先，创建 JavaScript 字符串，字符串为 JSON 格式的数据：
var text = '{ "sites" : [' +
'{ "name":"Runoob" , "url":"www.runoob.com" },' +
'{ "name":"Google" , "url":"www.google.com" },' +
'{ "name":"Taobao" , "url":"www.taobao.com" } ]}';
然后，使用 JavaScript 内置函数 JSON.parse() 将字符串转换为 JavaScript 对象:
var obj = JSON.parse(text);
最后，在你的页面中使用新的 JavaScript 对象：
var text = '{ "sites" : [' +

'{ "name":"Runoob" , "url":"www.runoob.com" },' +
'{ "name":"Google" , "url":"www.google.com" },' +
'{ "name":"Taobao" , "url":"www.taobao.com" } ]}';

obj = JSON.parse(text);
document.getElementById("demo").innerHTML = obj.sites[1].name + " " + obj.sites[1].url;

完整网页原代码：
<!DOCTYPE html>

菜鸟教程(runoob.com)

为 JSON 字符串创建对象

相关函数
函数描述
JSON.parse() 用于将一个 JSON 字符串转换为 JavaScript 对象。
JSON.stringify() 用于将 JavaScript 值转换为 JSON 字符串。

26 javascript:void(0) 含义

javascript:void(0) 中最关键的是 void 关键字， void 是 JavaScript 中非常重要的关键字，该操作符指定要计算一个表达式但是不返回值。
语法格式如下：

下面的代码创建了一个超级链接，当用户点击以后不会发生任何事。
单击此处什么也不会发生
以下实例中，在用户点击链接后显示警告信息：

点击以下链接查看结果：

点我!

<!DOCTYPE html>

菜鸟教程(runoob.com)

点击以下按钮查看结果：

href="#"与href="javascript:void(0)"的区别

包含了一个位置信息，默认的锚是#top 也就是网页的上端。

而javascript:void(0), 仅仅表示一个死链接。
在页面很长的时候会使用 # 来定位页面的具体位置，格式为：# + id。
如果你要定义一个死链接请使用 javascript:void(0) 。
点我没有反应的!
点我定位到指定位置!

...

尾部定位点

异想博客

异想家JavaScript学习笔记

01 直接输出文本

02 对事件的反应

03 改变 HTML 内容

04 验证输入, JavaScript 常用于验证用户的输入。

05 JavaScript 用法

06 JavaScript 输出

07 JavaScript 语法

08 JavaScript 变量

09 JavaScript 数据类型

10 JavaScript 对象

11 JavaScript 函数

12 JavaScript 作用域

13 JavaScript 事件

14 JavaScript 字符串

15 JavaScript 运算符

16 JavaScript 比较和逻辑运算符

17 条件语句

18 循环

19 typeof 操作符

20 JavaScript 类型转换

21 JavaScript 错误

21 JavaScript 调试

22 JavaScript 变量提升

23 JavaScript 严格模式(use strict)

24 注意事项

25 JavaScript JSON

为 JSON 字符串创建对象

26 javascript:void(0) 含义

包含了一个位置信息，默认的锚是#top 也就是网页的上端。

27

猜您喜欢

异想家JavaScript学习笔记

01 直接输出文本

02 对事件的反应

03 改变 HTML 内容

04 验证输入, JavaScript 常用于验证用户的输入。

05 JavaScript 用法

06 JavaScript 输出

07 JavaScript 语法

08 JavaScript 变量

09 JavaScript 数据类型

10 JavaScript 对象

11 JavaScript 函数

12 JavaScript 作用域

13 JavaScript 事件

14 JavaScript 字符串

15 JavaScript 运算符

16 JavaScript 比较 和 逻辑运算符

17 条件语句

18 循环

19 typeof 操作符

20 JavaScript 类型转换

21 JavaScript 错误

21 JavaScript 调试

22 JavaScript 变量提升

23 JavaScript 严格模式(use strict)

24 注意事项

25 JavaScript JSON

为 JSON 字符串创建对象

26 javascript:void(0) 含义

包含了一个位置信息，默认的锚是#top 也就是网页的上端。

27

猜您喜欢

16 JavaScript 比较和逻辑运算符