您的位置:首页 > Web前端 > JavaScript

JavaScript简介

2009-10-20 17:42 162 查看
JavaScript学习
1. 概述
JavaScript 的正式名称是 "ECMAScript"。ECMA-262 是正式的 JavaScript 标准。这个标准基于 JavaScript (Netscape) 和 JScript (Microsoft)。
2. JavaScript 能做什么?
(1) JavaScript HTML 设计师提供了一种编程工具
HTML 创作者往往都不是程序员,但是 JavaScript 却是一种只拥有极其简单的语法的脚本语言!几乎每个人都有能力将短小的代码片断放入他们的 HTML 页面当中。
(2) JavaScript 可以将动态的文本放入 HTML 页面
类似于这样的一段 JavaScript 声明可以将一段可变的文本放入 HTML 页面:document.write("<h1>" + name + "</h1>")
(3) JavaScript 可以对事件作出响应
可以将 JavaScript 设置为当某事件发生时才会被执行,例如页面载入完成或者当用户点击某个 HTML 元素时。
(4) JavaScript 可以读写 HTML 元素
JavaScript 可以读取及改变 HTML 元素的内容。
(5) JavaScript 可被用来验证数据
在数据被提交到服务器之前,JavaScript 可被用来验证这些数据。
(6) JavaScript 可被用来检测访问者的浏览器
JavaScript 可被用来检测访问者的浏览器,并根据所检测到的浏览器,为这个浏览器载入相应的页面。
(7) JavaScript 可被用来创建 cookies
JavaScript 可被用来存储和取回位于访问者的计算机中的信息。
3. 页面中如何放置JavaScript
(1) 当页面载入时,会执行位于 body 部分的 JavaScript
(2) 当它被调用时,位于 head 部分的 JavaScript 才会被执行。
(3) 外部 JavaScript注意:外部文件不能包含 <script> 标签): 然后把 .js 文件指定给 <script> 标签中的 "src" 属性,比如<script src="xxx.js">...</script>

4. 语言特性
(1) 向未声明的JavaScript变量赋值!

x=5;
carname="Volvo";

var x=5;
var carname="Volvo";
作用相同。

(2) 重新声明 JavaScript 变量!

var x=5;

var x;

x仍然是5。


(3) 全等符 ===

var x=5;

x===5 è true

x===”5” è false

即包括类型和值都相等才为真。


(4) JavaScript 中创建三种消息框:警告框、确认框、提示框。
1> 警告框: alert("文本");
2> 确认框: confirm("文本");
3> 提示框: prompt("文本","默认值");

(5) For(变量in对象)遍历。
for ... in 循环中的代码每执行一次,就会对数组的元素或者对象的属性进行一次操作。
“变量”用来指定变量,指定的变量可以是数组元素,也可以是对象的属性。

(6) 事件!
JavaScript 使我们有能力创建动态页面。事件是可以被 JavaScript 侦测到的行为。
网页中的每个元素都可以产生某些可以触发 JavaScript 函数的事件。
事件举例:
· 鼠标点击
· 页面或图像载入
· 鼠标悬浮于页面的某个热点之上
· 在表单中选取输入框
· 确认表单
· 键盘按键
注意:事件通常与函数配合使用,当事件发生时函数才会执行。
更多有关 Javascript 可识别事件,参阅 JavaScript 事件参考手册

5. 事件举例
(1) onload onUnload
当用户进入或离开页面时就会触发 onload 和 onUnload 事件。onload 事件常用来检测访问者的浏览器类型和版本,然后根据这些信息载入特定版本的网页;onload 和 onUnload 事件也常被用来处理用户进入或离开页面时所建立的 cookies;
(2) onFocus, onBlur onChange
onFocus、onBlur 和 onChange 事件通常相互配合用来验证表单。
(3) onSubmit
onSubmit 用于在提交表单之前验证所有的表单域。
例如:<form method="post" action="xxx.htm" onsubmit="return checkForm()">
(4) onMouseOver onMouseOut
onMouseOver 和 onMouseOut 用来创建“动态的”按钮。
(5) 更多参看JavaScript 事件参考手册

6. 处理异常
有两种在网页中捕获错误的方法:
· 使用 try...catch 语句。(在 IE5+、Mozilla 1.0、和 Netscape 6 中可用)
· 使用 onerror 事件。这是用于捕获错误的老式方法。(Netscape 3 以后的版本可用)
备注
1》throw 声明的作用是创建 exception(异常)。可以把这个声明与 try...catch 声明配合使用,以达到控制程序流并产生精确错误消息的目的。例如:throw(exception); 在此,exception 可以是字符串、整数、逻辑值或者对象。
2》浏览器是否显示标准的错误消息,取决于 onerror 的返回值。如果返回值为 false,则在控制台 (JavaScript console) 中显示错误消息。反之则不会。

7. JavaScript对象
(1) JavaScript 对象

对象

描述
Window
JavaScript 层级中的顶层对象。Window 对象表示浏览器窗口。每当 <body> 或者 <frameset> 标签出现,Window 对象就会被自动创建。
Navigator
包含客户端浏览器的信息。
Screen
包含客户端显示屏的信息。
History
包含了浏览器窗口访问过的 URL。
Location
包含了当前URL的信息。
内置对象
描述
String
字符串
Date
日期
Array
数组
Boolean
逻辑
Math
算术,算数
RegExp
正则表达式
(2) HTML DOM
HTML DOM 是 W3C 标准(是 HTML 文档对象模型的英文缩写,Document Object Model for HTML)。HTML DOM 独立于平台和编程语言。它可被任何编程语言诸如 Java、JavaScript 和 VBScript 使用。

对象

描述
Document
代表整个 HTML 文档,用来访问页面中的所有元素。
Anchor
代表 <a> 元素。
Area
代表图像地图中的 <area> 元素。
Base
代表 <base> 元素。
Body
代表图像地图中的 <body> 元素。
Button
代表 <button> 元素。
Event
代表事件的状态
Form
代表 <form> 元素
Frame
代表 <frame> 元素
Frameset
代表 <frameset> 元素
Iframe
代表 <iframe> 元素
Image
代表 <img> 元素
Input button
代表 HTML 表单中的按钮
Input checkbox
代表 HTML 表单中的选择框
Input file
代表 HTML 表单中的 fileupload 。
Input hidden
代表 HTML 表单中的隐藏域。
Input password
代表 HTML 表单中的密码域。
Input radio
代表 HTML 表单中的单选框。
Input reset
代表 HTML 表单中的重置按钮。
Input submit
代表 HTML 表单中的确认按钮。
Input text
代表 HTML 表单中的文本输入域。
Link
代表 <link> 元素
Meta
代表 <meta> 元素
Object
代表一个 <Object> 元素
Option
代表 <option> 元素
Select
代表 HTML 表单中的选择列表。
Style
代表某个单独的样式声明。
Table
代表 <table> 元素。
TableData
代表 <td> 元素。
TableRow
代表 <tr> 元素。
Textarea
代表 <textarea> 元素。
8. JavaScript高级编程
(1) 浏览器检测:
Navigator对象 包含了有关访问者浏览器的信息,包括浏览器类型、版本等等。
重要事项:在 IE 5.0 及以后版本中,版本号是不正确的!在 IE 5.0 和 IE 6.0 中,微软为 appVersion 字符串赋的值是 4.0。怎么会出现这样的错误呢?无论如何,我们需要清楚的是,JavaScript 在 IE6、IE5 和 IE4 中的获得的版本号是相同的。
(2) 创建,存储cookie
cookie 是存储于访问者的计算机中的变量。在这个变量中可以存储帐号密码日期等信息。每当同一台计算机通过浏览器请求某个页面时,就会发送这个 cookie。你可以使用 JavaScript 来创建和取回 cookie 的值。

(3) JavaScript 表单验证
JavaScript 可用来在数据被送往服务器前对 HTML 表单中的这些输入数据进行验证。被 JavaScript 验证的这些典型的表单数据有:
· 用户是否已填写表单中的必填项目?
· 用户输入的邮件地址是否合法?
· 用户是否已输入合法的日期
· 用户是否在数据域 (numeric field) 中输入了文本?
(4) 动画,图像地图
1> 动画可以通过响应不同的事件载入不同的图像,达到动画效果;
2> 图像地图是带有可点击区域的图像。通常情况下,每个区域是一个相关的超级链接。单击某个区域,就回到达相关的链接。
3> 例子:(这张图像上,点击这三个区域链接向不同的页面)

<img src ="planets.gif" width ="145" height ="126" alt="Planets" usemap ="#planetmap" />
<map id ="planetmap" name="planetmap">
<area shape ="rect" coords ="0,0,82,126" href ="sun.htm" target ="_blank"
alt="Sun" />
<area shape ="circle" coords ="90,58,3" href ="mercur.htm" target ="_blank"
alt="Mercury" />
<area shape ="circle" coords ="124,58,8" href ="venus.htm" target ="_blank"
alt="Venus" />
</map>

(5) 计时使用setTimeout()和clearTimeout()两个函数完成。
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: