JavaScript 入门(上)

时间:2023-02-09 13:55:51


目录

​​一、JavaScript简介​​

​​二、JavaScript的特点​​

​​1、动态改变页面内容​​

​​2、动态改变网页的外观​​

​​3、验证表单数据​​

​​4、响应事件​​

​​三、内容​​

​​1、JavaScript简介​​

​​一、JavaScript是什么?​​

​​二、JavaScript编辑工具​​

​​三、JavaScript在HTML的引用方式​​

​​四、JavaScript和Java的关系​​

​​五、训练题​​

​​2、JavaScript入门基础​​

​​一、数据结构​​

​​二、JavaScript数据类型​​

​​三、运算符​​

​​四、typeof运算符​​

​​五、表达式​​

​​六、类型转换​​

​​七、JavaScript基本语法​​

​​八、JavaScript注释​​

​​3、流程控制​​

​​一、选择结构​​

​​二、循环结构​​

​​三、跳转语句​​

​​四、训练题​​

​​4、函数​​

​​一、函数是什么?​​

​​二、函数的定义​​

​​三、函数的调用​​

​​四、特殊函数​​

​​五、练习题​​

​​5、内置函数​​

​​一、eval()函数​​

​​二、isFinite()函数​​

​​三、isNaN()函数​​

​​四、parseInt()函数和parseFloat()函数​​

​​五、escape函数和unescape函数​​

​​六、训练题​​

​​6、字符串对象​​

​​一、JavaScript字符串对象简介​​

​​二、length属性简介​​

​​三、match()方法简介​​

​​四、search()方法简介​​

​​五、indexOf()方法简介​​

​​六、replace()方法简介​​

​​七、charAt()方法简介​​

​​八、字符串英文大小写转化​​

​​九、连接字符串​​

​​十、比较字符串​​

​​十一、split()方法​​

​​十二、从字符串提取字符串​​

​​7、日期对象​​

​​一、创建日期对象​​

​​二、日期对象方法​​


预备知识与后续知识及项目案例

​​[HTML入门与进阶以及HTML5]​​[CSS]
[JS-上]
[JS-下]
[jQuery]
[Node.js + Gulp 知识点汇总]
[MongoDB + Express 入门及案例代码]
[Vue项目开发-仿蘑菇街电商APP]

一、JavaScript简介

JavaScript,就是我们通常所说的JS,是一种嵌入到HTML页面中的脚本语言,由浏览器一边解释一边执行。

我们在“​​HTML入门教程​​​”中的“​​前端技术简介​​”中深入浅出地讲解了HTML、CSS和JavaScript之间的关系,这一篇文章分量很重,大家没看过的记得回去看一下。

HTML、CSS和JavaScript的关系如下:

“HTML是网页的结构,CSS是网页的外观,而JavaScript是页面的行为。”

我们都知道单纯的HTML页面是静态的(只供浏览),而JavaScript的出现,把静态的页面转换成支持用户交互并响应相应事件的动态页面。那么在我们平常的浏览的网页中,都有哪些地方用到了JavaScript呢?

我们就拿绿叶学习网来说,导航、tabs选项卡、回顶部这些地方都用到了JavaScript。HTML只是一门描述性的语言,这些地方单纯地使用HTML是无法实现的,而必须使用编程的方式来实现,那就必须使用JavaScript了。

JavaScript 入门(上)

JavaScript 入门(上)

 

JavaScript 入门(上)

二、JavaScript的特点

HTML页面是静态的,而JavaScript可以弥补HTML语言的缺陷,实现Web页面客户端的动态效果。JavaScript的作用有以下几点:

1、动态改变页面内容

HTML页面是静态的,一旦编写,内容是无法改变的。JavaScript可以弥补这个不足,可以将内容动态地显示在网页中。

2、动态改变网页的外观

JavaScript通过修改网页元素的CSS样式,达到动态地改变网页的外观。

3、验证表单数据

我们常见的在各大网站中的注册中的验证功能,就是JavaScript实现的。

4、响应事件

JavaScript是基于事件的语言。例如点击一个按钮弹出一个对话框,就是鼠标点击触发的事件,例如绿叶学习网教程文章中的点赞效果:

对于JavaScript的理解,就一句话:如果没有使用JavaScript,网页就是静态的,唯一的功能就是给用户浏览。加入了JavaScript,网页变得绚丽多彩起来。

三、内容

1、JavaScript简介

一、JavaScript是什么?

1、HTML是网页的结构,CSS是网页的外观,而JavaScript是页面的行为。

2、HTML页面是静态的(只供浏览),平常我们所见到的各种网页特效就是使用JavaScript实现的。

二、JavaScript编辑工具

常用的JavaScript编辑工具有:

(1)记事本;

(2)Dreamweaver;

(3)UltraEdit-32;

(4)Visual Studio;

(5)sublime Text

绿叶学习网系列教程推荐使用Visual Studio作为网站开发工具。

三、JavaScript在HTML的引用方式

JavaScript在HTML的引用方式共有4种:

(1)页头引入(head标签内);

(2)页中引入(body标签内);

(3)元素事件中引入(标签属性中引入);

(4)引入外部JS文件;

四、JavaScript和Java的关系

JavaScript和Java只有一毛钱的关系,无他。

JavaScript和Java虽然名字相似,但是本质上是不同的。

(1)JavaScript往往都是在网页中使用,而Java却可以在软件、网页、手机App等各个领域中使用;

(2)Java是一门面向对象的语言,而从本质上讲,JavaScript更像是一门函数式编程语言;

五、训练题

在进入JavaScript基础学习之前,先让大家接触一下神奇的javascript程序究竟是怎样的?

这个例子实现的功能是:在页面打开时候,弹出对话框显示“欢迎您来到绿叶学习网!”。

程序代码实现如下:


​​<html xmlns=​​​​"http://www.w3.org/1999/xhtml"​​​​>​​
​​<head>​​
​​<title>第一个javascript程序</title>​​
​​<script type=​​​​"text/javascript"​​​​>​​
​​function​​​ ​​enterMes()​​
​​{ ​​
​​alert(​​​​"欢迎您来到绿叶学习网!"​​​​);​​
​​}​​
​​window.onload=enterMes();​​
​​</script>​​
​​</head>​​
​​<body>​​
​​</body>​​
​​</html>​​
1



刚刚打开这个页面时,在浏览器预览效果如下:

JavaScript 入门(上)

2、JavaScript入门基础

一、数据结构

JavaScript的数据结构包括:标识符、关键字、常量、变量等。

1、标识符

标识符,说白了,就是一个名字。在JavaScript中,变量和函数等都需要定义一个名字,这个名字就可以称为“标识符”。

JavaScript语言中标识符最重要的3点就是:

(1)第一个字符必须是字母、下划线(_)或美元符号这3种其中之一,其后的字符可以是字母、数字或下划线、美元符号;

(2)变量名不能包含空格、加号、减号等符号;

(3)标识符不能和JavaScript中用于其他目的的关键字同名;

2、关键字

JavaScript关键字是指在JavaScript语言中有特定含义,成为JavaScript语法中一部分的那些字。

3、常量

常量,顾名思义就是指不能改变的量。常量的指从定义开始就是固定的,一直到程序结束。

常量主要用于为程序提供固定和精确的值,包括数值和字符串,如数字、逻辑值真(true)、逻辑值假(false)等都是常量。

4、变量

变量,顾名思义,就是指在程序运行过程中,其值是可以改变的。

二、JavaScript数据类型

JavaScript数据类型有2大分类:一是“基本数据类型”,二是“特殊数据类型”。

其中,基本数据类型包括以下3种:

  • (1)数字型(Number型):如整型84,浮点型3.14;
  • (2)字符串型(String型):如"绿叶学习网";
  • (3)布尔型(Boolean型):true或fasle;

特殊数据类型有3种:

  • (1)空值(null型);
  • (2)未定义值(undefined型);
  • (3)转义字符;

根据个人的开发经验中,只需要记忆\n、\'、\"这3个就已经够初学者走很远了,其他的转义字符我们完全没必要去记忆,到时候需要的时候再回来查表就行了,大家别浪费脑细胞喔。

三、运算符

JavaScript的运算符按运算符类型可以分为以下5种:

(1)算术运算符;

(2)比较运算符;

(3)赋值运算符;

(4)逻辑运算符;

(5)条件运算符;

四、typeof运算符

typeof运算符用于返回它的操作数当前所容纳的数据的类型,这对于判断一个变量是否已被定义特别有用。

例如:typeof(1)返回值是number,typeof("javascript")返回值是string。

五、表达式

表达式是一个语句的集合,计算结果是个单一值。

在JavaScript中,常见的表达式有4种:

(1)赋值表达式;

(2)算术表达式;

(3)布尔表达式;

(4)字符串表达式;

六、类型转换

1、字符串型转换为数值型

在JavaScript中,将字符串型数据转换为数值型数据有parseInt()和parseFloat()这2种方法。其中,parseInt()可以将字符串转换为整型数据;parseFloat()可以将字符串转换为浮点型数据。

语法:


​​parseInt()  ​​​​//将字符串型转换为整型​​
​​parseFloat() ​​​​//将字符串型转换为浮点型​​



2、数值型转换为字符串型

在JavaScript中,将数值型数据(整型或浮点型)转换为字符串,都是使用toString()方法。

语法:


​​.toString()​​



七、JavaScript基本语法

1、执行顺序

JavaScript程序按照在HTML文档中出现的顺序逐行执行。如果需要在整个HTML文件中执行,最好将其放在HTML文件的标签中。某些代码,如函数体内的代码,不会被立即执行,只有当所在的函数被其他程序调用时,该代码才会被执行。

2、区分大小写

JavaScript是严格区分大小写的。例如str和Str这是两个完全不同的变量。

3、分号和空格

在JavaScript中,语句的分号“;”是可有可无的。但是我们强烈要求大家在每一句语句后面加一个分号“;”,这是一个非常重要的代码编写习惯。

另外,JavaScript会忽略多余的空格,用户可以向脚本添加空格,来提高代码的可读性,说白了就是让代码“漂亮点”,读得舒服一点。

例如:


​​var​​​ ​​str=​​​​"绿叶学习网JavaScript教程"​​​​;​​
​​var​​​ ​​str = ​​​​"绿叶学习网JavaScript教程"​​​​; ​​​​//这一行代码读起来舒服一点​​



八、JavaScript注释

在编写JavaScript代码时,我们经常要在一些关键代码旁做一下注释,这样做的好处很多。

语法:


​​//单行注释内容​​
​​/*多行注释内容*/​​



“//”是单行注释方式,如果你的注释内容只占一行就应该使用这种注释方式。“/**/”是多行注释方式,如果你的注释内容占多行建议使用这种注释方式。

3、流程控制

JavaScript对程序流程的控制跟其他编程语言是一样的,主要有3种:

(1)顺序结构;

(2)选择结构;

(3)循环结构;

一、选择结构

在JavaScript中,选择结构共有5种:

(1)if语句;

(2)if……else语句;

(3)if……else if……语句;

(4)if语句的嵌套;

(5)switch语句;

二、循环结构

在JavaScript中,循环结构总有3种:

(1)while语句;

(2)do……while语句;

(3)for语句;

三、跳转语句

JavaScript支持的跳转语句主要有2种:

(1)break语句;

(2)continue语句;

break语句与continue语句的主要区别是:break是彻底结束循环,而continue是结束本次循环。在这一点跟其他编程语言(如C和Java)相同。

四、训练题

(1)题目:计算100以内所有奇数的和比较简单,使用for语句就可以实现。

代码实现如下:


​​<!DOCTYPE html> ​​
​​<html xmlns=​​​​"http://www.w3.org/1999/xhtml"​​​​>​​
​​<head>​​
​​<title></title>​​
​​<script type=​​​​"text/javascript"​​​​>​​
​​var​​​ ​​sum=0;​​
​​for​​​​(​​​​var​​​ ​​i=1;i<100;i+=2)​​
​​{ ​​
​​sum+=i;​​
​​}​​
​​document.write(​​​​"100以内所有奇数和为:"​​​​+sum);​​
​​</script>​​
​​</head>​​
​​<body>​​
​​</body>​​
​​</html>​​



在浏览器预览效果如下:

JavaScript 入门(上)

分析:

“i+=2”等价于“i=i+2”,“sum+=i”等价于“sum=sum+i”。这些基础的东西可别忘了。

(2)

题目:输出所有的“水仙花数”。所谓“水仙花数”是指一个3位数,其各位数字立方和等于该数的本身。例如,153就是一个水仙花数,因为153=13+53+33。

代码实现如下:


<!DOCTYPE html> ​​
​​<html xmlns=​​​​"http://www.w3.org/1999/xhtml"​​​​>​​
​​<head>​​
​​<title></title>​​
​​<script type=​​​​"text/javascript"​​​​>​​
​​document.write(​​​​"水仙花数有:"​​​​);​​
​​for​​​​(​​​​var​​​ ​​i=100;i<1000;i++)​​
​​{ ​​
​​var​​​ ​​a=i%10;​​​​//提取个位数​​
​​var​​​ ​​b=(i/10)%10 ​​​​//提取十位数​​
​​b=parseInt(b);​​
​​var​​​ ​​c=i/100;​​​​//提取百位数​​
​​c=parseInt(c);​​
​​if​​​​(i==(a*a*a+b*b*b+c*c*c))​​
​​{ ​​
​​document.write(i+​​​​","​​​​);​​
​​}​​
​​}​​
​​</script>​​
​​</head>​​
​​<body>​​
​​</body>​​
​​</html>​​



在浏览器预览效果如下:

JavaScript 入门(上)

分析:

parseInt()函数是将一个数转换为整型数据,我们在“​​JavaScript类型转换​​”这一节中已经详细给大家讲解了。

(3)

题目:找出字符串中“how are you doing?”中所有小于字母“s”的字符,并在页面输出。

代码实现如下:


<!DOCTYPE html> ​​
​​<html xmlns=​​​​"http://www.w3.org/1999/xhtml"​​​​>​​
​​<head>​​
​​<title></title>​​
​​<script type=​​​​"text/javascript"​​​​>​​
​​document.write(​​​​"水仙花数有:"​​​​);​​
​​for​​​​(​​​​var​​​ ​​i=100;i<1000;i++)​​
​​{ ​​
​​var​​​ ​​a=i%10;​​​​//提取个位数​​
​​var​​​ ​​b=(i/10)%10 ​​​​//提取十位数​​
​​b=parseInt(b);​​
​​var​​​ ​​c=i/100;​​​​//提取百位数​​
​​c=parseInt(c);​​
​​if​​​​(i==(a*a*a+b*b*b+c*c*c))​​
​​{ ​​
​​document.write(i+​​​​","​​​​);​​
​​}​​
​​}​​
​​</script>​​
​​</head>​​
​​<body>​​
​​</body>​​
​​</html>​​




在浏览器预览效果如下:

JavaScript 入门(上)

分析:

这些是字符串的内容,如果大家不懂没关系,现在只是让大家接触一下。因为例子要是太过于简单,大家学得也没有激情。这些在“​​JavaScript字符串对象​​”这一章中,我们会详细讲解到。

4、函数

一、函数是什么?

函数,就是一个一系列JavaScript语句的集合,这是为了完成某一个会重复使用的特定功能。在需要该功能的时候,直接调用函数即可,而不必每次都编写一大堆重复的代码。并且在需要修改该功能的时候,也只要修改和维护这一个函数即可。

总之,将语句集合成函数,好处就是方便代码重用。并且,一个好的函数名,可以让人一眼就知道这个函数实现的是什么功能,方便维护。

函数的使用只需要2步:

(1)定义函数;

(2)调用函数;

二、函数的定义

在JavaScript中,使用函数前,必须用function关键字来定义函数。

函数常用方式有2种:

(1)不指定函数名的函数;

(2)指定函数名的函数;

1、不指定函数名的函数

语法:


​​function​​​​(参数1,参数2,….,参数n)​​
​​{ ​​
​​//函数体语句​​
​​}​​
1



说明:

定义函数必须使用function关键字。

2、指定函数名的函数

“指定函数名的函数”是JavaScript中使用最广泛的方法,反而“不指定函数名的函数”用得比较少。

语法:


​​function​​​ ​​函数名(参数1,参数2,….,参数n)​​
​​{ ​​
​​//函数体语句​​
​​return​​​ ​​表达式;​​
​​}​​



说明:

定义函数必须使用function关键字来定义。

函数名必须是唯一的,尽量通俗易懂,并且跟你定义的代码有关。

函数可以使用return语句将某个值返回,也可以没有返回值。

参数是可选的,可以不带参数,也可以带多个参数。如果是多个参数的话,参数之间要用英文逗号隔开。

三、函数的调用

常用的函数调用方式有4种:

(1)简单调用;

(2)在表达式中调用;

(3)在事件响应中调用;

(4)通过链接调用;

四、特殊函数

JavaScript特殊函数有3种:

  • (1)嵌套函数;
  • (2)递归函数;
  • (3)内置函数;

下面详细给大家讲解一下这3中函数调用方式。

1、嵌套函数

嵌套函数,顾名思义,就是在一个函数的内部定义另外一个函数。不过在内部定义的函数只能在内部调用,如果在外部调用,就会出错。

举例:


​​<!DOCTYPE html>​​
​​<html xmlns=​​​​"http://www.w3.org/1999/xhtml"​​​​>​​
​​<head>​​
​​<title></title>​​
​​<script type=​​​​"text/javascript"​​​​>​​
​​//定义阶乘函数​​
​​function​​​ ​​fun(a)​​
​​{ ​​
​​//嵌套函数定义,计算平方值的函数​​
​​function​​​ ​​multi (x)​​
​​{ ​​
​​return​​​ ​​x*x;​​
​​}​​
​​var​​​ ​​m=1;​​
​​for​​​​(​​​​var​​​ ​​i=1;i<=multi(a);i++)​​
​​{ ​​
​​m=m*i;​​
​​}​​
​​return​​​ ​​m;​​
​​}​​
​​var​​​ ​​sum =fun(2)+fun(3);​​
​​document.write(sum);​​
​​</script>​​
​​</head>​​
​​<body>​​
​​</body>​​
​​</html>​​
1



在浏览器预览效果如下:

JavaScript 入门(上)

分析:

上面定义的multi函数只能在fun函数内部使用,如果在fun函数外部调用就会出错,大家可以在“在线测试”中自己修改代码测试一下。

2、递归函数

递归函数是一种非常重要的编程技术,当年我在学习其他编程技术(如C、C++、Java等)都经常用到。

递归函数用于让一个函数从其内部调用其本身。不过需要注意的是,如果递归函数处理不当,就会使程序陷入“死循环”。为了防止“死循环”的出现,可以设计一个做自加运算的变量,用于记录函数自身调用的次数,如果次数太多就让它自动退出循环。

语法:


​​function​​​ ​​递归函数名(参数1)​​
​​{ ​​
​​递归函数名(参数2)​​
​​}​​



说明:

在定义递归函数时,需要2个必要条件:

(1)首先包括一个结束递归的条件;

(2)其次包括一个递归调用的语句;

举例:


​​<!DOCTYPE html>​​
​​<html xmlns=​​​​"http://www.w3.org/1999/xhtml"​​​​>​​
​​<head>​​
​​<title></title>​​
​​<script type=​​​​"text/javascript"​​​​>​​
​​var​​​ ​​msg=​​​​"\n函数的递归调用:\n\n"​​​​;​​
​​//响应按钮的点击事件​​
​​function​​​ ​​Test()​​
​​{ ​​
​​var​​​ ​​result;​​
​​msg+=​​​​"调用语句:\n"​​​​;​​
​​msg+=​​​​" result=sum(20);\n"​​​​;​​
​​msg+=​​​​"调用步骤:\n"​​​​;​​
​​result=sum(20);​​
​​msg+=​​​​"计算结果:\n"​​​​;​​
​​msg+=​​​​" result="​​​​+result+​​​​"\n"​​​​;​​
​​alert(msg);​​
​​}​​
​​//计算当前步骤加和值​​
​​function​​​ ​​sum(m)​​
​​{ ​​
​​if​​​​(m==0)​​
​​{ ​​
​​return​​​ ​​0;​​
​​}​​
​​else​​
​​{ ​​
​​msg+=​​​​" result="​​​​+m+​​​​"+sum("​​​​+(m-2)+ ​​​​");\n"​​​​;​​
​​result=m+sum(m-2);​​
​​}​​
​​return​​​ ​​result;​​
​​}​​
​​</script>​​
​​</head>​​
​​<body>​​
​​<input type=​​​​"button"​​​ ​​value=​​​​"测试"​​​ ​​onclick=​​​​"Test()"​​​​/>​​
​​</body>​​
​​</html>​​



在浏览器预览效果如下:

JavaScript 入门(上)

分析:

在上述代码中,为了求取20以内的偶数和,定义了递归函数sum(m),而函数Test()对其进行调用,并使用alert()方法弹出相应的提示信息。

递归函数对于初学者来说可能比较难以理解,如果实在不会,可以直接忽略它。因为在JavaScript中是比较少用到递归函数的,递归函数往往都是在其他编程语言中用得比较多。到时候需要的时候我们回来翻翻就OK了。

3、内置函数

JavaScript中有2种函数:一种是用户自定义函数,另外一种是JavaScript语言内部已经定义好了,可以直接供我们调用的函数(也就是内置函数)。

内置函数由于已经在JavaScript语言内部定义好了的,也就是我们不需要自己定义就能用了。这样极大方便了我们的编程。

五、JavaScript函数中的参数(arguments)

arguments

 argument是JavaScript中的一个关键字,用于指向调用者传入的所有参数。

 

 即使不定义参数,也可以取到调用者的参数。

 

REST

 由于JavaScript函数允许接收任意个参数,所以不得不用arguments来获取函数定义a以外的参数。

 

 其实ES6给了新的rest参数,用在函数最后,多余的参数以数组的形式交给变量rest,如果传入的参数未填满函数定义的参数,rest会是一个空数组。

六、练习题

(1)

题目:在页面中添加两个单行文本框,在两个文本框中输入两个数字,使用​​JavaScript函数​​比较这两个函数大小,并使用对话框输出最大数。

实现代码如下:

举例:


​​<!DOCTYPE html>​​
​​<html xmlns=​​​​"http://www.w3.org/1999/xhtml"​​​​>​​
​​<head>​​
​​<title></title>​​
​​<script type=​​​​"text/javascript"​​​​>​​
​​function​​​ ​​maxNum()​​
​​{ ​​
​​//获取两个文本框的值​​
​​var​​​ ​​x = document.getElementById(​​​​"num1"​​​​).value;​​
​​var​​​ ​​y = document.getElementById(​​​​"num2"​​​​).value;​​
​​//强制转换为数值型​​
​​x = parseFloat(x);​​
​​y = parseFloat(y);​​
​​if​​​​(x<y)​​
​​{ ​​
​​alert(​​​​"最大数是:"​​​​+y);​​
​​}​​
​​else​​
​​{ ​​
​​alert(​​​​"最大数是:"​​​​+x);​​
​​}​​
​​}​​
​​</script>​​
​​</head>​​
​​<body>​​
​​第一个数是:<input type=​​​​"text"​​​ ​​id=​​​​"num1"​​​​/><br/>​​
​​第二个数是:<input type=​​​​"text"​​​ ​​id=​​​​"num2"​​​​/><br/>​​
​​<input type=​​​​"button"​​​ ​​onclick=​​​​"maxNum()"​​​ ​​value=​​​​"计算"​​​​/>​​
​​</body>​​
​​</html>​​
1



在浏览器预览效果如下:

JavaScript 入门(上)

我们随便输入两个数字如“50和100”,然后点击“计算”按钮即可输出最大数,效果如下:

JavaScript 入门(上)

分析:

这一个程序非常简单,但是包含的信息量不少。

document.getElementById()类似于CSS中的id选择器,而document.getElementById("num1").value表示选取id为num1的元素并获取它的值。这个方法经常用到,大家要记一下。我们在后续课程会给大家详细讲解。

这里用到了函数调用的其中一个方式“在事件中调用函数”。<input type="button" οnclick="maxNum()"/>表示在按钮点击的时候执行函数maxNum()。

此外,还有一点要注意的是:有些同学呀,在定义这个函数的时候定义的函数名是max,然后发现出错了!oh~,其实那是你忽略了很基础的一点,那就是自己定义的函数名是不能与JavaScript内部定义的函数名相同。

(2)

题目:写一个函数,输入一个4位数字,要求使用对话框输出这4个数字字符,但每两个数字之间留一个空格,如输入1992,应输出“1 9 9 2”。

代码实现如下:

举例:


​​<!DOCTYPE html>​​
​​<html xmlns=​​​​"http://www.w3.org/1999/xhtml"​​​​>​​
​​<head>​​
​​<title></title>​​
​​<script type=​​​​"text/javascript"​​​​>​​
​​function​​​ ​​strNum()​​
​​{ ​​
​​//获取输入文本框中的值,这里获取的值是一个字符串​​
​​var​​​ ​​s = document.getElementById(​​​​"num"​​​​).value;​​
​​var​​​ ​​s1=​​​​""​​​​;​​
​​for​​​​(​​​​var​​​ ​​i=0;i<4;i++)​​
​​{ ​​
​​//如果获取的不是最后一个字符​​
​​if​​​​(i!=3)​​
​​{ ​​
​​s1+=s.charAt(i)+ ​​​​" "​​​​;​​
​​}​​
​​//如果获取的是最后一个字符​​
​​else​​
​​{ ​​
​​s1+=s.charAt(i);​​
​​}​​
​​}​​
​​alert(s1);​​
​​}​​
​​</script>​​
​​</head>​​
​​<body>​​
​​输入数字是:<input type=​​​​"text"​​​ ​​id=​​​​"num"​​​​/><br/>​​
​​<input type=​​​​"button"​​​ ​​onclick=​​​​"strNum()"​​​ ​​value=​​​​"提交"​​​​/>​​
​​</body>​​
​​</html>​​
1



在浏览器预览效果如下:

JavaScript 入门(上)

在文本框输入2015,然后点击“提交”按钮,效果如下:

JavaScript 入门(上)

分析:

这里再一次用到了document.getElementById(),而字符串操作的​​charAt()方法​​我们在上一章的练习中也接触了,详细内容我们在字符串对象这一章会讲解。程序还是比较简单的,大家琢磨一下。

5、内置函数

在JavaScript中,常用的内置函数有7个:

(1)eval()函数

(2)isFinite()函数

(3)isNaN()函数

(4)parseInt()函数

(5)parseFloat()函数

(6)escape()函数

(7)unescape()函数

一、eval()函数

在JavaScript中,​​eval()函数​​可以把一个字符串当做一个JavaScript表达式一样去执行它。例如:

eval(​​​​"document.write('<strong>JavaScript入门教程</strong> ')"​​​​);​​



上面语句说白了就是执行“document.write('JavaScript入门教程 ')”,eval()函数用了等于没用一样。这是这种“多此一举”的做法,在实际开发很少用到eval()函数。

二、isFinite()函数

在JavaScript中,​​isFinite()函数​​用来确定某一个数是否是一个有限数值。

语法:


​​isFinite(number)​​



说明:

number参数是必选的,可以是任意的数值,例如整型、浮点型数据。

如果该参数为非数字、正无穷数和负无穷数,则返回false;否则的话,返回true。如果是字符串类型的数字,就会自动转化为数字型。

三、isNaN()函数

语法:


​​isNaN(参数)​​



说明:

这里的参数可以是任何类型的数据,例如数字型、字符串型、日期时间型等。不过得注意一点,当参数是“字符串类型的数字”,就会自动转换为数字型。

例如:

四、parseInt()函数和parseFloat()函数

在JavaScript中,将字符串型数据转换为数值型数据有​​parseInt()和parseFloat()​​这2种方法。其中,parseInt()可以将字符串转换为整型数据;parseFloat()可以将字符串转换为浮点型数据。

语法:


​​parseInt()  ​​​​//将字符串型转换为整型​​
​​parseFloat() ​​​​//将字符串型转换为浮点型​​



说明:

将字符串型转换为整型,前提是字符串一定要是数值字符串。那什么叫数值字符串呢?“123”、“3.1415”这些只有数字的字符串就是数值字符串,而“hao123”、“360cn”等就不是数值字符串。

五、escape函数和unescape函数

escape()函数主要作用就是对字符串进行编码,以便它们能在所有计算机上可读。

​unescape()函数和escape()函数​​是刚好反过来的,escape()函数是编码,unescape()函数是解码。

1、escape函数

escape()函数主要作用就是对字符串进行编码,以便它们能在所有计算机上可读。

语法:


​​escape(charString)​​



说明:

charString是必选参数,表示要进行编码的字符串或文字。escape()函数返回一个包含charString内容的字符串值(Unicode格式)。除了个别如“*@”之类的符号外,其余所有空格、标点符号以及其他非ASCII字符均可用“%xx”这种形式的编码代替,其中xx等于表示该字符的十六进制数。

举例:


​​<!DOCTYPE html>​​
​​<html xmlns=​​​​"http://www.w3.org/1999/xhtml"​​​​>​​
​​<head>​​
​​<title></title>​​
​​<script type=​​​​"text/javascript"​​​​>​​
​​document.write(escape(​​​​"hello lvye!"​​​​))​​
​​</script>​​
​​</head>​​
​​<body>​​
​​</body>​​
​​</html>​​
1



在浏览器预览效果如下:

JavaScript 入门(上)

分析:

空格符对应的编码是“%20”,感叹号对应的编码是“%21”,因此执行escape("hello lvye!")后结果为“hello%20lvye%21”。

2、unescape()函数

escape()函数和unescape()函数是刚好反过来的,前者是编码,后者是解码。

语法:


​​unescape(charString)​​


说明:

charString是必选参数,表示要进行解码的字符串。unescape()函数返回指定值的ASCII字符串。与escape()函数相反,unescape()函数返回一个包含charString内容的字符串值,所有以“%xx”十六进制形式编码的字符都用ASCII字符集中等价的字符代替。

举例:


​​<!DOCTYPE html>​​
​​<html xmlns=​​​​"http://www.w3.org/1999/xhtml"​​​​>​​
​​<head>​​
​​<title></title>​​
​​<script type=​​​​"text/javascript"​​​​>​​
​​document.write(unescape(​​​​"hello%20lvye%21"​​​​))​​
​​</script>​​
​​</head>​​
​​<body>​​
​​</body>​​
​​</html>​​
1



在浏览器预览效果如下:

JavaScript 入门(上)

分析:

空格符对应的编码是“%20”,感叹号对应的编码是“%21”,因此执行unescape("hello%20lvye%21")后结果为“hello lvye!”。

六、训练题

在线escape加解密工具制作

代码实现如下:


​​<!DOCTYPE html>​​
​​<html xmlns=​​​​"http://www.w3.org/1999/xhtml"​​​​>​​
​​<head>​​
​​<title></title>​​
​​//定义基本样式​​
​​<style type=​​​​"text/css"​​​​>​​
​​#txt-input,#txt-output​​
​​{ ​​
​​height:60px;​​
​​}​​
​​</style>​​
​​<script type=​​​​"text/javascript"​​​​>​​
​​//定义加密函数​​
​​function​​​ ​​encrypt() ​​
​​{ ​​
​​//获取输入框的值​​
​​var​​​ ​​str = document.getElementById(​​​​"txt-input"​​​​).value;​​
​​//将输入框的值加密,并赋给输出框​​
​​document.getElementById(​​​​"txt-ouput"​​​​).value = escape(str);​​
​​}​​
​​//定义解密函数​​
​​function​​​ ​​decrypt() ​​
​​{ ​​
​​//获取输入框的值​​
​​var​​​ ​​str = document.getElementById(​​​​"txt-input"​​​​).value;​​
​​//将输入框的值加密,并赋给输出框​​
​​document.getElementById(​​​​"txt-ouput"​​​​).value = unescape(str);​​
​​}​​
​​</script>​​
​​</head>​​
​​<body>​​
​​<form>​​
​​<textarea id=​​​​"txt-input"​​​ ​​cols=​​​​"20"​​​​></textarea><br />​​
​​<input id=​​​​"btn-encrypt"​​​ ​​type=​​​​"button"​​​ ​​value=​​​​"加密"​​​ ​​onclick=​​​​"encrypt()"​​​​/>​​
​​<input id=​​​​"btn-decrypt"​​​ ​​type=​​​​"button"​​​ ​​value=​​​​"解密"​​​ ​​onclick=​​​​"decrypt()"​​​​/>​​
​​<input id=​​​​"Reset1"​​​ ​​type=​​​​"reset"​​​ ​​value=​​​​"清空"​​​ ​​/><br />​​
​​<textarea id=​​​​"txt-ouput"​​​ ​​cols=​​​​"20"​​​​></textarea>​​
​​</form>​​
​​</body>​​
​​</html>​​
1



在浏览器预览效果如下(IE浏览器):

JavaScript 入门(上)

分析:

(1)重置按钮的作用域是同一个form标签内部的文本框,这一点请参考“​​HTML入门教程​​​”中的“​​按钮button​​”这一节;

(2)这里再次用到了document.getElementById()这一JavaScript的id选择器,这次大家打死都要记住这一个语句了,在之前都讲解了3次以上了;

(3)这个在线工具逻辑已经实现,界面还比较粗糙,剩下的就交给大家润色了。

6、字符串对象

一、JavaScript字符串对象简介

字符串,是程序设计中经常使用的一种数据类型,在每一种编程语言中都非常非常的重要。

这一章我们给大家详细地介绍JavaScript中的字符串对象string,然后给大家讲解一下各种操作字符串的技巧。有可能这些技巧一时半会你用不上,但是学习知识有一种说法是:你只有接触了某个知识点,即使将来你已经忘记了这个知识点具体是怎样的了,不过你却能想到用这么一个知识去帮你解决某些问题。但是,如果你没有接触这个知识点,你大脑是完全对这个知识没有概念,你连翻书的份都没,还谈解决什么问题?额,说得有点拗口,不过也是我作为程序猿多年的经验。

字符串对象string有很多方法,例如match()方法、search()方法、replace()方法等。有可能这些方法你学了一阵子都忘记具体语法是怎样的了,其实你不要埋怨自己笨,因为不经常用的知识,我们往往都容易忘记。等你需要用到这些语法了,再回来翻翻就可以了。然后经历过多次使用了,这些语法就根深蒂固了。

不过呢,在此说一下,在这一章包括之前或之后的章节,对象都有很多方法或属性,不要求每一种都掌握,但是至少我们要去看看,这样我们在以后开发中需要用到的时候,大脑“仅存”的记忆都能提醒我们要用到哪些知识点,然后我们回来翻翻就行了。

二、length属性简介

在JavaScript中,对于字符串来说,要掌握的属性就只有一个,那就是length属性。我们可以通过length属性来获取字符串的长度。

语法:


​​字符串名.length​​



说明:

length属性很简单,但是在字符串操作中经常要用到,这个大家一定要记住。

举例:


​​<!DOCTYPE html>​​
​​<html xmlns=​​​​"http://www.w3.org/1999/xhtml"​​​​>​​
​​<head>​​
​​<title></title>​​
​​<script type=​​​​"text/javascript"​​​​>​​
​​var​​​ ​​str=​​​​"I love lvye!"​​​​;​​
​​document.write(​​​​"字符串长度是:"​​​​+str.length);​​
​​</script>​​
​​</head>​​
​​<body>​​
​​</body>​​
​​</html>​​
1



在浏览器预览效果如下:

JavaScript 入门(上)

三、match()方法简介

在JavaScript中,使用match()方法可以从字符串内索引指定的值,或者找到一个或多个正则表达式的匹配。

语法:


​​stringObject.match(字符串)    ​​​​//匹配字符串;​​
​​stringObject.match(正则表达式) ​​​​//匹配正则表达式​​



说明:

stringObject指的是字符串对象。match()方法类似于​​indexOf()方法​​,但是它返回的是指定的值,而不是字符串的位置。

下面来看一个例子,大家就懂了。

举例:


​​<!DOCTYPE html>​​
​​<html xmlns=​​​​"http://www.w3.org/1999/xhtml"​​​​>​​
​​<head>​​
​​<title></title>​​
​​<script type=​​​​"text/javascript"​​​​>​​
​​var​​​ ​​str=​​​​"Hello World!"​​​​;​​
​​document.write(str.match(​​​​"world"​​​​)+​​​​"<br/>"​​​​);​​
​​document.write(str.match(​​​​"World"​​​​)+​​​​"<br/>"​​​​);​​
​​document.write(str.match(​​​​"worlld"​​​​)+​​​​"<br/>"​​​​);​​
​​document.write(str.match(​​​​"world!"​​​​));​​
​​</script>​​
​​</head>​​
​​<body>​​
​​</body>​​
​​</html>​​
1



在浏览器预览效果如下:

JavaScript 入门(上)

分析:

说白了,match()方法就是用来检索一个字符串是否存在。如果存在的话,返回要检索的字符串;如果不存在的话,返回null。

四、search()方法简介

在JavaScript中,search() 方法用于检索字符串中指定的子字符串,或检索与​​正则表达式​​相匹配的子字符串。

语法:


​​stringObject.search(字符串)      ​​​​//检索字符串;​​
​​stringObject.search(正则表达式) ​​​​//检索正则表达式​​



说明:

stringObject指的是字符串对象。search()方法返回的是子字符串的起始位置,如果没有找到任何匹配的子串,则返回-1。

举例:


​​<!DOCTYPE html>​​
​​<html xmlns=​​​​"http://www.w3.org/1999/xhtml"​​​​>​​
​​<head>​​
​​<title></title>​​
​​<script type=​​​​"text/javascript"​​​​>​​
​​var​​​ ​​str = ​​​​"I love lvyestudy!"​​​​;​​
​​document.write(str.search(​​​​"lvye"​​​​)+​​​​"<br/>"​​​​);​​
​​document.write(str.search(​​​​"html"​​​​));​​
​​</script>​​
​​</head>​​
​​<body>​​
​​</body>​​
​​</html>​​
1



在浏览器预览效果如下:

JavaScript 入门(上)

分析:

str.search("lvye")表示检索字符串"I love lvyestudy!"是否存在子字符串"lvye",由于存在,所以返回"lvye"在字符串"I love lvyestudy!"中的起始位置7(字符串索引从0开始)。

str.search("html")表示检索字符串"I love lvyestudy!"是否存在子字符串"html",由于不存在,因此返回-1。

五、indexOf()方法简介

在JavaScript中,可以使用indexOf() 方法可返回某个指定的字符串值在字符串中首次出现的位置。

语法:


​​stringObject.indexOf(字符串)​​



说明:

stringObject表示字符串对象。indexOf()方法跟search()方法差不多,跟match()方法类似,不同的是indexOf()方法返回的是字符串的位置,而match()方法返回的是指定的字符串。

举例:


​​<!DOCTYPE html>​​
​​<html xmlns=​​​​"http://www.w3.org/1999/xhtml"​​​​>​​
​​<head>​​
​​<title></title>​​
​​<script type=​​​​"text/javascript"​​​​>​​
​​var​​​ ​​str=​​​​"Hello World!"​​​​;​​
​​document.write(str. indexOf (​​​​"world"​​​​)+​​​​"<br/>"​​​​);​​
​​document.write(str. indexOf (​​​​"World"​​​​)+​​​​"<br/>"​​​​);​​
​​document.write(str. indexOf (​​​​"worlld"​​​​)+​​​​"<br/>"​​​​);​​
​​document.write(str. indexOf (​​​​"world!"​​​​));​​
​​</script>​​
​​</head>​​
​​<body>​​
​​</body>​​
​​</html>​​



在浏览器预览效果如下:

JavaScript 入门(上)

六、replace()方法简介

在JavaScript中,replace()方法常常用于在字符串中用一些字符替换另一些字符,或者替换一个与​​正则表达式​​匹配的子串。

语法:


​​stringObject.replace(原字符,替换字符)    ​​
​​stringObject.replace(正则表达式,替换字符) ​​​​//匹配正则表达式​​



举例:


​​<!DOCTYPE html>​​
​​<html xmlns=​​​​"http://www.w3.org/1999/xhtml"​​​​>​​
​​<head>​​
​​<title></title>​​
​​<script type=​​​​"text/javascript"​​​​>​​
​​var​​​ ​​str =​​​​"I love javascript!"​​​​;​​
​​var​​​ ​​str_new=str.replace(​​​​"javascript"​​​​,​​​​"lvyestudy"​​​​);​​
​​document.write(str_new);​​
​​</script>​​
​​</head>​​
​​<body>​​
​​</body>​​
​​</html>​​
1



在浏览器预览效果如下:

JavaScript 入门(上)

分析:

str.replace("javascript","lvyestudy")表示用"lvyestudy"替换str中的"javascript"。

七、charAt()方法简介

在JavaScript中,可以使用charAt()方法来获取字符串中的某一个字符。这个方法我们在之前的教程中已经多次接触了。这个方法非常好用,在实际开发中也经常用到。

语法:

说明:

string.Object表示字符串对象。n是数字,表示字符串中第几个字符。注意,字符串中第一个字符的下标是0,第二个字符的下标是1,以此类推。

举例:


​​<!DOCTYPE html>​​
​​<html xmlns=​​​​"http://www.w3.org/1999/xhtml"​​​​>​​
​​<head>​​
​​<title></title>​​
​​<script type=​​​​"text/javascript"​​​​>​​
​​var​​​ ​​str = ​​​​"Hello lvye!"​​​​;​​
​​document.write(str.charAt(0)+​​​​"<br/>"​​​​);​​
​​document.write(str.charAt(4));​​
​​</script>​​
​​</head>​​
​​<body>​​
​​</body>​​
​​</html>​​
1



在浏览器预览效果如下:

JavaScript 入门(上)

八、字符串英文大小写转化

在JavaScript中,使用toLowerCase()和toUpperCase()这两种方法来转化字符串的大小写。其中,toLowerCase()方法将大写字符串转换为小写字符串;toUpperCase()将小写字符串转换为大写字符串。

语法:


​​字符串名. toLowerCase()    ​​​​//将大写字符串转换为小写字符串​​
​​字符串名. toUpperCase() ​​​​//将小写字符串转换为大写字符串​​



说明:

此外,还有2种大小写转化方法:toLocaleLowerCase()和toLocaleUpperCase()。这两个方法我们有可能一辈子都用不到,大家要是别的书籍中看到,可以直接忽略。

举例:


​​<!DOCTYPE html>​​
​​<html xmlns=​​​​"http://www.w3.org/1999/xhtml"​​​​>​​
​​<head>​​
​​<title></title>​​
​​<script type=​​​​"text/javascript"​​​​>​​
​​var​​​ ​​str=​​​​"Hello Wordl!"​​​​;​​
​​document.write(​​​​"以正常方式显示为:"​​​​+str+​​​​"<br/>"​​​​);​​
​​document.write(​​​​"以小写方式显示为:"​​​​+str. toLowerCase()+​​​​"<br/>"​​​​);​​
​​document.write(​​​​"以大写方式显示为:"​​​​+str. toUpperCase());​​
​​</script>​​
​​</head>​​
​​<body>​​
​​</body>​​
​​</html>​​



在浏览器预览效果如下:

JavaScript 入门(上)

九、连接字符串

在JavaScript中,可以使用concat()方法来连接2个或多个字符串。

语法:


​​字符串1.concat(字符串2,字符串3,…,字符串n);​​



说明:

concat()方法将“字符串2,字符串3,…,字符串n”按照顺序连接到字符串1的尾部,并返回连接后的字符串。

举例:


​​<!DOCTYPE html>​​
​​<html xmlns=​​​​"http://www.w3.org/1999/xhtml"​​​​>​​
​​<head>​​
​​<title></title>​​
​​<script type=​​​​"text/javascript"​​​​>​​
​​var​​​ ​​str1=​​​​"毛扇指千阵,"​​​​;​​
​​var​​​ ​​str2=​​​​"铁马踏冰河,"​​​​;​​
​​var​​​ ​​str3=​​​​"黄沙破楼兰。"​​​​;​​
​​var​​​ ​​str4=str1+str2+str3;​​
​​var​​​ ​​str5=str1.concat(str2,str3);​​
​​document.write(str4+​​​​"<br/>"​​​​);​​
​​document.write(str5);​​
​​</script>​​
​​</head>​​
​​<body>​​
​​</body>​​
​​</html>​​
1



在浏览器预览效果如下:

JavaScript 入门(上)

分析:

大家可以看到,原来连接字符串可以有2种方式,一种是使用concat()方法,另外一种更加简单,使用“+”运算符就可以了。在这里大家也明白我的良苦用心了吧。就是说,以后大家连接字符串别傻乎乎地用concat()方法,直接将字符串相加就可以了。

十、比较字符串

在javascript中,可以使用localeCompare()方法用本地特定的顺序来比较两个字符串。

语法:


字符串1.localeCompare(字符串2)​​



说明:

比较完成后,返回值是一个数字。

(1)如果字符串1小于字符串2,则返回小于0的数字;

(2)如果字符串1大于字符串2,则返回数字1;

(3)如果字符串1等于字符串2,则返回数字0;

举例:


​​<!DOCTYPE html>​​
​​<html xmlns=​​​​"http://www.w3.org/1999/xhtml"​​​​>​​
​​<head>​​
​​<title></title>​​
​​<script type=​​​​"text/javascript"​​​​>​​
​​var​​​ ​​str1= ​​​​"JavaScript"​​​​;​​
​​var​​​ ​​str2 = ​​​​"javascript"​​​​;​​
​​var​​​ ​​str3 = str1.localeCompare(str2);​​
​​document.write(str3);​​
​​</script>​​
​​</head>​​
​​<body>​​
​​</body>​​
​​</html>​​



在浏览器预览效果如下:

JavaScript 入门(上)

十一、split()方法

在javascript中,可以使用split()方法把一个字符串分割成字符串数组。

语法:


字符串.split(分割符)


说明:

分割符可以是一个字符、多个字符或一个​​正则表达式​​。分割符并不作为返回数组元素的一部分。

举例:


​​<!DOCTYPE html>​​
​​<html xmlns=​​​​"http://www.w3.org/1999/xhtml"​​​​>​​
​​<head>​​
​​<title></title>​​
​​<script type=​​​​"text/javascript"​​​​>​​
​​var​​​ ​​str =​​​​"I love lvyestudy!"​​​​;​​
​​var​​​ ​​arr=​​​​new​​​ ​​Array();​​
​​arr=str.split(​​​​" "​​​​);​​
​​document.write(arr);​​
​​</script>​​
​​</head>​​
​​<body>​​
​​</body>​​
​​</html>​​
1



在浏览器预览效果如下:

JavaScript 入门(上)

分析:

str.split(" ")表示字符串以空格作为分割符,而arr其实就是一个数组。。split()方法虽然简单,但是在实际开发中经常会用到,大家一定要记住喔。

对于数组,我们会在数组对象那一章详细讲解。

十二、从字符串提取字符串

在JavaScript中,可以使用substring()方法来提取字符串中的某一部分字符串。

语法:


字符串.substring(开始位置,结束位置)​​



说明:

开始位置是一个非负的整数,表示从哪个位置开始截取。结束位置也是一个非负的整数,表示在哪里结束截取。

举例:


​​<!DOCTYPE html>​​
​​<html xmlns=​​​​"http://www.w3.org/1999/xhtml"​​​​>​​
​​<head>​​
​​<title></title>​​
​​<script type=​​​​"text/javascript"​​​​>​​
​​var​​​ ​​str1=​​​​"绿叶学习网JavaScript教程"​​​​;​​
​​var​​​ ​​str2=str1.substring(5,15);​​
​​document.write(str2);​​
​​</script>​​
​​</head>​​
​​<body>​​
​​</body>​​
​​</html>​​
1



在浏览器预览效果如下:

JavaScript 入门(上)

7、日期对象

一、创建日期对象

在JavaScript中,创建日期对象必须使用“new语句”。使用关键字new新建日期对象时,常用的有2种:

方法一:


​​var​​​ ​​日期对象名 = ​​​​new​​​ ​​Date();​​



方法二:


var 日期对象名 = new Date(日期字符串);


方法一用于获取当前系统的时间,输出格式为如下:

JavaScript 入门(上)

方法二的日期字符串可以是以下几种形式:

  • (1)"2015-5-3"
  • (2)"May 3,2015"
  • (3)"2015/5/3"

其实创建日期对象不止这2种形式,不过根据个人经验,其他的创建方式大家可以直接忽略,没必要增加记忆负担。

举例:


​​var​​​ ​​dt1 = ​​​​new​​​ ​​Date(​​​​"2015-5-3"​​​​);​​
​​var​​​ ​​dt2 = ​​​​new​​​ ​​Date(​​​​"May 3,2015"​​​​);​​
​​var​​​ ​​dt3 = ​​​​new​​​ ​​Date(​​​​"2015/5/3"​​​​);​​



二、日期对象方法

这一章学习了很多日期对象的方法。日期对象Date的方法主要分为三大组:setXxx、getXxx和toXxx。

setXxx用于设置时间和日期值;getXxx用于获取时间和日期值;toXxxx主要是将日期转换为指定格式。



表1 用于获日期时间的getXxx

方法

说明

getFullYear()

返回一个表示年份的4位数字

getMonth()

返回值是0(一月)到11(十二月)之间的一个整数

getDate()

返回值是1~31之间的一个整数

getHours()

返回值是0~23之间的一个整数,来表示小时数

getMinutes()

返回值是0~59之间的一个整数,来表示分钟数

getSeconds()

返回值是0~59之间的一个整数,来表示秒数



表2 用于设置日期时间的setXxx

方法

说明

setFullYear()

可以设置年、月、日

setMonth()

可以设置月、日

setDate()

可以设置日数

setHours()

可以设置时、分、秒、毫秒

setMinutes()

可以设置分、秒、毫秒

setSeconds()

可以设置秒、毫秒



表3 将日期时间转换为字符串的toXxx

方法

说明

toString()

将日期时间转换为普通字符串

toUTCString()

将日期时间转换为世界时间(UTC)格式的字符串

toLocaleString()

将日期时间转换为本地时间格式的字符串