3.3 流程控制语句(和java一样这里就简略带过)
3.3.1 if条件语句
语法格式
if (condition)
{
当条件为 true 时执行的代码
}else{
当条件为 true 时执行的代码
}
3.3.2 switch多分支语句
语法格式
switch(n)
{
case 1:
执行代码块 1
break;
case 2:
执行代码块 2
break;
default:
与 case 1 和 case 2 不同时执行的代码
}
3.3.3 for循环语句
语法格式
for (语句 1; 语句 2; 语句 3)
{
被执行的代码块
}
3.3.4 while循环语句
语法格式
while (条件)
{
需要执行的代码
}
3.3.5 do...while循环语句
语法格式
do
{
需要执行的代码
}
while (条件);
3.3.6 break和continue语句
break
语句用于跳出循环。
continue
用于跳过循环中的一个迭代。
3.4 函数
3.4.1 函数的定义
语法格式
function functionName(parameters) {
statements;
[return expression;]
}
- functionName,必须项,函数的名字,一个页面中函数的名字是唯一的,区分大小写
- parameters,可选项,用于指定参数列表,当使用多个参数时,参数间用逗号隔开
- statements,必选项,是函数体
- expression 可选项,用于返回函数值
3.4.1 函数的调用
示例代码
function myFunction(a, b) {
return a * b;
}
myFunction(10, 2); // myFunction(10, 2) 返回 20
3.5 事件处理
3.5.1 什么是事件处理
HTML 事件是发生在 HTML 元素上的事情。
当在 HTML 页面中使用 JavaScript 时, JavaScript 可以触发这些事件。HTML 事件可以是浏览器行为,也可以是用户行为。
3.5.2 JavaScript常用事件
JavaScript的常用事件
事件 | 描述 |
---|---|
onabort | 图像的加载被中断。 ( <object>) |
onblur | 元素失去焦点时触发 |
onchange | 该事件在表单元素的内容改变时触发( <input>, <keygen>, <select>, 和 <textarea>) |
onclick | 用户点击 HTML 元素 |
ondblclick | 当用户双击某个对象时调用的事件句柄。 |
onerror | 在加载文档或图像时发生错误。 ( <object>, <body>和 <frameset>) |
onfocus | 元素获取焦点时触发 |
onkeydown | 某个键盘按键被按下。 |
onkeyoress | 某个键盘按键被按下并松开。 |
onkeyup | 某个键盘按键被松开。 |
onload | 浏览器已完成页面的加载 |
onmousedown | 鼠标按钮被按下。 |
onmousemove | 鼠标被移动。 |
onmouseout | 用户从一个HTML元素上移开鼠标 |
onmouseover | 用户在一个HTML元素上移动鼠标 |
onmouseup | 鼠标按键被松开。 |
onreset | 表单重置时触发 |
onresize | 窗口或框架被重新调整大小。 |
onscroll | 当文档被滚动时发生的事件。 |
onselect | 用户选取文本时触发 ( <input> 和 <textarea>) |
onsubmit | 表单提交时触发 |
onunload | 用户退出页面。 ( <body> 和 <frameset>) |
更多事件参照JavaScript参考手册 -HTML DOM事件
3.5.3 事件处理程序的调用
1.在 JavaScript中
示例代码
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>JavaWeb自学</title>
</head>
<body>
<button onclick="getDate()">现在的时间是?</button>
<p id="demo"></p>
<script>
function getDate(){
document.getElementById("demo").innerHTML=Date();
}
</script>
</body>
</html>
2.在 HTML中
示例代码
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>JavaWeb自学</title>
</head>
<body>
<button onclick="getElementById('demo').innerHTML=Date()">现在的时间是?</button>
<p id="demo"></p>
</body>
</html>
3.6常用对象
3.6.1 Window 对象
1.属性
属性 | 描述 |
---|---|
document | 对 Document 对象的只读引用。(请参阅对象) |
defaultStatus | 设置或返回窗口状态栏中的默认文本。 |
frames | 返回窗口中所有命名的框架。该集合是 Window 对象的数组,每个 Window 对象在窗口中含有一个框架。 |
location | 用于窗口或框架的 Location 对象。请参阅 Location 对象。 |
length | 设置或返回窗口中的框架数量。 |
history | 对 History 对象的只读引用。请参数 History 对象。 |
name | 设置或返回窗口的名称。 |
status | 设置窗口状态栏的文本。 |
top | 返回最顶层的父窗口。 |
opener | 返回对创建此窗口的窗口的引用。 |
closed | 返回窗口是否已被关闭。 |
self | 返回对当前窗口的引用。等价于 Window 属性。 |
screen | 对 Screen 对象的只读引用。请参数 Screen 对象。 |
navigator | 对 Navigator 对象的只读引用。请参数 Navigator 对象。 |
innerHeight | 返回窗口的文档显示区的高度。 |
innerWidth | 返回窗口的文档显示区的宽度。 |
localStorage | 在浏览器中存储 key/value 对。没有过期时间。 |
2.方法(常用)
方法 | 描述 |
---|---|
alert() | 显示带有一段消息和一个确认按钮的警告框。 |
confirm() | 显示带有一段消息以及确认按钮和取消按钮的对话框。 |
prompt() | 显示可提示用户输入的对话框。 |
blur() | 把键盘焦点从顶层窗口移开。 |
close() | 关闭浏览器窗口。 |
focus() | 把键盘焦点给予一个窗口。 |
open() | 打开一个新的浏览器窗口或查找一个已命名的窗口。 |
scrollTo() | 把内容滚动到指定的坐标。 |
scrollBy() | 按照指定的像素值来滚动内容。 |
setTimeout() | 在指定的毫秒数后调用函数或计算表达式。 |
clearTimeout() | 取消由 setTimeout() 方法设置的 timeout。 |
moveBy() | 可相对窗口的当前坐标把它移动指定的像素。 |
moveTo() | 把窗口的左上角移动到一个指定的坐标。 |
resizeBy() | 按照指定的像素调整窗口的大小。 |
resizeTo() | 把窗口的大小调整到指定的宽度和高度。 |
print() | 打印当前窗口的内容。 |
setInterval() | 按照指定的周期(以毫秒计)来调用函数或计算表达式。 |
clearInterval() | 取消由 setInterval() 设置的 timeout。 |
3.6.2 String 对象
1.语法格式
var txt = new String("string");
或者更简单方式:
var txt = "string";
2.属性
属性 | 描述 |
---|---|
length | 字符串的长度 |
prototype | 允许您向对象添加属性和方法 |
3.方法
方法 | 描述 |
---|---|
charAt() | 返回在指定位置的字符。 |
charCodeAt() | 返回在指定的位置的字符的 Unicode 编码。 |
concat() | 连接两个或更多字符串,并返回新的字符串。 |
fromCharCode() | 将 Unicode 编码转为字符。 |
indexOf() | 返回某个指定的字符串值在字符串中首次出现的位置。 |
includes() | 查找字符串中是否包含指定的子字符串。 |
lastIndexOf() | 从后向前搜索字符串,并从起始位置(0) 开始计算返回字符串最后出现的位置。 |
match() | 查找找到一个或多个正则表达式的匹配。 |
repeat() | 复制字符串指定次数,并将它们连接在一起返回。 |
replace() | 在字符串中查找匹配的子串, 并替换与正则表达式匹配的子串。 |
search() | 查找与正则表达式相匹配的值。 |
slice() | 提取字符串的片断,并在新的字符串中返回被提取的部分。 |
split() | 把字符串分割为字符串数组。 |
startsWith() | 查看字符串是否以指定的子字符串开头。 |
substr() | 从起始索引号提取字符串中指定数目的字符。 |
substring() | 提取字符串中两个指定的索引号之间的字符。 |
toLowerCase() | 把字符串转换为小写。 |
toUpperCase() | 把字符串转换为大写。 |
trim() | 去除字符串两边的空白 |
toLocaleLowerCase() | 根据本地主机的语言环境把字符串转换为小写。 |
toLocaleUpperCase() | 根据本地主机的语言环境把字符串转换为大写。 |
valueOf() | 返回某个字符串对象的原始值。 |
toString() | 返回一个字符串。 |
3.6.3 Date 对象
1.语法格式
var d = new Date();
var d = new Date(milliseconds);
var d = new Date(dateString);
var d = new Date(year, month, day, hours, minutes, seconds, milliseconds);
2.属性
属性 | 描述 |
---|---|
constructor | 返回对创建此对象的 Date 函数的引用。 |
prototype | 使您有能力向对象添加属性和方法。 |
3.方法(常用)
方法 | 描述 |
---|---|
getDate() | 从 Date 对象返回一个月中的某一天 (1 ~ 31)。 |
getDay() | 从 Date 对象返回一周中的某一天 (0 ~ 6)。 |
getFullYear() | 从 Date 对象以四位数字返回年份。 |
getHours() | 返回 Date 对象的小时 (0 ~ 23)。 |
getMilliseconds() | 返回 Date 对象的毫秒(0 ~ 999)。 |
3.6.4 Array 对象
1.语法格式
var cars = ["Saab", "Volvo", "BMW"];
2.属性
属性 | 描述 |
---|---|
constructor | 返回创建数组对象的原型函数。 |
length | 设置或返回数组元素的个数。 |
prototype | 允许你向数组对象添加属性或方法。 |
3.方法(常用)
方法 | 描述 |
---|---|
indexOf() | 搜索数组中的元素,并返回它所在的位置。 |
sort() | 对数组的元素进行排序。 |
toString() | 把数组转换为字符串,并返回结果。 |
findIndex() | 返回符合传入测试(函数)条件的数组元素索引。 |
valueOf() | 返回数组对象的原始值。 |
3.6.5 Math 对象
Math 对象教程,请参JavaScript Math 对象教程。
3.6.6 Number 对象
1.语法格式
var num = new Number(value);
2.属性
属性 | 描述 |
---|---|
constructor | 返回对创建此对象的 Number 函数的引用。 |
MAX_VALUE | 可表示的最大的数。 |
MIN_VALUE | 可表示的最小的数。 |
NEGATIVE_INFINITY | 负无穷大,溢出时返回该值。 |
NaN | 非数字值。 |
POSITIVE_INFINITY | 正无穷大,溢出时返回该值。 |
prototype | 允许您可以向对象添加属性和方法。 |
3.方法(常用)
方法 | 描述 |
---|---|
isFinite | 检测指定参数是否为无穷大。 |
toExponential(x) | 把对象的值转换为指数计数法。 |
toFixed(x) | 把数字转换为字符串,结果的小数点后有指定位数的数字。 |
toPrecision(x) | 把数字格式化为指定的长度。 |
toString() | 把数字转换为字符串,使用指定的基数。 |
valueOf() | 返回一个 Number 对象的基本数字值。 |
3.6.7 RegExp 对象
正则表达式是描述字符模式的对象。请参考JavaScript RegExp教程
网友评论