javascript基础资源-CSDN文库

需积分: 10 175 浏览量 2014-05-15 16:53:43 上传评论收藏 2.29MB PDF 举报

### JavaScript基础知识点详解 #### 一、JavaScript简介 ##### 1.1 JavaScript的概念与特点 - **脚本编写语言**：JavaScript是一种脚本语言，它采用小程序段的方式实现编程，其基本结构形式与C、C++、VB、Delphi等语言类似。然而，JavaScript与其他这些语言的不同之处在于它是解释型语言，在程序运行过程中被逐行地解释执行，而非先编译再运行。 - **基于对象的语言**：JavaScript是一种基于对象的语言，同时也具备面向对象的特性。在JavaScript中，HTML页面中的每个元素都被视为一个对象，并且这些对象之间存在层次关系。通过操作这些对象的方法和属性，可以捕捉用户在浏览器中的操作，从而实现页面的动态效果。 - **简单性**：JavaScript的语法类似于Java，因此对于已经熟悉Java的人来说，学习JavaScript相对容易。此外，JavaScript采用了弱类型的变量定义方式，即无需指定严格的变量类型。 - **安全性**：作为一种安全性语言，JavaScript限制了对本地硬盘的访问，也不允许将数据保存到服务器上。这种限制有效地防止了数据的丢失和安全问题的发生。 - **动态性**：JavaScript能够直接响应用户的输入，而无需通过Web服务器进行处理。它是以事件驱动的方式工作的，即当某个事件（如点击鼠标、移动窗口等）发生时，会触发相应的事件响应。 - **跨平台性**：JavaScript是与操作系统无关的，只要计算机支持特定版本的浏览器并且该浏览器支持JavaScript，那么就可以正确地运行JavaScript代码。 ##### 1.2 JavaScript与Java的区别尽管名称相似，JavaScript与Java是两种完全不同的编程语言。主要区别如下： - **语法结构**：尽管两者在语法上有一定的相似性，但是JavaScript更加灵活，是一种弱类型语言，而Java是一种强类型语言。 - **运行环境**：Java程序需要Java虚拟机（JVM）来运行，而JavaScript则是直接在浏览器中运行。 - **应用场景**：Java广泛应用于服务器端编程、Android应用程序开发等场景，而JavaScript主要用于网页前端开发，为网页添加动态效果和交互性。 ##### 1.3 第一个JavaScript程序示例创建一个简单的JavaScript程序通常包含以下几个步骤： 1. **HTML结构**：首先需要有一个HTML文件，其中包含一个或多个元素，这些元素可以通过JavaScript进行操作。 2. **JavaScript代码**：在HTML文件中插入JavaScript代码，可以使用`<script>`标签内嵌代码或者通过外部文件引用。 3. **调用JavaScript函数**：可以通过按钮点击等事件触发JavaScript函数，从而使网页产生动态变化。 #### 二、JavaScript语言基础 ##### 2.1 JavaScript语法格式 - **注释**：JavaScript支持单行注释（使用 `//`）和多行注释（使用 `/* */`）。 - **语句**：JavaScript中的语句是由一系列命令组成的，通常以分号结束。 - **代码位置**：JavaScript代码可以写在HTML文档的头部（`<head>`部分），也可以写在主体部分（`<body>`部分），还可以通过外部文件引用。 ##### 2.2 数据类型与变量 - **数据类型**：JavaScript支持多种数据类型，包括但不限于字符串、数字、布尔值、null、undefined等。 - **变量**：在JavaScript中，使用`var`、`let`或`const`关键字声明变量。`var`用于声明变量，作用域为函数级或全局级；`let`和`const`则提供了块级作用域。 ##### 2.3 常量在JavaScript中，使用`const`关键字声明常量。一旦声明，其值不可更改。 #### 三、表达式与运算符 ##### 3.1 表达式 JavaScript中的表达式是用来计算值的结构，可以是简单的数值，也可以是复杂的组合。 ##### 3.2 运算符 JavaScript支持多种运算符，包括但不限于： - **算术运算符**：如加号（+）、减号（-）等。 - **比较运算符**：如等于（==）、不等于（!=）、严格等于（===）、严格不等于（!==）等。 - **逻辑运算符**：如与（&&）、或（||）、非（!）等。 - **位运算符**：如按位与（&）、按位或（|）、按位异或（^）等。 #### 四、JavaScript控制结构与函数 ##### 4.1 控制结构 JavaScript支持多种控制结构，如条件语句（if...else）、循环语句（for、while）等。 ##### 4.2 函数函数是JavaScript程序的基本组成部分之一，可以封装一段代码以便重复使用。函数可以接受参数，并返回一个值。 - **声明函数**：使用`function`关键字。 - **调用函数**：通过函数名后跟括号（`()`）来调用函数。 #### 五、应用案例本节将通过具体的案例来展示如何使用JavaScript来实现网页的动态效果，例如： - **响应用户输入**：通过监听用户的输入事件，如点击按钮，然后执行相应的JavaScript代码来更新网页的内容。 - **控制网页元素**：使用JavaScript来修改DOM元素的样式、位置等属性，实现动画效果或其他动态变化。 #### 总结本章节介绍了JavaScript的基础知识，包括概念、特点以及基本语法等。通过学习这些内容，读者可以开始掌握如何使用JavaScript来为网页添加动态效果和交互性。接下来，我们将在后续章节中深入探讨更高级的主题和技术。

资源推荐

资源详情

资源评论

第 6 章让网页动起来—使用 JavaScript 技术 ....................................................................... 1

6.1 JavaScript 简介 ..................................................................................................... 1

6.1.1 JavaScript 的概念和特点 .............................................................................. 2

6.1.2 JavaScript 与 Java ........................................................................................ 2

6.1.3 第一个 JavaScript 程序 ............................................................................... 3

6.2 JavaScript 语言基础 .............................................................................................. 6

6.2.1 JavaScript 语法格式 ............................................................................................ 6

6.2.2 JavaScript 代码书写位置 .............................................................................. 6

6.2.3 JavaScript 语句 ............................................................................................ 7

6.2.4 JavaScript 注释 ............................................................................................ 8

6.2.5 数据类型 ................................................................................................... 9

6.2.6 变量 ........................................................................................................ 10

6.2.7 常量 ........................................................................................................ 12

6.3 表达式与运算符 ................................................................................................ 13

6.3.1 表达式 .................................................................................................... 13

6.3.2 运算符 .................................................................................................... 13

6.4 JavaScript 控制结构与函数 .................................................................................. 18

6.4.1 JavaScirpt 控制结构 ................................................................................... 18

6.4.2 函数......................................................................................................... 26

6.5 应用案例 .......................................................................................................... 30

本章小结................................................................................................................. 32

思考和练习 ............................................................................................................. 32

第 6 章让网页动起来—使用 JavaScript 技术

按照 Web 标准，网页主要包括结构、表现和行为三部分。前面几章的内容包括使用 HTML

语言来描述网页的内容，利用超链接技术组织成网站结构，再通过 CSS 来控制网页表现形式，

实现文本的表现与内容分离。网页设计还包括一项重要内容 JavaScript，它可以实现网页

的一种实时的、动态的表达能力，还可以通过交互来控制网页的行为。

本章将介绍以下内容：

·JavaScript 语言的概念和特点

·JavaScript 的数据类型、常量、变量、运算符和表达式

·JavaScript 的流程控制和函数

6.1 JavaScript 简介

JavaScript 是一种脚本语言,是一种介于 HTML 与高级编程语言(Java、VB 和 C++等)之

间的特殊语言。脚本是一种能完成某些功能的小程序段，该程序段由一组可以在 Web 服务器

或客户端浏览器运行的命令组成。脚本语言可以嵌入 HTML 页面，并被浏览器解释执行。使

用脚本可以把网页对象和浏览器对象集成并组装起来，使网页具有动态效果和交互功能。

除 JavaScript 外，php、perl、VBScript 等也是常用的脚本语言。

6.1.1 JavaScript 的概念和特点

JavaScript 最早由 Netscape 公司开发,是一种跨平台、基于对象和事件驱动的脚本语言。

因它的开发环境简单，不需要 Java 编译器，可以是直接运行在 Web 浏览器上，从而倍受 Web

设计者所爱。JavaScript 的特点如下。

（1）脚本编写语言

JavaScript 作为脚本语言，它采用小程序段的方式实现编程，其基本结构形式与 C、C++、

VB、Delphi 十分类似。但与这些语言不同，JavaScript 是解释型语言，不需要先编译，而

是在程序运行过程中被逐行地解释。它与 HTML 标识结合在一起，从而方便用户的使用操作。

（2）基于对象的语言

JavaScript 是一种基于对象（object-based）的语言，同时也可以看作一种面向对象的

语言。JavaScript 把 HTML 页面中的每个元素都可以看做对象，并且这些对象之间存在着层

次关系。通过操作 HTML 对象的方法和属性，可以捕捉到用户在浏览器中的操作，从而实现

页面的动态效果。

（3）简单性

JavaScript 在语法上可以理解是基于 Java 的语句和控制流，如果学习了 Java 语言，使

用 JavaScript 非常容易；反之，学习 JavaScript 也是对学习 Java 一种非常好的过渡。另

外，JavaScript 的变量类型是弱类型，并未使用严格的数据类型。

（4）安全性

JavaScript 是一种安全性语言，它不允许访问本地的硬盘，并不能将数据保存到服务器

上，不允许对网络文档进行修改和删除，只能通过浏览器实现信息浏览或动态交互，从而有

效地防止数据的丢失。

（5）动态性

JavaScript 是动态的，它可以直接对用户或客户输入做出响应，无须经过 Web 服务程序。

它对用户的响应，是以事件驱动的方式进行的。“事件”(Event) 是指在浏览器中执行的某

种操作，例如按下鼠标、移动窗口、选择菜单等都可以视为事件。当事件发生后，可能会引

起相应的事件响应，这就是事件驱动。

（6）跨平台性

JavaScript 是依赖于浏览器本身，与操作环境无关，只要能运行浏览器的计算机，并支

持 JavaScript 的浏览器就可正确执行。从而实现了“write one,run everywhere”。

所以，JavaScript 是一种基于对象(Object)和事件驱动(Event Driven)并具有安全性

能的脚本语言。JavaScript 嵌入在 HTML 页面中，使用 JavaScript 可以开发客户端的应用

程序，实现与客户的交互。

6.1.2 JavaScript 与 Java

虽然 JavaScript 与 Java 有紧密的联系，但却是两个公司开发的不同的产品。Java 是

SUN 公司推出的面向对象的程序设计语言，适合于 Internet 应用程序开发；而 JavaScript

是 Netscape 公司的产品，其目的是开发一种可以嵌入 HTML 页面中的基于对象和事件驱动

的解释性语言；Java 的前身是 Oak 语言，而 JavaScript 的前身是 Live Script。下面是对

两种语言异同的比较。

（1）基于对象和面向对象

Java 是一种纯的面向对象的语言，所有的 Java 程序需要创建对象。

JavaScript 是一种脚本语言，它用来实现与用户交互作。作为一种基于对象的编程语

言，JavaScript 本身提供了非常丰富的内部对象供设计人员使用。

（2）解释和编译

两种语言在浏览器中执行的方式不一样。Java 的源代码需要编译后执行，运行 Java

程序的客户端上必须具有相应平台上的仿真器或解释器。Java 通过编译器或解释器实现独

跨平台特性。

JavaScript 是一种解释性编程语言，其程序由浏览器解释执行。

（3）强变量和弱变量

两种语言所采取的变量是不一样的。

Java 采用强类型变量检查，即所有变量在编译之前必须作声明。下面的代码定义了一

个整数和一个字符串。

int x;

String y;

x=1234;

y="4321";

JavaScript 中变量声明采用弱类型。即变量在使用前不需声明，而是解释器在运行时

检查其数据类型，如：

x=1234;

y="4321";

前者说明 x 为数值型变量，而后者说明 y 为字符型变量。

（4）代码格式不同

Java 是一种与 HTML 无关的格式，如果要在 HTML 页面中使用外部字节码文件，其代码

应以字节代码的形式保存在独立的文档中，不可以嵌入在 HTML 代码中。

JavaScript 的代码是一种文本字符格式，可以直接嵌入 HTML 文档中，并且可动态装

载。

（5）嵌入 HTML 文档方式不同

在 HTML 文档中，嵌入两种编程语言使用的标识不同， JavaScript 使用

<Script>...</Script>来标识，而 Java 使用<applet>...</applet>来嵌入 Applet 文件。

6.1.3 第一个 JavaScript 程序

1．脚本编写工具

可以使用 Windows 记事本等纯文本编辑器来编写 JavaScript 程序，但纯文本编辑器的

主要用途是编辑文本，不具备对 JavaScript 语言的特性支持，因此它只适用于编写少量的

脚本，不适用于大量的脚本编写和设计。相对而言，EditPlus、UltraEdit、Dreamweaver CS5

等专业的脚本编辑工具更为常用。这些工具具有代码自动生成、智能感知、调试等功能，所

以开发人员经常使用这些工具进行 Web 程序的开发，以提高效率。本教材选择的脚本编辑工

具是 Dreamweaver CS5。

2. JavaScript 程序的编写和运行

下面我们编写第一个包含 JavaScript 代码的网页文件 demo0601.html,通过它来说明

JavaScript 程序的编写和运行过程。

（1）启动 Dreamweaver CS5 新建 HTML 文件。

（2）在<body>与</body>标记中输入代码。

<!--

剩余32页未读，继续阅读

评论收藏

内容反馈

sinat_15423189

粉丝: 0
资源: 1

javascript基础

个人设计作业网页，宠物网

web课程设计 网页设计 包含js，div+css布局

javascript 基础

JavaScript基础

JavaScript基础1

JavaScript基础学习

JavaScript 基础

javascript基础入门.ppt

javascript 基础知识

JavaScript基础笔记

Javascript基础知识

JavaScript基础知识

javascript基础知识

javascript基础语法总结.pdf

JavaScript入门篇，JavaScript基础知识

Javascript基础

JavaScript入门

JavaScript 基础篇（一）

基础javascript知识

JavaScript 基本概念

JavaScript 语言基础教程

javascript教案 JavaScript基础

JavaScript基础学习资料

最新资源

web课程设计网页设计包含js，div+css布局