JavaScript脚本语言基础（二）
导读：
JavaScript条件语句
JavaScript循环语句
JavaScript网页中错误捕获
JavaScript的Break和Continue命令
JavaScript的转义字符
1、JavaScript条件语句[返回]
在JavaScript中，可以使用下面4种条件语句：
- if 语句：在一个指定的条件成立时执行代码；
- if...else 语句：在指定的条件成立时执行代码，当条件不成立时执行另外的代码；
- if...else if....else 语句：使用这个语句可以选择执行若干块代码中的一个；
- switch 语句：使用这个语句可以选择执行若干块代码中的一个。
用法如下：
#Code 201：JavaScript条件语句案例
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>银河网络统计学教程</title>
<style></style>
<script language="JavaScript">
document.write('<p><b>1、if语句实例</b></p>');
var d=new Date(); //JS日期时间对象
var time=d.getHours(); //获得当前时间
//打开这个HTML文档时，如果时间早于上午10点，显示“早晨好。打开时间从10点开始不显示问候语。
//猜猜看，什么时候问候’中午好！‘？”
if (time<10) {document.write("<b>早上好！</b>");}
if (time==11) {document.write("<i>中午好！</i>");}
document.write("<p><b>2、if...else语句实例</b></p>");
if (time < 10) {
document.write("<i>早上好!</i>");
} else {
document.write("<i>中午好或者下午好!</i>");
}
document.write("<p><b>3、if...else语句可以用JS的三目运算符</b></p>");
time < 10 ? document.write("<i>早上好!</i>") : document.write("<i>中午好或者下午好!</i>");
5 > 3 ? document.write("<p/>5大于3") : document.write("<p/>5小3");
document.write('<p><b>4、If...else if...else语句实例</b></p>');
if (time<10) {
document.write("<i>早上好！</i>");
} else if (time>10 && time<16) { //可以并行使用多个else if
document.write("<i>中午好</i>");
} else { //else结尾，其它条件都不满足执行else内脚本
document.write("<i>下午好!</i>");
}
document.write('<p><b>5、Switch语句实例</b></p>');
theDay=d.getDay();
switch (theDay) {
case 5:
document.write("<i>Finally Friday</i>");
break;
case 6:
document.write("<i>Super Saturday</i>");
break;
case 0:
document.write("<i>Sleepy Sunday</i>");
break;
default:
document.write("<i>I'm looking forward to this weekend!</i>")
}
</script>
</head>
<body onload="init()">
</body>
</html>
2、JavaScript循环语句[返回]
JavaScript 有以下几种种不同种类的循环：
- for循环：在脚本的运行次数已确定的情况下使用for循环，将一段代码循环执行指定的次数；
- while循环：用于在指定条件为 true 时循环执行代码；
- do...while循环：do...while 循环是while循环的变种。该循环程序在初次运行时会首先执行一遍其中的代码，然后当指定的条件为true时，它会继续这个循环。所以可以这么说，do...while 循环为执行至少一遍其中的代码，即使条件为 false，因为其中的代码执行后才会进行条件验证；
- for in循环：遍历一个对象的所有属性。
在网页中用法如下：
#Code 202：JavaScript循环语句案例
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>银河网络统计学教程</title>
<style></style>
<script language="JavaScript">
document.write('<p><b>1、for 循环</b></p>');
//for循环程序，这个程序中 i 的起始值为 0。每执行一次循环，i 的值就会累加一次 1，循环会一直运行下去，直到 i 等于10 为止
var i=0;
for (i=0; i<=10; i++) {
document.write("The number is " + i);
document.write("<br />");
}
document.write("<p><b>2、while循环</b></p>");
//while循环程序，这个循环程序的参数 i 的起始值为 0。该程序会反复运行，直到 i 大于 10 为止。i 的步进值为 1。
i=0; //变量i重新赋值
while (i<=10) {
document.write("The number is " + i);
document.write("<br />");
i=i+1; //每次循环后i+1
}
document.write("<p><b>3、do...while循环</b></p>");
//do...while循环程序，这个循环程序的参数 i 的起始值为 0，程序在初次运行时会首先执行一遍其中的代码，然后后才会进行条件验证。由于循环程序执行一次后，i变为1，循环终止。
i=0;
do {
document.write("The number is " + i);
document.write("<br/>");
i=i+1;
}
while (i<0)
document.write('<p><b>4、for in循环（遍历对象）</b></p>');
var obj = {name:"Mary",age:23,gender:"female",number:[21,23,35]}
for(var s in obj) {document.write("属性名称："+s+"；属性值："+obj[s]+"；变量类型："+typeof obj[s]+"<br/>");}
</script>
</head>
<body onload="init()">
</body>
</html>
3、JavaScript网页中错误捕获[返回]
有两种在网页中捕获错误的方法：
- try...catch 语句(在IE5+、Mozilla 1.0、和 Netscape 6 中可用): Try...Catch 语句: 可以测试代码中的错误。try 部分包含需要运行的代码，而 catch 部分包含错误发生时运行的代码;
- onerror 事件。用于捕获错误的老式方法(Netscape 3 以后的版本可用)：如果需要利用 onerror 事件，就必须创建一个处理错误的函数。你可以把这个函数叫作 onerror 事件处理器 (onerror event handler)。这个事件处理器使用三个参数来调用：msg（错误消息）、url（发生错误的页面的 url）、line（发生错误的代码行）。
（1）try...catch用法实例
#Code 203：JavaScript网页中错误捕获案例（1）
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>银河网络统计学教程</title>
<style></style>
<script language="JavaScript">
var txt="";
function message() {
try { //在此运行代码
alerty("欢迎您!"); //误写成alerty，trycatch捕捉错误
} catch(err) { //在此处理错误
txt="此页面存在一个错误！<br/>";
txt+="错误名称: " + err.name + "<br/>";
txt+="错误编号: " + err.number + "<br/>";
txt+="错误描述: " + err.description + "<br/>";
txt+="错误信息: " + err.message + "<br/>";
document.write(txt);
}
}
</script>
</head>
<body onload="message()">
</body>
</html>
在try...catch 语句中，可以添加throw声明的作用是创建 exception（异常或错误）。
这个声明与try...catch 声明配合使用，以达到控制程序流并产生精确错误消息的目的。exception 可以是字符串、整数、逻辑值或者对象。
举例如下：
#Code 204：JavaScript网页中错误捕获案例（2）
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>银河网络统计学教程</title>
<style></style>
<script language="JavaScript">
function message() {
var x=prompt("Enter a number between 0 and 10:","");
try {
if(x>10) {
throw "Err1";
} else if (x<0) {
throw "Err2";
} else {
alert("The value is right!");
}
} catch(er) {
if(er=="Err1") {alert("Error! The value is too high");}
if(er == "Err2") {alert("Error! The value is too low");}
message();
}
}
</script>
</head>
<body onload="message()">
</body>
</html>
（2）onerror 事件用法实例
#Code 205：JavaScript网页中错误捕获案例（3）
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>银河网络统计学教程</title>
<style></style>
<script language="JavaScript">
onerror=handleErr;
var txt="";
function handleErr(msg,url,line) {
txt="There was an error on this page.\n\n";
txt+="Error: " + msg + "\n";
txt+="URL: " + url + "\n";
txt+="Line: " + line + "\n\n";
txt+="Click OK to continue.\n\n";
alert(txt);
return true;
}
function message() {alert("Welcome guest!");}
</script>
</head>
<body onload="message()">
</body>
</html>
如果用 onerror 事件，就必须创建一个处理错误的函数。可以把这个函数叫作 onerror 事件处理器 (onerror event handler)。这个事件处理器使用三个参数来调用：msg（错误消息）、url（发生错误的页面的 url）、line（发生错误的代码行）。
4、JavaScript的Break和Continue命令[返回]
JavaScript的break 和 continue命令用在 for 循环中的语句中。
- break 命令可以终止循环的运行，然后继续执行循环之后的代码（如果循环之后有代码的话）；
- continue 命令会终止当前的循环，然后从下一个值继续运行。
（1）break用法：
<script type="text/javascript">
for (var i=0; i<=10; i++) {
if (i==3){break;}
document.write("The number is " + i +"<br/>");
}
</script>
注：Ctrl+c：复制； Ctrl+x：剪切； Ctrl+v：粘贴；
将script标签内的JavaScript脚步代码复制、粘贴到银河统计JavaScript脚本测试工具，运行结果如下：
The number is 0
The number is 1
The number is 2
（2）continue用法：
<script type="text/javascript">
for (var i=0; i<=10; i++) {
if (i==3){continue;}
document.write("The number is " + i);
document.write("<br/>");
}
</script>
注：Ctrl+c：复制； Ctrl+x：剪切； Ctrl+v：粘贴；
将script标签内的JavaScript脚步代码复制、粘贴到银河统计JavaScript脚本测试工具，运行结果如下：
The number is 0
The number is 1
The number is 2
The number is 4
The number is 5
The number is 6
The number is 7
The number is 8
The number is 9
The number is 10
5、JavaScript的转义字符[返回]
可以在 JavaScript 中使用反斜杠来向文本字符串添加特殊字符。对于某些特殊的字符，无法用键盘直接键入，这时就需要使用转义字符。还有一些字符（符号）用于特殊的用途，比如引号，如果要在字符串内包含引号，就需要使用转义字符。切记，每一个转义字符都是以反斜杠“\”开始的。
（1）无法用键盘录入的转义字符
| 转义字符 | 字符 |
|---|---|
| \b | 退格符 |
| \f | 换页符 |
| \n | 换行符 |
| \r | 回车符 |
| \t | 制表符 |
| \" | 双引号 |
| \' | 单引号 |
| \\ | 反斜杠 |
（2）特殊用途符号转义字符
| 字符 | 转义字符 |
|---|---|
| 点的转义：. | \\u002E |
| 美元符号的转义：$ | \\u0024 |
| 乘方符号的转义：^ | \\u005E |
| 左大括号的转义：{ | \\u007B |
| 左方括号的转义：[ | \\u005B |
| 左圆括号的转义：( | \\u0028 |
| 竖线的转义：| | \\u007C |
| 右方括号转义：] | \\u005D |
| 右圆括号的转义：) | \\u0029 |
| 星号的转义：* | \\u002A |
| 加号的转义：+ | \\u002B |
| 问号的转义：? | \\u003F |
| 反斜杠的转义：\ | \\u005C |
JavaScript代码如下：
<script type="text/javascript">
var oStr="我的名字叫\“张三\”，这段文字已经被双引号，按JS语法规则，双引号中不能包括双引号。为了显示是姓名被双引号，在姓名双引号前加反斜杠。";
document.write(oStr);
</script>
注：Ctrl+c：复制； Ctrl+x：剪切； Ctrl+v：粘贴；
将script标签内的JavaScript脚步代码复制、粘贴到银河统计JavaScript脚本测试工具，运行结果如下：
我的名字叫“张三”，这段文字已经被双引号，按JS语法规则，双引号中不能包括双引号。为了显示是姓名被双引号，在姓名双引号前加反斜杠。
注：这段文字为引号嵌套，但姓名的引号前使用了转移符号“\”，使得document.write(oStr)可以正确显示。
JavaScript语法练习参见本站提供的银河统计JavaScript脚本测试工具和W3School JavaScript在线教程。
JavaScript脚本语言基础（二）的更多相关文章
- JavaScript脚本语言基础（四）
导读: JavaScript和DOM DOM文档对象常用方法和属性 DOW文档对象运用 JSON数据交换格式 正则表达式 1.JavaScript和DOM [返回] 文档对象模型(Document O ...
- JavaScript脚本语言基础（一）
导读: JavaScript代码嵌入HTML文档 JavaScript代码运行方式 第一个实例 JavaScript的三种对话框 定义JavaScript变量 JavaScript运算符和操作符 Ja ...
- JavaScript脚本语言基础（三）
导读: 数学对象(Math) 数组对象(Array) 字符串对象(String) 日期对象(Date) js对象是属性和方法的集合.JavaScript中的所有事物都是对象,如:字符串.数值.数组.函 ...
- 2017.9.22 HTML学习总结--JavaScript脚本语言
接上: 1.JavaScript脚本语言 定义:javascript是一种简单的脚本语言,可以在浏览器中直接运行, 是一种在浏览器端实现网页与客户交互的技术javascript代码可 以直接运行在ht ...
- 9月12日JavaScript脚本语言
JS脚本语言 JS脚本语言全称JavaScript,是网页里面使用的脚本语言,也是一门非常强大的语言. 一.基础语法 1.注释语法 单行注释:// 多行注释:/**/ 2.输出语法 ①alert(信息 ...
- groovy脚本语言基础1
一 搭建groovy环境 安装JDK [root@node1 ~]# yum -y install java-11-openjdk 官网下载groovySDK下载 https://groovy.ap ...
- VBA中使用JavaScript脚本语言解析JSON数据
JSON:JavaScript 对象表示法(JavaScript Object Notation) 和xml相似,都是文本形式(保存在文本文件中或字符串等形式),比如: jsstr = {" ...
- TCL脚本语言基础介绍
Tcl简介(一):Tcl 语法 Tcl 语法 Tcl是一种很通用的脚本语言,它几乎在所有的平台上都可以释运行,其强大的功能和简单精妙的语法会使你感到由衷的喜悦,这片文章对 Tcl有很好的描述和说明.如 ...
- 关于JavaScript(脚本语言)
1.typeof运算符:判断一个对象是否是什么类型,返回“” 一.数字类型(Number) 1.javascript不擅长计算,不能用于浮点数的计算.如:var a = 0.2; var b = 0. ...
随机推荐
- 继承Prototype实现语句不能写在动态原型法中的理解
阅读javascript高级编程中, 对动态原型法中写Prototype继承父类对象的不可行的现象,不甚理解. 书上说是技术原因,如下有问题代码: 但是把protype语句移到构造函数后面,就OK,如 ...
- Python之配置文件模块 ConfigParser
写项目肯定用的到配置文件,这次学习一下python中的配置文件模块 ConfigParser 安装就不说了,pip一下即可,直接来个实例 配置文件 project.conf [db] host = ' ...
- python 归档tarfile,zipfile学习
一.tarfile 用法: tarfile.open(cls, name=None, mode='r', fileobj=None, bufsize=10240, **kwargs) 返回一个Tar ...
- find 命令使用总结
参考:http://os.51cto.com/art/200908/141119.htm 1.find命令的一般形式 find pathname -options [-print -exec -ok ...
- Java基础(58):Eclipse中的快捷键大全（转）
Eclipse快捷键大全(转载) Ctrl+1 快速修复(最经典的快捷键,就不用多说了)Ctrl+D: 删除当前行 Ctrl+Alt+↓ 复制当前行到下一行(复制增加)Ctrl+Alt+↑ 复制当前行 ...
- UML： 协作图
摘自http://www.umlonline.org/school/thread-38-1-1.html UML1.1时,协作图英文名字叫:Collaboration Diagram,UML2.0时, ...
- bzoj4448 [Scoi2015]情报传递
第一问不解释,对于第二问的处理,可以使用cdq分治,假设分治的询问区间是[L,R],那么我们对于标号在[L,mid]的修改操作赋予一个权值,因为在当前[L,R]中[L,mid]的修改操作只会对[mid ...
- CCF真题之相邻数对
201409-1 问题描述 给定n个不同的整数,问这些数中有多少对整数,它们的值正好相差1. 输入格式 输入的第一行包含一个整数n,表示给定整数的个数. 第二行包含所给定的n个整数. 输出格式 输出一 ...
- angular form 验证 ngMessage
<!DOCTYPE HTML> <html ng-app="deliciousApp"> <head> <meta charset=&qu ...
- 安装Elasticsearch,Logstash,Kibana（5.0.1－mac版）
安装Elasticsearch 1.下载https://artifacts.elastic.co/downloads/elasticsearch/elasticsearch-5.0.1.tar.gz包 ...