怎样在HTML中使用js中的变量

大家好，这是马哥聊 g i was grape 的第五个视频。在前面的视频讲解过程中，我们主要讲解 g i was grape 的在控制台中运行。那么这一讲我们开始讲解 g i was grape 的基本的语法，也就是说在代码中运行。 这个代码我们可以看到是由三个部分组成。首先它的文件的扩展名呢是 h t m l。 首先上面是 h t m l 代码，这一块内容呢是样式表，那么下边这块内容两行代码中间是书写 g i v s greeb 的位置。 为了讲解这块内容，我这边呢采用一篇文章，各位也可以加入粉丝团，或者给我留言，免费的获取我们的这篇文章啊。我以后每次讲课都会跟一篇文章，这个文章在我们的站点里边啊， 那各位同学，那么首先我这一讲啊，要讲这几块内容，也就是语句啊，变量啊等等内容，那各位同学也都学过这块内容，我们就不在上面花更多的时间，我们会讲的就说，会做的我们就直接跳过啊。首先我们要来说一句话，来声明一个变量。 以前我们生命变量呢，叫 int a 等于三。那么变量的作用我就不再讲解，因为各位已经学过了，其其他的语言 都是相通的，它就是为了存储变量。那么这我各位同学，我说好了，在我们这门语言当中不存在 int 这个词，我们是弱类型的。也就是说 g s 声明的变量啊，各位同学看好。 生命变量格式只有一种啊，各位同学看啊，只有一种就是 v a r 加上变量名。也就是说咱们声明变量 v r a， 我不叫 v r name 嘛， name 这个就是变量的名。那各位同学，比如说老师，你怎么声明证明你声明这个变量成功了？ 那我现在可以到控制台看一看有没有报错啊。各位同学，那我现在直接运行这块内容到浏览器里边去看一看。 来。各位同学，咱们打开借查到我们的控制台里边看看有没有报错。 各位同学，有一个地方报错了，叫 v r， 内幕十八行。那么我们到这地方来看一看 v a r 内幕啊，为什么报错了？各位同学，因为我们说过了，我们要声明的变量要用 v a r 啊， vr 这款内容，所以这款内容啊，它报错的内容提示是什么？各位同学，我们看一眼这个报错的提示， 它提示 we are name 啊。各位同学，在多少行？在十八行，你就 we are name 这个地方 报错的原因，我也给各位同学刚刚提到了，就我们声明的变量必须要用 vr 啊 v 啊。那么我们现在保存过以后，我们再次打开刷新一下，各位同学，看看有没有报错。没有报错，那么控制台也是后期报错的一个主要的地方。那么我们再讲第二块内容，就是向变量里边传一个值， 变量里边传一个指 we are name， we are name。 变量的名称等于 hello， 然后呢？ what？ what？ 那么为了证明我把这个变量放进去啊，放进去，我们 来个 clog， 然后直接双引号 vr name 的值啊的值，然后用逗号隔开，然后来个 vr name。 那各位同学，我们现在再次到控制台中去看一看这个变量有没有打印成功。 各位同学，我们刷新一下，那我们现在看到了我们的变量有没有打印成功，我们的变量值已经打印成功了，叫做 vr 内幕的值是 hello word。 那现在有同学就想了啊，说老师，那么这简单的小案例，我们已经讲出了两块内容。那么首先我们声明的变量，它的格式 vr name， 是不是直接把变量就传进来了，这样就不报错了。那么同时我们传直和我们前期学习其他的语言是一样的，从右边传递到左边，为了证明我们传直是正确的，我把 它打印输出到控制台。当然了，后期呢，我会把它输出到网页中的页面中来，也就页面中显示的部分。那么这一讲，我们根据这个课程的对应，我们讲了两块内容。 那么还有这块内容，语句，语句是用什么号割开的？各位同学 g i was screep 的这门语言比较灵活，就是用 封号把它隔开。那么有同学说发现了老师，这个地方有没有封号，没有封号。在我们 javascript 当中，语句也可以不用封号，换行一行就是一个语句啊，各位同学，如果一行有多个语句的话，那么我们要把用，必须要用上这个封号。 那么我们除了讲了变量，我们也讲了语句，也讲了语句的声明。那么至于变量的命名规则啊，各位同学，前三讲 这款内容，那么和其他的语言呢？是完全一致的，完全一致的。这一讲呢，我们就讲到这里边，更多详细的内容啊，各位可以留言或者。呃用国民机的 搜索小程序，请先点，也就是学习之前请先点这三个字就可以看到了啊。各位同学注意一下啊，老师这边备注一下啊，就是说请先点 新鲜点啊， 可以看到这篇文章啊。好，这一章讲到这里，感谢大家的关注、支持和点赞。

大家好，这是马哥聊录制 javascript 的第十五个视频，这一个视频主要讲解 javascript 的对象属性输出到页面 上一讲我们说过了，对象在 javascreeb 中是用大括号表示的，对象的属性和属性之间用冒号隔开，属性和属性值之间用冒号，属性和属性之间用逗号隔开。 那么上面这块内容啊，也就这三个内容啊，都是三个对象的，什么 dog 对象的三个属性， bug 对象的三个属性。那么有的人就要问了，说，诶，老师，那么你现在创建 这个对象到底有什么用？我们学习前端页面设计的，或者说我们这个对象现在写的这个三个属性，到我们实际的开发过程中，后端的服务器会传递出对象过来， 比如 gio 的对象，它会转换成我们 gio screep 的这个对象， 那么在转换的过程当中呢，其实有一个非常简单的办法，那你就可以理解 java screeb 的呢和 java 的对象呢，可以相互的转换。那么现在这个对象我们写好了，那么到页面中，各位同学看好， 我们现在把这个页面呃运行到我们的浏览器当中来啊，各位同学看好，那么有人说，老师啊，你这个页面里边 什么也没有，对吧？什么也没有，你如何把你对象的信息输出到这个页面中来呢？答案是可以的， 那我们只要在页面中加上一句话就可以了，比如我在这边输出对象的属性啊，各位同学是这一讲的新知识点。 然后输出对象的属性到页面中，什么页面中？就网页的页面中啊，网页的页面中，页面中去啊， 那现在我们来输出，首先有个叫 document， 后期我们会讲解，现在先用起来叫 document 点 right， right， 我们来写一下，叫做 dog 点 dog 对象的属性和属性值之间，在用的时候我们用逗号，我们来打开来看一看，哎，各位同学，你现在看到了是不？旺旺狗出来了，那么也就是说咱们的对象的属性和属性值在使用的时候是用点相连。 document 是什么意思？ document 就是文档， right 是写入，那么这样的一个过程就会把我们这个对象 的代码，然后直接输出到我们的页面中，老师看一下， ctrl 音色的， ctrl 加上音色的键，然后比如这块叫 dog， 什么？ dog 的高度叫做 dog hate， 那么这下面这块是刀个什么？刀个 wait， 也就是它的重量。我们的语言是区分大小写的啊，各位一定要注意了，那么我们再一次到我们的控制台里边看一看，提示我们错误了，为什么错误？因为这个刀个 hit 跟下面一样吗？ 倒个 hit 啊，老师在保存一下， 十八割开来了啊，那么 dog 什么呢？我们上一次错的在什么地方？ dog wait 啊，各位同学，看到了 dog wait， 我们这边为什么报错了啊？各位同学看好，那么因为我这各位同学到页面中再看一下，提示一个 on defined， 各位同学看好，提示一个 on defined 啊， 他为什么昂迪犯了呢？我刚刚跟同学们简单的说到了 document 的这个语言，也就是 javasville 语言，咱们这两个单词的大小写是有区分的，我现在双击它，它没有被选中，那因为这个地方是小写，而我们下边是大写， 为了保持一致，我们现在呢在这边呢用大写，我们双击这个属性。各位同学，你现在能看到我们上下同时有被选中的这个状态。 现在我们再到页面中，为了呢加上一个逗号呢，我们也可以在这边呢加上是逗号隔开，我现在为了 使用简单一点啊，也就是说入门吧，我就没有用逗号把它隔开，那么我们再一次到我们的页面中来，那我们现在应看，应该看到旺旺狗十八二十，为了把它隔开呢， 我们可以写上一个标签，叫做 p 标签， p 式段落，连上这样一个结尾， 再来一个，各位同学看好，再来一个结尾， p 的段落呢是 段落的标签，是以开头，这是结尾，也就是一个开头一个结尾。那么我们现在再次到浏览器中看出来，应该能看到三个属性，那分别这三个值是狗狗的名字，狗狗的高度和狗狗的重量啊，各位同学看好，那么它实际上和我们 giosagreep 的 这里面创建的对象呢，是完全一致的，各位同学看好，我们的对象是完全一致的，那么通过这个案例就是告诉我们， gioscreeper 中的对象属性都是可以输出到网页中去的， 那么后面的章节我们会讲解，把后端的服务器的数据输出到网页里。那这一讲讲到这里，感谢大家的关注、支持和点赞。

啊，那么开始说到变量了啊，开始说到变量了，来说一下变量是个啥？ skry 的交出来，开始在这面写。好，首先变量啊，变量，先给他一个， 先给他一个东西啊，定义说是用来保存什么呢？数据的，哎，是用来保存我们数据的，哎，为什么保存啊？保存是为了什么？ 是为了以后能够用吗？是吧？兄弟们，你把一个东西保存起来就是为了后面能够用，所以就是为了啊，为了后面可以 继续使用这个数据啊。好，所以我们把它保存起来是这个原因啊，是这个原因。好，那么谁是数据呢？到底谁是数据？从刚才我们带 马上看的话有哪些数据？这些是不是数据啊？对，这些就是我们的数据，你要说老师，那这个呢？这个只是功能名，是不是这意思？这个只是功能的名字，而真正的数据，我要输出什么，算是一个数据吧， 算，我要说出这行文字，那这行文字就是我们的数据啊，好，同样的道理，这些小挂内部的这些东西都是我们的要的数据，所以来到这里面，我们可不可以把这些数据给保存起来，对吧？所以我们就想着要保存数据了，来，接下来怎么保存数据，注意看。好，那么 这是一个固定的写法啊，固定的格式哇， va 啊，哇，一个变量名，变量名好，等于一个数据等于一个数据，这就是一个格式啊，朋友们，这就是 格式了啊，格式了，格式了啊，格式啊，定义一个变量的格式，定义一个变量的格式，哎，有没有说？老师，我看不懂这个定义，定义是啥？定义变量是什么意思？ 就是你要想准备一个东西就行啊，你就想着准备，准备好一个东西啊，准备好这个数据，准备好这个数据啊，你看这些东西都是通俗理解哈， 通俗理解哈，就是准备准备好这个数据啊，准备好这个数据，好，那么我们来做一个准备哈，准备好一个数据来了，那么这个时候呢？我们给他一个，嗯， str 一吧。 啊，就在这里等于好，那么在这里面去写，你刚才不是一直在用那个哈喽吗？ hell 是不是在一直在用这个？那我是不是可以保存起来，然后让让他从 重复去用？重复去用好，怎么用？ a l、 e、 r、 t 可以用吧？呃，勒特，注意，这样子写什么意思来了？相当于把谁呢？把这个东西保存到，保存到 str 一这个这个符号里面， 保存到这个符号里面，你就相当于看成一个容器，它里面装着谁？ 装着哈喽这个这个东西啊，这个东西他叫制服串，但是现在你先不知道，因为你不知道数据类型，所以你先不用管，反正就保存这个。 好，那以后有了，有了这个东西有什么作用呢？就是以后，以后看到 str 一，看到谁 str 一，就相当于看到， 看到哈喽扣定了，看到后面这个是不是一直呢？就相当于看到他，好，那么接下来干什么呢？把他额勒特出来。那你说他到底是额勒特 str 一呢？还是额勒特后面这个呢？ 对，我说了，看到他就相当于看到他，所以你后面啊 lot 就相当于答应他，好啊，叔叔他啊，叔叔他。那我们来看一下叔叔 是不是输出了一个哈喽会员？对啊，好，那么弹出了这么个弹出了这么个啊，好，这一个应该可以理解吧，那我写什么就是什么了，对不对？我写多什么是什么啊？你看一下这个刷新 啊，写什么他就是什么，所以也就是说现在只是我让他保存起来，哎，有什么用呢？来，我先给你看啊，我如果想要在这里面，想要在控制台 下面去输出这个东西，控制台下面，来，你告诉我怎么写，然后呢？ c o n s o， l e console log， 小括号，然后把谁放进去？ 对， s t r e 放进去啊，把 s t r e 放进去，那这样的话我是不是就能够刷新一下？好，先第一个先执行弹出来，为什么？因为，呃，那个先执行对不对？你点了确定是不是他才能往下走？是好，所以来到这里面确定之后看到了没有？看到了 啊，看到了，看到了，好，好了，那么所以这个是啊，我们说是不是可以连续的去使用它呀，不断的去使用它啊，那么保存起来之后，我以后用它我就直接拿，这就是好处，能明白吗？好，这就是变量。为什么要变量？我可以直接拿它啊， 拿他，好，那么来，那这里面我再问你一句啊，再问你一句，如果说我这么写点 log， 然后小括号，双引号， str 一，这有什么区别？ 跟上面有什么区别？我带引号跟没带引号有什么区别？ 朋友们，你们想一想，我们最开始在讲的时候是不是就是大引号的这种？大引号的这种，那你写什么就是什么，没错吧？同学们， 所以你写引号他待会就直接 str 一，是不是给你了？是啊，来看一下刷新刷新先确定啊先确定 ftr 一是不是就给你了？对，就给你了啊，就给你了。所以这个时候有引号跟没引号的区别能区别？看到了没有？可以了吧？可以可以 啊。好，那么有引号你就记得代引号，就是写死了这个数据就写死了。代引号啊，那么这个数据哈就写死了啊。 好，就写死了啊，写什么你写什么就是什么啊，他并不是一个活的东西。哎，有朋友说，老师，那这个是活的吗？对，他是活的。为什么我们说他是活的呢？因为刚才这一个叫做定义，接下来我可以 修改 s t r e， 让他重新等于另外一个等于另外一个 h e l hello， word 可以吧？朋友们，现在修改了之后我再来打印一下来，再，再来打印一下 co n s o l e。 啊 no， 我再来打印 一下。那么打印谁呢？ st r 一还是打印他？你看两次打印这个 str 一，你觉得一不一样？不一样，因为 ftr 一已经被修改成这个东西了。好，你来看一下。是不是啊？来刷新一下这里 第一次第二次是吧妹妹？所以两次不一样，已经被我打印出来了。所以刚才这一步是在做什么？修改变量？修改变量你会发现修改不用带什么？ 不用带这个袜，对不对？不用带这个袜。是不是后面格式一模一样啊？格式一模样啊，格式就一模样啊，格式就一模样。好，所以这个叫修改变量啊，把它修改了之后，现在就变成这个 啊。好，那么所以一个是定义，一个是修改，准备好就可以用，准备好就可以用，那万一我来一个没准备好的呢？ l 啊，这个看守 look， 万一我来个没准备好呢？来加二，有没有定义过？没有，没有定义过你就来使用他，对不对？来，注意看双线确定报错，注意看，报错了兄弟们。 s t r 二 is not the five 是什么意思？定义就是没定义啊，未定义啊，未定义就没有定义啊，没有定义，没有定义啊，没有定义。所以这个时候我们 s t r e 的高低发报错了啊，报错了。 那么报错说明什么问题？说明没有定义过的不要使用，对不对？是啊，哎，注意了，没有定义过的变量，没有定义过的变量不要使用， 否则会爆错。 所以变量一定是先定义啊，先定义再使用啊。变量我们遵守这个原则啊，新手啊，我们遵守这个原则就是变量 要先定义。先定义是什么意思？就先准备好是不是？这意思好，那么再使用 定义面料就是在准备一个东西，准备了之后就可以用， 你没准备好，那你不能用啊？来，我给大家一点时间，把这个代码写一遍啊，把这个代码你自己写一遍啊，写一遍你可以自己啊，随便写一个字不算啊，随便写，引号里面随便写，然后就看出来啊，他输出什么？对比一下。

我们接着讲啊，然后我们刚开始讲了这个变量命名的一个规则，那么现在我们就开始来使用一下我们的这个变量来做一些简单的案例啊。那么变量的使用过程的话，它有三个步骤，那第一个选生命变量， 注意在 g s 的生命变量相对来说比较简单哈，它直接用这个 y 这个关键字来声明就可以了啊， 然后他的语法是啥呢？哇，关键字。那么就代表我们要生命一个变量了，那么后面跟的就是我们变量的名， 那么变量命名的规则啊，那么我们在刚开始已经讲过了哈，在我们上一个视频里面讲到啊，然后我们还可以同时给几个变量声明啊，同时声明变量用逗号个开啊，逗号个开，然后声明好变量之后就相当于 在我们内存里面就画了一个空格啊。那么它的一个过程是什么呢？那么我们可以大概的去看一下。我们首先第一步我们来演示一下哈， 我们创建一个页面，然后我们要在这个页面里面去写一个这个脚本语言对吧？直接是语言。那么我们首先要创建一个啥呢，对吧？我们首先要创建一个 skype 标签对吧？然后我们把这个代码写在里面。那么我们的几个过程。第一步首先是啥？生命变量啊，生命变量。那么在 g s 中生命 变量的关键字是啥？是通过哇关键字哈，然后它的语法是啥嘞？哇，关键字。然后在后面跟的是一个变量名，比如说我要保存一个叫姓名的，那么在这里面这个类目，那么它就是一个变量名 标，列明命没的规范，我们等一会再去证明一下哈， ok， 好，这是第一步就完成了。那么它相当于什么呢？比如说我们刚开始的，在之前的视频上面我们讲过啊，讲到过， 比如说这是我们的一个内存对吧？这是一个内存，现在我在这里面声明了一个变量，这个变量名叫类目，那么他就会在内存里面是不是给我们开辟一个空间对吧？开辟一个空间，那么这个空间是啥嘞？ 对啊， 这个空间，那么他就我们开辟好了。那么在因为我们后续要去获取它里面的数据，或者要去操作这个变量，所以说我们是不是给他取了个名字啊，那么这个名字叫啥？我们在这里面写到这个名字是不是叫类目，那么他就开辟了空间，而且这个名字叫类目，那么这个类目我们就称他为啥是变量名 对吧？就是变了名。那么这个空间里面现在是不是没有任何数据对吧？那么这就生命的一个变量，那么如果我还要生命 另外一个变量呢？比如说 a 级年龄，那么我们就可以这样去声明，那么声明变量，其实他还可以通过一个外关键字哈，可以这样去声明，比如 a 变量 ab 用多少个开，那么这样的话他就相当于生命了。几个变量，三个变量对吧？生命了三个变量。好，第一步我们就完成了， ok？ 那么如果我在这里面 这个我就不掩饰啊，那么我们看一下，如果身边那个 a g 的，那么它就相当于又给我们开了一个空间， 那这个空间它的这个名字叫啥嘞？叫 age 对吧？ ok， 那么相当于我们现在声明一个变量，它是不是就开辟空间，声明一个变量就开辟空间，那么在这里面声明了 a b c， 是不是应该还有 a b c 的这个空间对吧？好了，那么第一步就完成了 啊。第一步完成，那么审理好这个变量的目的是为了干嘛呢，对吧？那么我们把这个空间开好了，不是在这里浪费的 对吧？那么我们目的是要往这个空间里面去存放一些数据供我们后面使用，是还是不是对吧？那么在这里面我们已经生命好了。空间。那么的第二步我们就要给这个 变量复值了啊，注意现在我们会讲一个运算符叫等号，我们称它为复制运算符啊，复制运算符。那么我们现在空间开好了的。第二一步 给变量复值， 给变量复制，怎么复制呢？因为我已经开辟了这个空间了对吧？那么我现在要给类目复制对吧？类目注意通过一个等号，这个等号就是复制运商服。那么我们如果要给他复的是一些文字性的描述，比如说张三李四 对吧，姓名叫张三，注意我们负的这个值。如果是这些啊，一句话或者是一段文字，那么我们必须放在引号里面，那么这个引号里面呢？说明这个引号是一个字符串啊。在后续我们会 讲到，那就是在我们这一章的后面，我们会讲啊，讲这个是什么数据类型，我们现在先会用。那么如果是数字的话，那么我们直接可以用，比如说张三，他的年龄是多少岁来二十岁，如果是数字，那么我们可以直接复制对吧？好，那么这是第二， 就相当于我找到这个类目对吧？你看一下类目是不是这个名字。我找到这个类目，然后给它里面附了一个值，叫啥？叫张三对吧。那么找到 age 呢，那么它的值是多少？是二十 对吧？二十。好，那么这里面他就存放了两个值啊，一个是啊张三，一个是二十，那么这是两个变量对吧？这就是我们的两个变量。生命好了。生命好之后，我现在想将他的姓名 和年龄打印出来对吧？我们第三一步就是使用了第三一步使用变量。 它的三个步骤哈，生命变量给变量复值。最后使用好了。使用的话，那就有很多方式了哈，很多种方式，比如说，那么你如果想打印它，或者是在后续我想处理它，那么我们怎么去用对吧？比如说我想通过这个日字把它打印出来， 是不是我们昨天讲了对吧？在之前的课程里面已经讲了哈。我们通过 ctrl 这个关键字点 log， 那么把它打印出来。我要打印啥嘞？我要打印这个姓名， 姓名。注意我要打印的内容是放在这个引号里面，然后我要用变量，注意哈。同学们，我们如果要用变量，要用一个加号把它加起来，然后用个后面跟这个变量。 注意不能把这个类目放在这个引号里面，放在引号里面，那么它就变成一个字符串了哈，就变成一个字符串了，一定在外面有个加类目好，然后 console 点 log 年龄对吧？ ok， 我要再打。如果我输出的内容要在前面要显示出来，我们要放在引号里面啊。 ag 好嘞， 那么我们现在使用已经使用了，我们通过日字把它输出对吧？输出。那么我们现在来运行一下它啊，我们来看一下这个效果是怎么样的？ 我们启动这个页面啊，我们来看一下它的效果。 好了，现在我们启动它了哈。大家可以看到在这个 调试的控制台里面，我们可以看到哈，姓名他是不是打印出来是不是叫张三，年龄打印出来是不是叫二十对吧。那么说明我们现在就是在使用这个类目，我找到类目，实际上他是找到类目这个框框里面存出的这个数据是还是不是 对吧？这个类目里面找到的是啥？张三对吧然 ag 呢？那么是二十对吧？是二十。我们拿出来直接可以用就行了。那么这就是我们变量的三个步骤对吧？可以生命变量， 然后通过把关键字啊声明肉干的变量，同时可以声明变量对吧？好。然后第二步给变量负值 对吧？给变量复制。那么通过啥等号啊？就是这个复制运算服哈，通过等号将右边的数据复制给啥，我们左边的变量。 ok， 好。那么复制复完之后，第 三步我们就是使用这是变量的这个三个步骤对吧？当然我们可以简化。这样太麻烦了，我在生命变量的时候，我能不能就把这一第一步和第二步同时给他进行操作呢？肯定可以的哈。那么我们看一下 呃，神明变量且复职对吧？神明变量且复职。比如说我现在给他一个叫啥呢？这个学生啊，他一个学号 啊，他是一个学号，他的学号是多少呢？比如说哈，我的给他的负的一个学号是，你看一下 幺零零幺这个学号啊。那么在这里面你看我们生命变量，然后等于就直接将变量的值复制给他了，那么生命变量 复制，或者说我在这里面比如说生命多个变量，我可以 a 等于十，逗号格开， b 等于二十， c 等于三十， 那么我们可以通过这个方式，用逗号格开生命多个变量的同时给这几个变量进行复词，对吧？进行复词，那么我们同样可以把它输出，大家可以看到啊， 我就直直接输出这个 stay number 哈，那么我们可以一可以啊，一可以将这三个变量的值进行计算， a 加 b 加 c。 好，我们再刷新一下页面，我们看下效果。 好了，刷新出来的效果大家可以看到啊。第一个我们前面的不看，我们来看一下这个学号，学号是多少，是不是幺零零幺，我们是不是把这个学 号打印出来了，那么后面打印的是六十。注意因为这三个是数字，数字相加，那么他就做了一个加法运算啊，加法运算和我们有了这个引号相加不一样啊，他叫串联。这个加号他有两个作用， 一个是串联，一个是啥计算加法运算呢？ ok， 那么得到的结果是多少呢？六十对吧，六十 ok。 那么这就是我们的这个啊，变量，生命变量和复制。 那么可能有同学就问我了啊，这里面有几个问题，我们要注意的几个问题。第一个就是我们回过头来看一下变量命名的一个规范哈，我们重新在这里创建一个文件吧。 嗯， b m 二 yeah， take more 好了啊。比如说我在这里面我们声明一个变量，刚开始我说了变量可以是字母开头的，这个是没问题的啊，这是没问题的。那么如果我在这里面用一个一开头呢？ 大家会发现在这里面是不是就爆红色了，红色代表错误，所以说我们变了。秘密的规范。我在这里面再一次强调哈， 我用一个注释在这里面，因为我们刚开始只是给大家讲了他的规范，没有去演示啊。注意我们来讲一下哈， 变量命名的规范 的第一个首字母 必须是字母或啥，或下划线 啊。下划线这个东西哈，那么你看一下，我们是字母是没问题的。如果我把这个一改成了啥下划线，那么是不可以了。所以首字母是字母和下划线可以。比如说你要给一个特殊符号，那么大家可以看到啊，哦，美元符号我们也是可以的啊。然后我们看一下加号嘞， 是不是错的啊，错的。注意啊，美元符号它在我们变量命名的过程中也是可以的，我们可以运行一下，我们可以输出嘛， 比如说李四啊，李四。然后 好，其实美元符号啊，在我们 jacques 里面，它是一个特殊的符号哈，不建议大家去用。我们来刷新一下这个页面，运行一下， 你看李四是不是就出来了。是可以的哈。但是呢，我说了这个，因为类目的话是一个是一个啊。这个美元符号在我们 jacobe 里面，它是一个特殊的符号。嗯， 怎么建议大家去使用，但是可以啊，我们在这里加上吧，把它加上 or 美元符号对吧？它只能是这这三种哈，只能三种。第二个嘞，第二一个啊，如其余的符号，我们在这里就加了哈，加上它，其余 都可以为数字啊，可以为数字。比如说在中间加个一，对吧，可以在后面加个一，可以，但是不能有其他的符号哈， ok 啊。然后第二个是除 以上符号外不能有其他的符号， 对啊，不能有其他的符号，比如说这个加号啊，减号啊，这些符号都是错的，哪怕说有同学说哎，我空格呢，可不可以，空格也是符号，你看他是不是也报错了，他也是不可以的， 对吧？那么这是第一点啊。第这是这两个要注意的地方。第三一个啊，第三一个，它不能是关键字 啊，或者是关键字。举个例子哈，我们 vr， 如果我们就用 vr， 我们就看一下嘛。那大家看一下 vr 这个关键字啊，就是 va 这个关键字，已经被它用了对吧？已经被 g s 用了，所以说你用它秘密， 那是错误的对吧？所以说是不能用它去命名的啊。所以说不能有关键字啊。这关键是随着我们后面的学习的话，那么会有很多关键字的。 ok 啊。其实在这里面这几点啊，这几点还有一个区分大小写对吧？你看一下 我们第四一个哈，就是变量命名，是去严格 区分大小写对吧？演一个区分大小写。好，举个例。最举个最简单的例子哈，我们现在取的名字叫类目，比如说类目等于啥？等于张三， 好注意哈。那么在这里面如果我们再给他取个类目叫李四的，那么我们最终打印出来的这个效果是什么呢？注意这里谁取了一个名字，如果我们再取名字，再给他一个李四，大家看一下，我刷新一下，我们看一下他最终得到的结果是啥？是李四， 而不是张三。如果我把这句话注视掉了，我再刷新一下页面，那么你会发现最后一个，你看一下他打印出来是不是张三。当出现重名的情况下，注意啊，他就会将我们原来的直径覆盖啊，覆盖。覆盖之后的结果就是啥？ 就是我们最后一个。好。那么如果我把它取成一个大写的类目，注意我们来看一下他到底有没有覆盖哈，刷新一下， ok。 那么大家可以看到他现在得到的是啥？张三。所以他有没有覆盖说明呢？这两个变量是独立的啊。我在这里面改编了这个大写字母类的类目的 啊，那么和这个小写的是没有关系的，不会影响他。 ok， 所以说他严格区分大小写好。第五一个就是如果变量命名相同，则会啥？覆盖？ 还好啊， g s 是可以覆盖的。如果在其他的编程语言里面，比如说 java 呀， c 语言这高级语言里面哈，变量秘密是不允许相同的啊，不允许相同的，你如果要覆盖的话，在前面就不能 叫神明了啊。所以说这里面要注意啊。要注意。这就是我们回过头来再去证明了一下我们在之前讲的这个变量啊，之前讲的这个变量。 ok， 那么这就是变量的一个使用方式对吧？使用方式。 呃，那么变了声明的话哈，大家注意一下这里面有几个规则对吧？几个规则刚开始我们在演示过程，其实已经演示过了哈。第一个，我们可以使用关键字画声明多个变量，那么他之间是可以用啥逗号可开，那么就相当于生命了，三个变量啊，三个变量。 第二个可以在生命变量的同时进行负值，在生命变量就负值了。这样的话，就相当于我们把第一步和第二步啊，生命变量和负值那么合并成一步了啊，是可以的。第三个使用话语句多次生命同 一个变量。注意了，如果名字相同的同一个变量，那么他将会是覆盖，就是将原来的纸覆盖成最新的内容啊，最新的纸，这叫覆盖。刚开始我们已经演示过了对吧？在这里我们刚开始演示过了。如果这个类目 的名字和这个类目相同，那么它就会覆盖最新的啊，最新的啊。第四一个就是 g s， 它是一个弱类型语言哈，所以说它对类型的要求并不是很严格，它不像我们后续学的假娃也好， c 下部也好啊。所以说 他根本就不关心你在这里面给的是什么数据，是什么类型，他统一的就是用哇啊用哇。但是嘞，他在后续我们可以演示，可以看出他会推断出这个类型他到底是属于什么类型啊。 ok， 如果你在这里面没有给引号，那么给的是一个数， 那么他就推断出他是一个数字类型。如果放在引号里面，那么他就认为你是一个字符串类型啊，就字符串类型。如果你给了一个出或或是这个在后续会讲哈，他就是个布尔类型，所以说他对类型的要求不是很严格啊。 ok。 第五一个在结实中啊，变量可以宣布声明，而是在使用，根据变量的实际作用在确定其所熟的数据类型。所以说 大家看一下哈，他有一个就效果。我们刚开始做的他三个步骤，生命变量复制在使用对不对？那么你可以看一下哈，我把这个删掉吧。比如说我现在直接给一个类目等于 张三。好，那么我就直接没有用袜那声明点 log， 然后我把这个类目打出来。 好，打出来。然后我刷新一下，大家可以看到啊，在这里面我先把它清掉，重新来一遍吧。啊，太多了被干扰。好，那么我们可以打出张三，看到没有？那么你可以看到，如果我在这里面呢，把它注视掉 啊，注视掉。然后生米都没有，复制都没有。我们再打印，大家看到把这个清掉算了，选好注意。现在我们什么都没有是不是我再刷新一下， 他输出的值是原来的这个值哈。把中指重新关掉，再看一下效果。 请教 你看一下，现在在这里面我们有没有去输出内容呢，对吧？控制台里面有没有输出内容，因为我们没有声明他对不对，没有跟他复制对吧？所以说在这里面他是可以不用去先去声明， 我们可以直接拿来使用对吧，来使用啊。所以说他相对来说呃，就没有对类型要求那么严格啊，没有那么严格。 ok？ 呃，这就是我们这个视频里面我们要讲的一个内容，就是对变量的使用啊，对变量的使用。其实啊，相对来说啊， gs 的变量的使用简单一些啊。简单一些。 ok， 我们先讲到这里。

这一节呢，我们来介绍一下 javascreen 的引入方式，想要在 hma 页面中引入 javascree 啊，我们一般有三种方式， 第一种呢是外部 js， 第二种呢是内部的 js， 第三种呢是元素事件的 js。 对于 j s 的这三种引用方式啊，跟我们 c s s 的引用方式是非常类似的，这个呢，小伙伴们自己对比一下，这样更能加深一下理解。 我们先来看第一种外部 js， 外部 js 呢，指的是我们把 hdm 代码和 js 代码单独放在不同的文件中去，然后呢，在 hdm 文件中呢，使用 screen 标签来引入我们的 js 代码。 接下来呢，我们具体在识字例子中看一下，在我们的网站跟目录下，我们有一个叫 index 点 hdmi 的页面，然后呢，我们这里还有个叫 js 的文件夹，注意下，这个是文件夹，不是文件。 在这个文件夹的内一步呢，我们有一个叫 index 点 j s 的外部 javascript 文件，我们打开这个 index 点 h m 的页面， 如果我们想要在这个页面中去引入这个外部 javascreen 文件，有两种方式，一种呢是在 head 标签内部引入， 还有一种呢是在 body 标签中引入。这里呢，我们都是使用 secret 标签来引入的 hrc。 首先呢，接的是我们的文件录 附近 javascri 的引入方式啊，跟我们的 c s s 的引用方式是不一样的，我们的 c s s 引用方式呢，指向于在 high 标签中引入，但是呢，我们的 javascri 文件呢，还可以在 body 标签中引入。 接着呢，我们来看第二种内部 j s。 内部 j s 呢，指的是我们把而且他们代码和我们的 j s 代码放在同一个文件中，这里注意一下，是同一个文件中，其中我们的 j s 代码呢，是写在 scree 标签内部， 对于内部 js 呢，我们也有两种营业方式，一种呢是在 high 标签的内部引入，还有一种呢是在 body 标签中内部引入。接下来呢，我们来实际操作一下。 首先呢，我们在 head 标签中引入一个 screen 标签， 然后在 school 标签中呢输一个 j s 代码， 输入完成之后呢，我们保存一下文件，接着呢，在浏览器中查看一下页面的效果。我们在浏览器中可以看到有这么的一段文字， 这个呢就是我们 document the right 它的作用，这个方法呢表示在页面中输出一段文本。对于这个方法，我们后面用的非常多，小伙伴们先记住一下。 接着呢，我们修改一下代码，我们把 document 点 lie 换成二 乐，再去浏览器中查看一下。现在呢，我们的浏览器啊会弹出一个对话框，这个对话框的内容呢，就是我们乐函数中的内容。 对于 document and lie 和乐这两个方法，我们在后面中会用的非常多，这里小伙伴们先记住一下。其中 document and lie 呢，表示是在页面中输出一个内容，而我们的呃乐呢表示是弹出一个对话框。 我们再来看第三种引入方式，元素属性 j s。 元素属性 j s 呢，指的是在元素的事件属性中直接编写 j s 代码，或者说调用函数。 这里小伙伴们就会问了，我不知道什么是事件，也不知道什么是函数啊，其实对于事件函数 这两个概念啊，我们在后面章节中再给大家详细介绍，这里呢，我们只需要知道有元素属性戒指这一回事就可以了。

行啊，这个地方啊，咱们这里啊啊，这个比较，这个这个案例叫做对变量的操作啊，那注意啊，对变量，对变量的操作有几几种呢？ 对，我能对变量做什么操作？哎，有两种， 明白吧啊，第一个就是复制，第二个叫什么呢？叫使用啊，当然有的人说，老师啊，我这个我这定义算不算 定义？这个怎么说呢？他不算，明白吧，他不算操作变量他算什么？他在创建变量 啊，这呢对变量的操作来说其实就两种，一种是复制，一种是使用啊，那什么时候是在对变量进行复制呢？什么时候是在使用变量呢？这两种有什么区别呢？ 来我们看看这个啊， one 一个 a 等于十，对吧？那这个代码是什么来着？ 定义变量 a 并复制为数字十，对吧？啊，那这个时候注意啊， ctrl 点到底是 a， 我问一下啊，上面这个代码是在对变量进行复制对吧？下边这个代码在干嘛？ 在使用这个变量对吧？哎，在使用这个变量很好，然后这个，呃 啊，其实其实倒也没了啊，就是 a， 注意啊，这这个左边啊，这个左边就是这个，咱当时说了就说这个等号这种负值，这叫负值与负号，对吧？那这样子形成的这种语句叫做负值语句 对吧？哎，那这个注意啊，等号分为左右两边啊，等号分为左右两边，然后啊，你看这个 a 等于 a 加一，你看等号分为左右两边，左边这个是在干嘛？ 是在负值，明白吗？等号右边这个 a 这是在干嘛？ 在使用？就对这个变量的操作，就这个是在 用这个边上的纸，对吧？这左边呢是在使用边上的纸 啊这是一个很重要的一个区分啊当然也是个很小的点啊但是很重要。 重要到什么程度啊重要到你怎么去写写法。因为是以前我见过有没有这么写 a 加一等于 a 的这种写法啊，甚至 a 加二加一等于 a 加二啊。 a 加二啊就这种写法这种写法行不行呢 肯定不行啊是吧。啊肯定不行啊。为啥这个关键是为啥不行。 什么没有复制。对啊是不能复制 明白吧。你看啊你你你就说这种父之语就就这条鱼他为什么能停。因为你右边的这个 a 加一的这个 a 是数字十 对不对？哎是你在用这个用这个 a 变量的值来进行计算所以说呢这个时候他就会去找到 a 变量的值也就是在使用 a 变量但是这左边是干嘛呢这是负值对吧负值的话你一个变量是可以被负值的但是你这个 a 加一这是个什么东西 a 加一他是不是也会先算出一个结果来一个结果是多少十一或者是十二对吧。是一个具体的数字啊是一个数值啊你能用等号把一个数值给改了吗。你这个写法跟跟写个什么跟写个十一等 我们 a 加二什么有有有 保存他怎么还不报错了呢。 来来来这绝对不行来复制路径啊在这个注意当这个啊我也不解释了来看看吧看吧啊怎么样行不行不行不行对吧。啊还是不好做。也就是说你看 vs code 会怎么样。 vs code 它是个啥东西。 对 vs good 它是个颠屁它不是权威的明白吧。然后在大多数情况下它是准确的，但是你看这种 这是啥呀？这是是吧，你看这是怎么能行呢？你看他这里报错是第几行？第十四行，对吧？哎， 十分啊，就左边这种情况绝对不可以啊，绝对不可以啊，所以说最后咱们还是最终，咱们还是以哪为准，以控制台为准啊。好，行，那这样的话在这里啊， 咱们已经知道什么时候是物质，什么时候是使用了，对吧？哎，基本上就什么呢，就是只有他在等号左侧的时候 他才会叫做复制其他一切的情况都是什么？哎，都是使用啊，都是使用。那然后给大家看个好玩的，就是这样， a 等于十 这条代码看见了吗？怎么样，神不神奇？神奇是吧。啊？ 为什么？因为没有 buff， 是不是没有 buff？ 哎，行不行的去看看吧，注意啊，双击，谢谢。 行啊啊，至于没有输出是因为我们没有输出语句，但是这个 a 边上是不是存在的？对，这就是咱们 gs 被人诟病的地方， 非常棒啊，就说在 g s 中啊，对，在 g s 中啊，不通过这个 word 这个关键字啊，也也可以直接让一个不存在的变量 出出现，能明白吧。哎，也可以直接就对一个不存在的变量出现啊，对它进行复制， 而且确实可以的。就按照正规语法来说我们应该是 one a 等于十，对不对？但是现在的问题就是你不 one 也行了， 那以后。对啊对啊，这我这现在这不就引出这个问题来了吗？啊，怎么解决这个问题？我一会再说啊我一会再说 啊。你看我 a 等于十和 y 等于十都是可以的，你看啊，都是可以的，这样不报错啊，刚才那个没有 y 的时候，哎也不报错 啊。那不报错就意味着什么可以运行啊就意味着可以运行，你看啊我这里输出什么呢？输出这个 a 是吧。啊是可以运行的啊，但是啊但是这种结法怎么样呢？呃不规范，明白吧。啊他不规范， 而且在以后的这个这个这个语法中会怎么样呢？会禁止这种情况的出现， 但是现在我们学习的这个版本啊确实是可以这么写的。那这样的话这叫什么呀？这叫复制，也就是说对一个不存在的变量进行复制操作是可以的啊。就说结论 啊，对一个不存在的变量变量进行复值操作啊。 可以啊，是允许的。好然后接着啊。嗯这个 console 找到了这个，哎这是什么呀？ 哎这是在使用 a 电量的值对不对？哎如果你是 g s 这个解气器啊， 然后呢别人家写了条代码说来用一下这个东西，那你会怎么样？哎对了，你会先找到这个点亮 对吧？那这时候你结果他发现啊，他找了一块没找到，那这时候会怎么样？哎注意这时候会报错啊。刷新怎么样？ a is another 比划的 这叫什么？这叫没定义对吧，就不存在啊，这叫做失败啊，就这个 a is not even。 也就是说啊结论啊。哎结论什么呢？就是 这个直接啊，直接使用一个不存在的变量啊，会怎么样呢？报错会报错 好了你看啊都是对不存在的东西做操作对吧？都是对不存在的东西做操作。一个是可以的一个是不可以的， 明白吧。啊首先我们这个案例讲了什么呀？我们讲了什么叫做 对变量进行复值，什么叫做使用变量的值啊？看什么？看等号 啊？看的好。然后就是说如果我直接对一个不存在的变量 啊做操作，有两种可能性啊，就是如果我是在使用这个 boss 的电量，那么会报错，如果我是给这个 boss 的电量负值，那是可以负值的 ride。 行，那这就是咱们 今天。呃，就这就这节课啊，就这个案例咱们讲的东西啊，这个结论。哎，这个结论就是 啊，就是这两条啊，就这两条。

嗨，大家好，今天开始我们正式去编写我们的 jasque， jasque 这边引入方式有两种，一个是文档内直接引入啊，文档内直接可以嵌套我们的 jasque 代码片段。 第二种方式就是在外部文档的方式去引入，第一种方式在文档内，文档内我们通过 script 这个元素啊， script 元素去包裹我们的 jazz script 内容。那我们可以用一下，比如说 console 啊，然后 log， ok， 然后我们这边写一下啊，算是我们编程语言第一个都要去打印一下 hello world 对不对？那我们这边去 hello world， ok， 这是我们的 hello word， 这个是在终端里面输出文本内容的意思啊，这个是 consoles， 还有这个 log 方法啊，就可以去输出对应的一个文字，我这边给他传了一个自助串。啊，自助串是什么意思？我们后面会 讲解，在数据类型的时候讲解，大家放心。好，我们可以看一下，怎么样去看到这个文字呢啊？右键查看或者是按 f 十二都可以啊，然后你可以看到 hello work 已经被写到这里了， 它就是在对应的这个行数，就是第十四行直接去执行了。好了， word 啊，这个就行，上面这个错误大家可以忽略掉啊，这就是我们简单的在行内里边去编写。

先看效果， 放进一个 div 盒子，里面有 div 方块跟 s b g 图形， 关注我，每天带你读大。 给方块设置宽高十八像素及背景颜色， 给盒子设置相对定位宽二百五十六万，编剧上下七十左右。自适应给 boy 加上背景 sdg 加上颜色 g s 部分获取到 nu 跟 pad 元素。创建 condit 变量，包含 duration 跟 low 属性。 progress 进度变量， timers 次数变量。我们使用浏览器振动化来刷新方块位置次数等于总时长除以十七毫秒 换乘法获取 pass 上各个点的位置信息。定义 move 方法获取 pass 当前点跟前后一个位置的点信息。通过两个点计算当前时间角度。 如果配置 look 为 true， 并且 progress 大于总长度，则重置 progress。 最后给方块设置位置角度就可以。

不是组件用不起，而是原声 gs 更有挑战性。给他一个 waterfor 盒子，他能加上相对定位，并把其宽设置为浏览器窗口的百分之八十，外编辑为五十像素并居中。 若是再给他一个出手的机会，他能把一张大图片狠狠的塞入名为 waterford 小盒子里，并给图片设置为绝对定位宽为二百二十像素，圆角设置为十像素，并加上零点三秒的过渡效果。 结构和样式搭建好后，他向 gs 模块伸出了咸猪手。他先获取 waterfor 盒子，设置变量为图片宽度，但是他还不满足，他甚至还要写了一个创建图片的函数，并且丧心病狂的利用福尔循 加载三十张图片，并把其狠狠地塞入 waterfow 盒子。接下来到了布局环节。对于布局问题，五星上将迈克阿瑟评论道， 如果上帝让我用 gs 实现瀑布流布局，那么我会定义一个数组，数组的长度即为图片的列数，通过找出数组的最小值来决定把图片放入哪一列。 此话一出便震惊四座，诸多网友纷纷对其进行称赞，于是便创建一个函数，用于获取图片的列数和列与列之间的缝隙。他默不作声地创建一个数组奈斯套，用于存放列的高度，并出始化为零。 在编写了一个用于获取 next top 最小值和缩影号，表示当前在第几列的函数， 但他仍不满足。他通过 four 循环来设置图片的位置，其中的 left 值相当于 x 坐标 meantop index 表示 d 系列从零开始。 i m g v 加 in forget 表示水平、方向、图片宽度，加上图片间的缝隙， top 值相当于外坐标 meantop mean 表示列高度最小。 info gap 二垂直方向图片间隙。最后再更新一下列的最小值，同时再求一下数组最大值，把 waterfor 盒子高度更新。 最后我们再把 lao 函数运行一下，惊喜的发现图片竟然重叠在一起，根本不行，你敢耍老子？其实这是因为函数 lao 调用时，图 片还没加载，即还没出现在页面上，需要获取图片的高，而获取不了，导致获取值为零，从而发生图片叠加。解决方法就是添加一个 window 等待时间，等待图片加载完后再执行， 此时就大功告成了。另外还可以加上监听窗口变换，实现让窗口大小变化时能重新布局。

先看一下怎么去使用，呃，怎么去使用呢？那么想要去使用瑞快 cs 啊，我们可以在页面中去引入这个文件，那么当引入这个文件之后，就会出现三个全局变量，我们来看一下，嗯，首先呢，咱们先去创建一个这个文件， 哎，使用这块 ds 好了，然后呢，注意看，我们要在里面去新建一个音，再点 htm 的文件 好了，那么注意看，我们要想在这个里面呢，哎，我们首先去，嗯，引入库，就引入一个什么库呢？我们的 isic escaped ssc 就等于当前入下面的 level， 入下面的 record 好了。那么引入进来之后，那么这里面就出现了三个全局变量， 一个是瑞克尔，一个是瑞克尔 zs 啊，一个是我们的一份 啊，一个是我们的底饭，嗯，好了，我们要在浏览器中把它打开，哎，那么呀，我们就会发现，哎，这里面这三个就出来了，第一个呢，哎，和我们第二个，我们会发现呢，他们俩是非常非常的相似的， 或说呢，他们俩是一样的，嗯，只是给他起了两个名字而已啊，只是给他起了两个名字而已。 瑞克尔是有等于我们的瑞克尔 gs 呢。好，我们来看一下，我们一刷新， 哎，好，我们一刷新，注意看，哎，他们俩是完全一致的啊，他们俩是完全一致的， 哎，就出现了这三个边量，那么通过这三个边量，我们就可以去引入模块或者是去加载模块了啊，比如说我们呢，在 gs 里面 啊，在 d s 目录下啊，有一个叫哎，慢的 d s， 哎，慢 d s， 那么想引入这个 g s， 那么我们就可以通过蕊块或蕊或 z s 啊，去引入文件， 哎，对，在蕊块 cs 中啊，每一个文件被看成是一个模块啊。再说一遍，在蕊块 cs 中，每一个文件被看成是一个模块， 每一个文件被看成是 被看成是一个模块啊，每一个文件被看成是一个模块，嗯，好了，然后呢，注意看，我们要去引入这个文件啊，就是啊，蕊块啊，就是这个蕊块， 注意，是个数主啊，因为咱们说了，哎，那么他默认使用的是知识的，是我们的猫头串子炮的规范，怎么去引入呢？蕊块，然后后面跟上一个数主，哎，比如说呢，我们要引入我们的这个，哎，当前侮辱下面的 gs 下面的， 哎，慢点 g s 啊，慢点 g s， 注意，他对于 g s 突然明很敏感，所以说 g s 突然明可以省略啊，一块儿 d s 啊，对于 g s 敏感，哎，因此呢，嗯，后罪名， 哎，后，对面可以胜率啊。 好了，然后呢，咱们要在慢这里面，咱们 ctrl look 慢费用看他有没有引进来， 好了，我们一看就给他引入进来了，那么这是一种引入方式，那么我们呢，还可以在引入啊，在引入这块 zs 的时候，哎，通过 ditan man 引入文件， 哎，通过低端慢 引入文件，给他一个对特杠慢，等于我们当前步入前面的 接下面的慢点 ds， 也可以省略点 ds 啊，我们一刷新你看也是可以引进来的，哎，所以说呢，呃，对于引入我们这个第一个文件，对，引入的第一个文件也被称之为入口文件。 然后呢，我们说引入的第一个文件啊，引入的第一个文件也被称之为入口文件， 哎，这是几个概念啊。嗯，好了，然后呢，这里面有个跟目录的概念，跟目录就是指的是我们引入的文件相对的位置 引入的文件相对的位置啊，引入的文件相对的位置。那么注意啊，如果呀，有对他们， 哎，那么我们说在引入的时候，那么他就是以他的值啊，那么，呃，呃，那么他引入的文件的时候呢，就是以他的使用值所在的位置为根目录啊，所以他的使用值为根目录，那么如果没有对他慢属性，所以 htm 文件所在的目录啊， 嗯，手抬头，目录里边目录。 好，我们一起来看一下。好了，那么现在呀，我们要在这个， 哎，我们要在这个啊慢中， 我们要去引入啊，别说呢。嗯，呃，别说呢，我们要想引入咱们这个嘴克瑞啊，想引入咱们这个嘴克瑞，是吧，哎，好了，那么注意看那么注意看，那么咱们就是引入嘴克瑞，哎，好，那就是啊，哎，瑞克尔， 好了，那么注意，咱们这个对他慢，哎，是不是使用的是 对他们属性引入的呀？是，所以说呢，此时的目录是谁了？是 gs 目录，那么从 gs 目录找到我们的嘴盔是不是跳出 gs 目录进入 live 呀？哎，所以他得写上，哎，点点杠， 来吧，下面的对口嘞， 好了，看一下啊，我们一刷新，哎，咱们这个是到了， 怎么样就加载进来了，但是注意啊，如果呢？哎，如果呢，咱们呀，这个对他慢， 没有设置啊，没有设置的慢。然后呢，是通过我们下面这种方式去引入的，哎，通过下面这种方式去引入的，哎，那么此时注意看，哎，还能找到嘴块吗？就找不到了，为什么找不到呢？我们来看一下，哎，此时 啊，我们的嘴块他找到哪去了，哎，是不是找到一个单头赖巴下面的嘴块点 d s 啊？哎，是不是跳，是不是就少了一个啊？一零使用一块 c s 这个目录啊？ 所以说，那么此时想找水块，就要根据我们 htm 文件所在的目录在哪啊，是不是使使用一块 cs 这个目录下面去寻找啊？哎，所以说呢，这里面就 不能这么去写了，嗯，我们说要相对于，哎，就是没有使用，这次更慢，数学 相对于 htm 文件所在的目录，哎，那么我们说 htm 文件在跟在这个十这个目录下，所以说找到找嘴块，找嘴块就是直接吃，哎， 当前木下面的，哎，赖布下面的这块，这块也是吧。好，我们这回再一看，哎，咱们这个刀轮怎么样就可以使用了， 这是我们寻找文件。好了，那么今天呢，咱们就先讲到这里啊，然后呢，明天呢，咱们继续讲怎么去定义文件啊？怎么去定义模块啊？

搬砖啦，上节课我们讲了杰斯数据类型啊，只是给大家罗列了一下，从这节课开始，我们会挨个说明每一个数据类型，他的相关的知识点。 我们今天先从字符串开始，今天是第八次课了，对吧？关于借字字符串呢，我们这节课要共享的有这么多，先来看第一个字符串，为什么要有借字字符串呢？其实字符串它主要是用来存储和操作文本， 这是他的一个概念，了解一下就好。我们来看字符串的声明，怎么样去声明呢？其实上次课我们也有详细的讲到过，对不对？好，这是字符串的一个声明，声明也很简单，主要是通过哇关键字 以及变量等号，右边是我们要输出的内容，这个里面可以写你相关的一些 要传递给用户的信息，当然这一块数据我们也可以是动态的，后续咱们再讲到揭示后面知识点的时候，会给大家详细的去说怎么样去实现。好，这一块我就是直接写在这里的，我想要做的一件事情呢，是在浏览器里面展示出 小红怎么样来去实现呢？是不是我们需要通过刀给我们特点啊？输出，对吧？咱们之前有一节课专门讲过，输出一定要记得给他添加上分号啊。好，这一块 ok 了之后我们可以在浏览器里面打开来看一下效果， 哎，这块可以看明白，对吧？这一块呢就是当前我们在变量内幕里面存入的一个数据， 这块信息要传递给用户，比如说我们还需要给他换一下。好，浏览器里面可以刷新来看一下，能明白吗？这个就是字符串， 那关于字符串里面呢？有些小伙伴可能看到，哎，这个地方有单引号，有双引号，对吧？好，实际单引号双引号他都是支持的，并且的话呢，单引号跟双引号他没有太大的区别，也就说你当前在这里，哎，我就想给他使用双引号，对吧？ 这个也是允许的啊，这两个都是一样的，你用单引号也可以，用双引号也可以，来看第四个知识点，谢谢。四字狐串的拼接 用加号是什么意思呢？等一下写例子你就明白了啊。在讲这一块知识之前，我们先来输出一段话，小红喜欢读书，那有小伙， 哎，这个书说很简单，对吧？那我们可以直接给他放在一个字符串里面，把这一块内容给他添加进来，不就可以了吗？ 那页面中我们也可以直接像这样去输出呀。哎，是不是这里的字段你要改对吧？我们这时候这里打印出来的是这个内容，是他对不对？这个变亮点的内容，而我们在这里输出的是不是这个，对吧？啊？所以不要搞错了啊， 小红喜欢读书，但是我们有些时候会遇到这样的一种情况后，这个这一块数据的话呢，咱们一般都是通过后端到数据库里面去取出来的，也就是小红， 哎，喜欢读书，他实际上是存在数据库里的，那我们数据库里的存储不像我们前段这样，直接给他去 全部都写在一起，而是单独的去分开的，也就是这是一个字段，这是一个字段，由多个字段去组成。 好，那这一块我来这个分解一下啊，后续咱们选到数据库那一块再详细的去说，你在这里可以先了解一下就好。实际这里涉及到两个字段，第一个字段是姓名， 这里的姓名是小红，对吧？哎，这是第一个信息，第一个字段，第二个字段是关于他的爱好，爱好这个这一块是什么呀？啊？他喜欢读书， 这是他的爱好，也就是在两个字段里面，他们之间没有关联，但是我们传到前端来之后，哎，两个字段我们怎么能给他这样直接去显示呢？两个字段其实就相 相当于是 yst 一存了一个姓名，这个姓名是小红。 我们又来一个字段，这个字段里面存的是他的爱好，喜欢读书，也就是后续咱们获取到的数据信息可能就是这样的 啊，后端给你第一个数据，又给你第二条数据，那这两条数据我们要让用户看到的是这样的一个效果，对不对？那怎么办呢？就需要用到咱们自辅串的拼接，也就是加号。 加号咱们在上次课讲到他是一个运算服，对吧？除了运算服之外，他还有一个功能是做拼接 字符穿的拼接。我们先来看一下他怎么用，有点像等号，对吧？哎，等号在数学里面他就是一个等，等号后面是结果， 在咱们编程里面等号是什么呀？哎，他还有一个复制的作用，对吧？啊？这个加号也一样啊，我们来看一下如何给用户输出这样的一段话，我们只需要把 s、 t、 r 一后面跟上一个加号， 再把他的信息拿过来，这个就是我们要展示给用户的，对不对？或者是有些伙伴说，哎，我不想这样去写，对吧？我就想说出一个 str 三， 我就想这样去写，看这个是不是跟咱们上次课讲到的一样的， 能看明白，是吧？但是这个地方不是去啊，这个一加一等于二啊，他不做运算，他只是把这一块跟这一块去拼凑起来，去拼接起来，我们来看一下。 哎，小红喜欢读书，是不是跟这个给用户看到的效果是一模一样的？这个是我们静态写到 gs 里面的，这个是动态去获取的， 能明白吗？但是现在很不是动态啊，我们只是去模拟了一下啊，这一块时间是要从后端去获取的啊。好，后面再慢慢详细去讲，这个能明白吗？也就是加号的一个作用，哎，是用来去做拼凑的，但这一块呢，也可以给大家来去扩展一下， 来看一个例子啊。好，那本一给他来一个一追加一个二， 这个流程一个作业啊。那如果是当前，我需要把这个打印出来，打印的是什么？ number 一，加上 number 二， 他的一个结果是多少？可以思考一下，下一次课再详细去说啊。好，除了这一个之外呢，我们再来去给他改一下， 这个地方，给他来一个六，这里呢，我来给他一个引号。哎，这个时候他的一个结果又是多少呢？也就是五跟六， 那你也可以输出看一下，对吧？好，除了这一根之外呢，我们还有一个是去给他再来改一下， 这里来给他一个出，咱们上次是不是给大家讲过一个 boos， 对吧？好，那在这个地方呢，来给他一个 boss， 那我这时候让八跟九去关了一下，这时候十打印出来是多少？好，这一块大家可以课后练习 一下啊，扩展一下知识点。借字字符串的长度，实际是借字里面关于字符串的一个属性，属性就这一个啊，你记住就好。他是用来做什么事情的呢？比如当前我有这样的一个字符串， 关于这个字符串呢，我这时候需要知道他的一个长度，因为有些时候我们需要去获取，需要去做计算，对吧？那这个时候我们就可以这样去写，先去找到这个字符串，找到他之后直接点楞死 就可以了。这个就是借四字符串的属性，他获取到的是当前这个字符串的一个长度。那我们可以给他打印出来看一下这里 st 耳吗？这样去区分一下啊。这里给他来一个。 那我们直接刀 q mate 点 word 输出以下七的值 五，对吧？哎，这时候我还可以再去对他进行改变一下。怎么样去改变呢？来看给他来一个空格刷新，哎，他变成了六，对不对呀？好，你这时候再来去看， 这时候变成了七，也就是当前在这个引号里面的，只要是有空格， 或者是下划线，或者是咱们前面讲到的刀的符号等等，他都是占位的，一定要给他计算在里面啊，都是占位的，其实这个很好理解的，有几个字符啊？ 共有五个字符，所以他的长度为五，这个好理解，对吧？这个是多少？这个因为加了一个空格，你看他实际上也是有个占位的，所以这个地方他的结果为六，这里的话呢，你加了一个下划线，加了一个他，那 这个时候就是六加二八，对吧？好，那我们来看一下。