javascript学习笔记.docx

《javascript学习笔记.docx》由会员分享，可在线阅读，更多相关《javascript学习笔记.docx（94页珍藏版）》请在冰豆网上搜索。

javascript学习笔记

一、JavaScript简介

JavaScript是属于网络的脚本语言！

JavaScript被数百万计的网页用来改进设计、验证表单、检测浏览器、创建cookies，以及更多的应用。

JavaScript是因特网上最流行的脚本语言。

JavaScript很容易使用！

你一定会喜欢它的！

JavaScript是世界上最流行的编程语言。

这门语言可用于HTML和web，更可广泛用于服务器、PC、笔记本电脑、平板电脑和智能手机等设备。

JavaScript是脚本语言

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

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

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

JavaScript很容易学习。

您将学到什么

下面是您将在本教程中学到的主要内容。

1、JavaScript：

写入HTML输出

实例

document.write（"

Thisisaheading

document.write（"

Thisisaparagraph

亲自试一试

代码：

DOCTYPEhtml>

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

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

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

结果：

（如图）

提示：

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

如果您在文档加载后使用该方法，会覆盖整个文档。

2、JavaScript：

对事件作出反应

实例

'）">点击这里

亲自试一试

代码：

DOCTYPEhtml>

我的第一段JavaScript

JavaScript能够对事件作出反应。

比如对按钮的点击：

'）">点击这里

结果：

alert（）函数在JavaScript中并不常用，但它对于代码测试非常方便。

onclick事件只是您即将在本教程中学到的众多事件之一。

3、JavaScript：

改变HTML内容

使用JavaScript来处理HTML内容是非常强大的功能。

实例

x=document.getElementById（"demo"）//查找元素

x.innerHTML="HelloJavaScript";//改变内容

亲自试一试

代码：

DOCTYPEhtml>

我的第一段JavaScript

JavaScript能改变HTML元素的内容。

点击这里

您会经常看到document.getElementByID（"someid"）。

这个方法是HTMLDOM中定义的。

DOM（文档对象模型）是用以访问HTML元素的正式W3C标准。

您将在本教程的多个章节中学到有关HTMLDOM的知识。

4、JavaScript：

改变HTML图像

本例会动态地改变HTML的来源（src）：

TheLightbulb

点击灯泡就可以打开或关闭这盏灯

亲自试一试

代码：

DOCTYPEhtml>

点击灯泡来点亮或熄灭这盏灯

JavaScript能够改变任意HTML元素的大多数属性，而不仅仅是图片。

5、JavaScript：

改变HTML样式

改变HTML元素的样式，属于改变HTML属性的变种。

实例

x=document.getElementById（"demo"）//找到元素

x.style.color="#ff0000";//改变样式

亲自试一试

代码：

DOCTYPEhtml>

我的第一段JavaScript

JavaScript能改变HTML元素的样式。

点击这里

6、JavaScript：

验证输入

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

实例

ifisNaN（x）{alert（"NotNumeric"）};

亲自试一试

代码：

DOCTYPEhtml>

我的第一段JavaScript

请输入数字。

如果输入值不是数字，浏览器会弹出提示框。

点击这里

您知道吗？

提示：

JavaScript与Java是两种完全不同的语言，无论在概念还是设计上。

Java（由Sun发明）是更复杂的编程语言。

ECMA-262是JavaScript标准的官方名称。

JavaScript由BrendanEich发明。

它于1995年出现在Netscape中（该浏览器已停止更新），并于1997年被ECMA（一个标准协会）采纳。

二、JavaScript实现

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

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

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

之间的代码行包含了JavaScript：

您无需理解上面的代码。

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

那些老旧的实例可能会在

亲自试一试

代码：

DOCTYPEhtml>

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

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

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

JavaScript函数和事件

上面例子中的JavaScript语句，会在页面加载时执行。

通常，我们需要在某个事件发生时执行代码，比如当用户点击按钮时。

如果我们把JavaScript代码放入函数中，就可以在事件发生时调用该函数。

您将在稍后的章节学到更多有关JavaScript函数和事件的知识。

或中的JavaScript

您可以在HTML文档中放入不限数量的脚本。

脚本可位于HTML的或部分中，或者同时存在于两个部分中。

通常的做法是把函数放入部分中，或者放在页面底部。

这样就可以把它们安置到同一处位置，不会干扰页面的内容。

3、中的JavaScript函数

在本例中，我们把一个JavaScript函数放置到HTML页面的部分。

该函数会在点击按钮时被调用：

实例

DOCTYPEhtml>

MyWebPage

AParagraph

Tryit

亲自试一试

代码：

DOCTYPEhtml>

MyWebPage

AParagraph.

点击这里

4、中的JavaScript函数

在本例中，我们把一个JavaScript函数放置到HTML页面的部分。

该函数会在点击按钮时被调用：

实例

DOCTYPEhtml>

MyWebPage

AParagraph

Tryit

亲自试一试

代码：

DOCTYPEhtml>

MyFirstWebPage

AParagraph.

点击这里

结果：

如上一条

提示：

我们把JavaScript放到了页面代码的底部，这样就可以确保在

元素创建之后再执行脚本。

5、外部的JavaScript

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

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

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

如需使用外部文件，请在

亲自试一试

代码：

DOCTYPEhtml>

MyWebPage

AParagraph.

点击这里

注释：

myFunction保存在名为"myScript.js"的外部文件中。

在或中引用脚本文件都是可以的。

实际运行效果与您在

亲自试一试

代码：

DOCTYPEhtml>

MyFirstWebPage

MyFirstParagraph.

JavaScript由web浏览器来执行。

在这种情况下，浏览器将访问id="demo"的HTML元素，并把它的内容（innerHTML）替换为"MyFirstJavaScript"。

写到文档输出

下面的例子直接把

元素写到HTML文档输出中：

实例

DOCTYPEhtml>

MyFirstWebPage

亲自试一试

代码：

DOCTYPEhtml>

MyFirstWebPage

警告

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

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

实例

DOCTYPEhtml>

MyFirstWebPage

MyFirstParagraph.

点击这里

亲自试一试

代码：

DOCTYPEhtml>

MyFirstWebPage

MyFirstParagraph.

点击这里

Windows8中的JavaScript

提示：

微软支持通过JavaScript创建Windows8app。

对于因特网和视窗操作系统，JavaScript都意味着未来。

四、JavaScript语句

JavaScript语句

JavaScript语句向浏览器发出的命令。

语句的作用是告诉浏览器该做什么。

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

document.getElementById（"demo"）.innerHTML="HelloWorld";

分号;

分号用于分隔JavaScript语句。

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

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

提示：

您也可能看到不带有分号的案例。

在JavaScript中，用分号来结束语句是可选的。

JavaScript代码

JavaScript代码（或者只有JavaScript）是JavaScript语句的序列。

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

本例将操作两个HTML元素：

实例

document.getElementById（"demo"）.innerHTML="HelloWorld";

document.getElementById（"myDIV"）.innerHTML="Howareyou?

";

亲自试一试

代码：

DOCTYPEhtml>

MyWebPage

AParagraph.

ADIV.