JASON HIRSCHHORN:欢迎光临, 每个人,九个星期。 我们有一个令人兴奋的一周摆在我们面前 因为我们有我们的最后一个问题集。 我们也有一个全新的语言, JavaScript中,你已经在 不仅使用该中间 问题集,但很多人会 可能利用它进行最后的 项目,特别是 基于网络的最终项目。 所以,这就是我们今天之后去了 简要地谈到资源, 我们每星期做。 我们会跳成JavaScript,然后 我们会花所有的部分用 实践活动编码海豚训练师 2K13,这就好比劲爆 2013年,但是对于海豚 而在JavaScript中。 [笑] JASON HIRSCHHORN:那么一如既往的列表 为您检查出来的资源。 这些资源是特别重要 因为下周 周三是测验之一,你的第二个 并在此过程中最后的测验。 就像猜谜零,这是75分钟 下午1:00后开始一点点。 它涵盖了从零一天一切 这门课程的,但它肯定 强调一切有 自从发生了测验之一。 但当然,我们讨论的for循环 在今年年初。 for循环很可能仍然会 是本测验的一部分,所以它不是 就像你可以不顾一切的 碰巧本周五或测验零之前 因为这个课程建立 对本身很多。 但可以肯定的重点将是 事情,因为本周六,我们所学到的。 这包括PHP,JavaScript中,SQL来 可以肯定,并且还更先进的 我们在C中谈到了数据结构 整个主机的其他主题,但我们 将讨论下周 当我们回顾的测验。 并且也一如既往,如果您有任何 关于为你的问答题 准备,可以自由地 他们送我的方式。 现在,没有任何人有任何 有关测验简单的问题? 确定。 不必担心它还是怪胎 列有关的权利,但保持在 你的内心深处,因为这是 一个星期,每天发生的事情从现在开始。 最后,我知道我们正在朝着运行 本学期结束 - 只有两个部分后左 这一点 - 但我仍然激动和 渴望你的反馈 如果您有任何。 我要让那些 最好的两个部分如初。 他们可能会,因为每个 部分是惊人的,有史以来最好的。 我不知道如何这是​​可能的,但 他们已经全部被太棒了,我想。 我已经得到的反馈已经落后了 自从到了什么,没有 过去几个星期,所以请给 我,如果你有它的一些反馈。 这需要三分钟。 你能告诉我一个好东西,你 要我继续做或 事情我可以工作。 我想是最好的老师 可能的话,或者我试图做的最好 我可以,但我不能这样做,如果我不 知道你们是如何做的。 而且这很难告诉你为什么下降 睡在课堂上,所以让我 之后,为什么是这样的话知道。 上周我向您展示了这一形象。 这是忍者神龟 自行车我有我年轻的时候, 我们正在继续推动你们 没有辅助轮,因为我们沉浸 你在另一种语言。 但放心,JavaScript中,如PHP, 是非常相似的东西你已经 在过去所做的那样。 很多的逻辑转移过来,如果 没有语法,只有一个换一。 但同样,所有这些语言的 我们已经在过去的走了过来 个星期,虽然他们似乎势不可挡, 是令人难以置信的强大,将使 您在您的最终项目做了很多 也可能其他网站,你 在将来的代码。 因此,事不宜迟,我们将 开始潜水成JavaScript。 我们要谈论它,并简要 然后真正进入实际操作 编码本节的一部分。 因此,JavaScript是一种客户端脚本 语言,这意味着它的 不同于PHP和它的不同 比C JavaScript的编译不和 它不是由服务器执行。 相反,你加载它。 你加载一个JavaScript页​​面时加载 在网页中,然后它执行 你的机器上。 这意味着你可以看到所有的 这是JavaScript代码 发送到您的计算机。 有时,它缩短或编码一个 位,加密位,这样你 不能明确地告诉发生了什么事情。 例如,如果你检查出CS50或 本周的工作人员解决方案 问题集,你去service.js, 你会发现你不能真正告诉 什么从什么我们就给你做。 我们加密了一点,使 这有点难度。 不过,你可以看到确切的 我们正在执行的JavaScript文件 而我们的程序运行上。 所以,这就是它的意思是一 客户端脚本语言。 类似于C和PHP,不过,JavaScript的 拥有for循环,if / else语句 条件,while循环。 类似PHP的,它有一个 foreach循环为好。 再次,非常相似 我们已经看到在语法 我们已把语言 曾与。 最后,最酷的部分之一 JavaScript和东西,我们会 今天做了很多,而且很可能你会 做了很多与你的P组,如果你 没有经历过它了,就是你 可以检查出你有错误 在通过JavaScript控制台代码。 我们有点上周看着它。 我们考察了不同类型的控制台 检查一个页面,但在 Chrome浏览器,再次,你可以看到的布局, 在HTML中,记录你的页面是 显示在屏幕上。 您还可以看到所有的JavaScript的 形成该页面,你也可以一样 我说,看到所有的错误 在JavaScript控制台。 我们会体验到更多的 当我们开始编码了一下。 有一点要注意的 JavaScript变量。 PHP变量,它们是 弱类型,所以你不需要 给他们的特定类型。 在范围方面,已定义 由“变种”的关键字。 所以,如果你不把关键字前面 的东西,你只要写名字 可变的,则分配 操作者,在这种情况下,等号。 我忘了一个分号就在那里, 但假设有一个分号 就在那里。 然后,你要创建 一个全局变量。 如果你把“无功”的关键字,然后 你给它一些类型的本地 范围,不管是到 一个函数或一个循环。 所以这是一件事 注意变量。 JavaScript是一种语言。 jQuery是建立在顶部的库 JavaScript语言,并且您有 在演讲之前见过它。 我强烈建议,如果你打算 在最终被使用JavaScript 项目,你了解jQuery的。 它使你想要的一切 做多了,容易多了。 它还配备了精彩的 文档和示例,以帮助 你开始。 今天我们将要 使用jQuery为好。 这些,就是我对这张幻灯片, 是的jQuery的非常基本的。 在你的HTML文件或顶部 不管是谁 - 你的index.php文件,你的 index.html文件 - 你需要 包括这两条线。 这些都是非常通用的线。 第一行包含了jQuery JavaScript文件,并且所述第二线 包括只要你写 你自己的JavaScript代码。 当然,因为在你的 你可能已经使用JavaScript代码 一些jQuery库函数, 需要以后去 jQuery的包容脚本。 我们将探讨这 再一会儿。 最后,在JavaScript文件中, 我把这个index.js中。 它可能是scripts.js。 不管是什么,什么的JavaScript 文件中有你,你一般开始 与这行代码,美元符号, 开括号,文档,关闭括号, 期间,准备好了,开括号,函数, 开括号,括号闭,然后 大括号。 把你的代码里面就有,然后 用大括号结束它,接近 括号,分号。 因此,以此为一个给定的。 如果你将要使用jQuery,包 所有的jQuery代码内 这行代码。 我们将再次看到,在一秒钟。 再次我们将使用jQuery, 并请提问,因为我们去 今天,但没有任何人有任何 关于jQuery的或问题 JavaScript的权利吗? 确定。 因此,事不宜迟,我提出 你海豚训练师2K13。 我超兴奋的最新 版本的产品。 哦,不! 我是如此兴奋。 我要展示给你们, 但看起来我们有没有 实现它。 让我们把这个有点大了。 所以,如果我加载的海豚代码 练马师 - dang了它。 对不起,伙计们。 我工作的这个类之前。 我想我把它完成, 但我想我还是有一些 工作有待完成。 但幸运的是,你们都有一些 JavaScript和jQuery的实践,使 让我们继续和完成 这一起。 我想我送你们的这个副本, 因为我是超级兴奋 关于它,所以你应该有 相同的代码,我有。 让我们一头扎进 - 宕了,伙计们,我很抱歉。 让我们的头到终端,虽然。 就像和你的过去的问题 套,如果你有我 - 让我们使这个有点大了, 也为你们 - 你拿了我的zip文件。 你大概解压缩它。 让我们在这里。 最后,希望,你感动成 您保存在同一目录 您的问题设置8码。 我们保存在该目录中,所以我可以 访问它 - 或者我们都可以访问 在Chrome浏览器中的代码 我们的电脑上。 并再次,要获得该代码,您 只需键入在发现地址 底部的右侧 您的设备,到这里。 你会发现你的IP地址。 你键入到Chrome浏览器 在计算机上,并且在这种情况下, 因为我们是第9的文件夹, 我们还必须添加一个 斜线部分9。 让我 - 哎呀。 我要尽量减少这种,所以我不 必须通过不断点击。 所以这就是我如何设置这个代码。 我已经这样做了。 我不会去通过这些 步骤,因为这正是 问题的设置开始走 您如何做。 所以,尽管你会得到这个设置 在第二,但首先让我们 探索这个代码为一组。 让我们来看看我做了什么。 我试图让大多数的完成它 上课前,但我想我 是有点落后了。 因此,让我们打开index.html的。 确定。 和index.html的是一个非常简单的 页面因为我没有 想要得到太疯狂了。 我真的希望确保它 是工作,但我想我 没有走到这一步。 这里的头,这涉及权利 这些HTML标签里面,我们注意到 一对夫妇的事情了蝙蝠的权利。 我们有CSS文件的权利 此处及相应的 CSS文件的位置。 我们有jQuery库就在这里, 你会发现不同的东西 关于这一点。 来源是什么 好长好长。 ajax.googleapis.com/-- 有点类似于URL,但它 不肯定的样子 JS /的jquery.js。 那是因为我决定,我 不希望有下载 jQuery的文件,然后将其拖动并保存 它在我的图书馆,并 负责。 相反,我只是拿 JavaScript文件,谷歌的主机。 因此,谷歌实际上承载了许多的 库和jQuery的,因为它是1 最流行的,它承载 那一个为好。 并且因为它是托管的话,我不 需要担心,他们 更新它,虽然当他们更新它 我可能会改变这些 数字在这里。 但是,这只是让我的整个文件 系统有点不太干净。 我真的不喜欢托管 所有这些文件。 这是好多了,如果谷歌 有收留他们为我。 所以这又是获得全 JavaScript文件,但它只是被 由谷歌,而不是在我的主持 我的计算机上的文件系统。 我们也看到,我把两个 文件dolphins.js和trainer.js。 我们来看看那些在第二。 最后,这个称号就在这里。 谁可以在里面告诉我这是什么代码 这些标题标签,在那里 的推移我的网页? 观众:像这样的事情, 在工具栏或什么? JASON HIRSCHHORN:是啊,那个小标签 在Chrome浏览器窗口的顶部。 这就是该文本去。 在人体内,你可以 看,没有太多的东西在这里。 我只有三个div的。 我给他们一些ID和 我把一个小的文字英寸 不过,我想这就是为什么我们不这样做 看不到任何东西在这里。 事实上,我们看到海豚训练师2K13。 我们看到TODO。 我不知道那是来自哪里 因为我没有看到这一点。 因此,也许这就是在一 我的JavaScript文件。 我们将检查出的第二个。 可人家告诉我是什么 这个ID是指就在这里? 观众:这是调用的一种方式 在[听不清]的特定部分 文件? JASON HIRSCHHORN:是啊。 这只是一种方式来引用 这种特殊的分区。 ID是非常独特的。 好不好? 艰难的人群。 所以,ID是通常唯一的。 你给他们一个特定的 元素在你的代码。 如果我想引用一个数字 元素,不管是对CSS的 造型或jQuery的? 我可以给他们什么属性? 对象:类。 JASON HIRSCHHORN:A类,完全是。 右。 OK,这样的index.html,再次, 没有太多的事情在这里。 因此,让我们打开另一个文件。 让我们来看看我有什么。 这就是我在这里。 让我们去到的JS文件夹中。 我不会担心 CSS的现在。 让我们打开了dolphins.js。 哎呀。 或者更确切地说 - 确定。 所以,dolphins.js,它实际上看起来 非常相似的一些代码你 在问题被赋予设置8。 你可以通过它滚动。 谁能告诉我,虽然, 什么是海豚? 这全部大写海豚? 那是什么? 什么样的数据类型是什么? 观众:阵列。 JASON HIRSCHHORN:这是一个数组。 我们知道它是一个数组,因为我 看到这些方括号在这里。 和别人,有什么 它的数组? 对象:对象? JASON HIRSCHHORN:这是 对象的数组。 你可以看到这一点。 你怎么知道这是 对象的数组? 观众:因为你有这个冒号 大括号之间的引导? JASON HIRSCHHORN:对。 所以,我有这些大括号就在这里, 然后你可以看到逗号 分离不同 在这个对象数组。 然后每个对象里面,我有 结肠癌的东西和别的东西。 与一般什么这是第一部分, 东西向冒号左边? 什么是叫什么? 笼统? 我们如何参考呢? 观众:指数? JASON HIRSCHHORN:指数,或可能 更一般地,键。 然后在右手 侧的值。 所以索引,键。 但是,如果我们谈论这些, 我们通常指的是对的事情 左手边。 在一个简单的数组,再一次, 我们有索引0。 1。 2。 3。 4。 和海豚,我们将有海豚0, 1海豚,海豚2,海豚3, 海豚4。 我们也有,这个对象里面,我们 一般不会参考的东西。 或者,如果我们只是有这个权利对象 在这里,我们不打算说的对象0, 对象1,对象2。 我们会说对象名称,或 对象类型,对象的长度,等等。 这就是我们如何将得到的值 在右手侧。 因此,如果我们说对象的名称,例如, 我们会得到这个字符串, “恩。” 所以当你们告诉我,海豚 简直就是一个对象数组。 你可以看到所有的对象 有一个名称,类型,一个属。 是发音是否正确? 任何人吗? 属? 大。 的长度,重量。 是发音是否正确? 我想是这样。 和图片,只是一个网址 一些文件在网上。 而在这里,我们关闭阵列, 对倒在那里非常左手 我的屏幕的一侧。 所以,这一切dolphins.js是。 哦,我的天啊。 这解释了它。 我想我会完成 一切,但看看。 有这些待办事项。 好了,希望我们能 做那些在一起。 但是,让我们之前,首先我们做 这,只是穿行 此代码速度非常快。 因此,正如我所说的,我们在非常见 开始这条线,我不得不在 幻灯片(文件)。就绪(函数()。 而且基本上什么,那将 做的是等待,直到一切都在你的 页面已经加载,所以等到 它的所有阵列,一切都很好 去,然后开始执行 这段代码。 所以,如果你需要的,如果要运行一些PHP, 你需要得到一些图片, 不管它是什么,所有的代码已经 设置并准备好了在你的索引页 或任何页面已经被加载, 现在你要开始 执行你的代码。 所以我们做的第一件事就是 我们成立了这个数组。 而我没有var关键字 还有,究竟什么是 这个数组的范围有多大? 观众:这是全球性的。 JASON HIRSCHHORN:这是全球化的, ocean_array可以从被访问 在这个文件中的任何地方。 然后我们看到这个for循环。 它没有说的foreach,但是这 本质上是一个foreach循环。 而这仅仅是JavaScript的版本, 所以对于海豚每个变种海豚, 是什么数据类型? 虽然,再次,JavaScript不 有这些数据类型本身,是什么 数据类型是海豚? 对象:一个对象。 JASON HIRSCHHORN:这是一个对象。 我们得到的每个对象 在海豚阵列。 所以在这里,它看起来像我忘了 把所有这些海豚从我们的 巨型海豚想进 ocean_array,所以我们也许应该做的 ,第一。 然后,调用事 该池变量。 我将其设置为null。 然后我调用这个函数 draw_ocean。 我训练海豚时,其 图片被点击 - 我没有做过这一点 - 设置一个海豚自由时 单击该按钮。 所以这些都是我需要做的事情。 我想我应该给你一些 背景是什么,我试图做的。 因此,如果我们去这里,我真正想要的 这看起来像被一个数组起来 在这里,而不是它说:“TODO:”我 需求的一个表,本质上,与 所有海豚的图片。 然后当你点击一张图片, 我希望它爱不释手的 屏幕底部的一半,并给 你上的所有信息,并 这将是池中的海豚, 你训练的海​​豚。 所以,我认为这将是非常酷的。 你拥有所有这些海豚在海洋中 在这里,然后单击一个链接, 并且它会去游泳池,和 那么你可以训练它。 所以,这就是我要怎样做。 然后还会有一个按钮在这里 在游泳池,你可以点击, 就像“设置免费”,你可以设置 与海豚,它会回去 进入海洋。 所以,这就是我试图创建, 但同样,我会需要你的帮助 创建它。 所以希望,其中的一些关键字 或这些术语将启动 决策意识在现在的背景下 这个方案的。 让我们继续期待通过这个文件。 我们调用这个函数draw_ocean。 它是独一无二的功能,我们称之为 从的document.ready部分。 所以我们称这种draw_ocean功能, 它看起来像它创建了一个字符串, 一个变量,在这里。 在字符串中放的东西,增加了更多的 东东的字符串,增加了更多的 东东的字符串,并 那么这行代码。 我说,打印出HTML字符串。 而有人向我解释什么 这行代码呢? 嗯,首先,有哪些呢 该美元符号是什么意思? 这不是一个PHP变量,但 这是否美元符号是什么意思? 观众:链接到的HTML中的ID - 它就像它链接到的HTML代码? JASON HIRSCHHORN:怎么样 那个美元符号? 这是什么货币符号说明什么? 观众:链接到HTML不知何故? JASON HIRSCHHORN:我们在那里看到的 在此之前美元符号在JavaScript? 我们看到它的讲座。 我们谈论它。 什么是美元符号是什么意思? 观众:东西用jQuery? JASON HIRSCHHORN:完全正确。 这牵扯到与jQuery。 这个美元符号意味着我使用 一个jQuery库函数在这里。 完全正确。 所以我们写的美元符号,然后 我们有这个括号开放和关闭 括号和里面就有,发生的事情 当你使用一个内有 jQuery库功能,或者你 使用jQuery库? 同样,你在课堂上看到了这一点。 有人可以给我 - 你 也看到一些东西在这里。 什么有内部云? 杰夫,给我一个猜测。 这是什么样子,#海洋? 我们在那里见过呢? 观众:它是一个库 还是什么? 我不知道。 JASON HIRSCHHORN:好吧,让我们 我打开索引点 - 不,不对的地方。 所以我们看到我们有一些 这里所谓的海洋。 在那里,我们看到了#海洋包括hashtag 海洋,语法呢? 是吗? 观众:CSS? JASON HIRSCHHORN:在CSS中。 所以我们就想风格的东西, 记得我们会把这个标签的CSS 选择器,或者包括hashtag海洋,例如 并且所有格式 我们想给的东西 ID为海洋我们把里面。 所以,在这里里面它不是CSS 选择去这里。 jQuery的定义了自己的 类型选择器。 但它同样的想法,实际上 他们中的很多重叠的CSS。 因此,这些开放括号里面,你 把一个选择器,无论 选择是指,那是什么 你将要使用。 因此,在这种情况下,我 选择编号的海洋。 如果我有一个类 - 比方说,我有一类的东西 所谓的“图像,”我给了一个 很多元素,我怎么引用 一类的东西称为“图像?” 观众:我认为这是圆点。 JASON HIRSCHHORN:用一个点。 所以,如果不是我把点阵图像。在这里, 这会给我之类的 东西叫做“图像”。 当然,这是超级强大, 你可以参考的东西很多。 事实上,我可能会参照基本 在HTML中的任何标记。 所以,如果我想要做的是,TD,这是 我们以前见过一个标签时, 创建表。 你可能熟悉 从p设置7。 在这种情况下,它实际上将 选择所有的人。 这是要给我阵列 所有TD标签。 但可以得到一个有点势不可挡, 如此往复,现在我们 要坚持公正 参考标识。 那么,这样做,又是 这得到,在这种情况下 - 抱歉。 到这里,到index.html的。 这是一个海洋,而海洋的ID 引用一个div,所以这部分的这 行代码获取该div。 然后这点意味着我打电话 的函数,并且该名称 功能是HTML。 而这短暂的,如果你们看到了 之前,美元符号,文件,得到点 通过ID元素,点缀内部HTML。 这仅仅是jQuery的版本。 所以在HTML函数只是 得到的内部HTML。 的该元素。 如此反复,如果我们回头看这里,我们将 看有没有内部HTML。 所以,如果我这样做,我会 试图得到的HTML。 当我键入​​此,我 设置的HTML。 所以我通过这个函数将字符串, 我已经创建的字符串 在这里,并说把那 里面的海洋格。 是吗? 观众:当你的 HTML中,你刚开 一个副本,如果它,对不对? 你不删除它。 JASON HIRSCHHORN:对。 如果我这样做,并希望 保存这个变量var - 哎呀。 这将得到的所有信息, 在那里,将它保存在另一个 变量,使得它的一个副本。 观众:确定。 得到了它。 JASON HIRSCHHORN:所以我们创造了一些 HTML格式,保存在字符串中。 我们节省一些。 在这里,您会看到TODO字符串。 所以这可能是我们在哪里 获得这TODO从什么时候 我们进入我们的页面。 而实际上,如果我右键点击TODO, 检查元素,我们谈到了 这最后一周。 这就是我们能看到的HTML 我们的页面结构。 你会发现,到这里 - 让我们使这个有点大了,太 - 我们有我们的div ID海洋就在这里。 大家看到这行代码? 而这正是我们的类型 在index.html的。 里面的话,我们现在看到的这个 表行代码。 什么代码,表行, 这就是我们刚刚插入到代码 这个元素。 而且我们来看看它里面,我们从来没有 类型化COLGROUP和TBODY。 这增加了对我们,因为 我们做了一些花哨的东西。 但是你会发现还有的TR, 有一个与TODO的TD。 所以看起来,同样, 我们在这里写代码。 这正是这 线在做什么。 它正在采取我们的HTML字符串, 把它里面的这个div就在这里。 它最初有什么。 此页面被加载。 美元符号的document.ready。 这开始执行。 我们称draw_ocean功能, 该draw_ocean功能,我们采取内 此HTML并把它该div里面。 我们只是通过去 很多在那里。 没有任何人有任何疑问, 有关? 或者是如何工作的,或jQuery的? 因为如果你明白这一点,那么 jQuery的应该有希望来 相对容易的。 是吗? 观众:你有里面的什么 打印输出的HTML括号下 串,即名 在HTML变量,你 早前宣布? JASON HIRSCHHORN:这在这里吧? 观众:是的 JASON HIRSCHHORN:是的。 观众:所以,如果你已经命名的 别的东西,别的东西 是什么你会摆在这里。 JASON HIRSCHHORN:完全正确。 这就是一个很好的点。 这是一个有点混乱,因为 我有HTML,HTML。 这里这里面的我的名字 变量,在这里右边是 jQuery函数的名称。 观众:但是,为了在jQuery 正常工作,你必须给它 一些HTML输入? JASON HIRSCHHORN:没错。 或者你必须给它一个字符串。 它将把该字符串内 的div或什么的。 这仅仅是一个字符串。 它不知道这是HTML,但 显然格式化的目的是 有效的HTML。 这是否回答这个问题? 观众:是的。 JASON HIRSCHHORN:确定。 是吗? 观众:如果有什么所提及的海洋 一个按钮什么的? 会是什么。的HTML吗? 这会改变 按钮的文字? JASON HIRSCHHORN:所以,问题是 如果它提到了一个按钮? 这将改变内 HTML的东西。 所以,如果它有一个开放标签和结束 标记,它将把介于两者之间 打开和关闭标签。 如果没有开启和关闭 标签,它不会做任何事情。 观众:这是字面上的副本 和粘贴之类的事情? JASON HIRSCHHORN:是啊。 它复制并粘贴从东西 无论变量我通过吧, 字符串我通过它,里面的那些 打开和关闭标签。 让我们来看看这儿吧。 哦,我的天啊。 draw_pool没 做任何事情,就在那里。 这是一个令人失望。 火车,哇。 好了,别的不多,除了这一点。 所以,让我们开始吧,和 让我们来解决这个问题了。 我将需要每个人的 帮助完成这件事。 有没有真正的多行 的代码,我觉得,写。 我想我在几年前这样做 为2K12版本,并且有 不应该是多行 代码编写。 我不应该删除的代码。 我刚才救了它。 呵呵,疯了。 无论如何,让我们开始吧。 所以我在这个数组,或者说我在这 行,我有我的ocean_array。 我想把这一切, 一切从这个文件,到我 ocean_array。 所以,我怎么可以一切从 在那里,并把它放到 ocean_array? 它的一行代码。 谁可以给我这行代码或 告诉我,有一些想法是什么线 代码应该怎么办? 为什么不是我们从这里开始,然后我们将 继续在房间里移动 回答问题。 库尔特? 什么是第一? 观众:Ocean_array, 支架,海豚。 等于海豚,支架,海豚? 海豚与资本的一切。 JASON HIRSCHHORN:确定。 让我们看一下语法。 就在这里,这就像一个foreach循环, 所以它实际上做了很多 事情对我们来说。 和海豚是​​一个对象。 所以我们并不需要写的东西 像海豚,海豚,因为 海豚本身是 对象是我想要的。 这不是索引。 这是否有道理? 观众:是啊。 JASON HIRSCHHORN:那么你怎么了 建议改变你的代码? 如果我们知道我们给出的指数? 哦,对不起。 你是好。 但如何 - 让我问一个不同的问题。 如果我们要 - 让我们实际写这个。 没关系。 我们打​​算写这个。 这是伟大的。 抱歉。 我只是很混乱那里。 让我们离开,有现在,和 我们再回过头来训练的海豚, 设置一个海豚。 就让我们先解决这个图纸的海洋 的功能,我们会回来 即,库尔特。 但到目前为止,一切都很好。 让我们来看看里面draw_ocean。 看起来是错误的线路是这样的 在海豚的“存储图片 海洋中的HTML字符串。“和右 现在,我只是喜欢TODO,但我 真想把海豚 在海洋中的图片。 还等什么,诺亚,你觉得是 我首先应该做的事情吗? 如果我想通过整个 阵,什么是第一 我应该做的事情吗? 观众:我们需要 创建一个for循环。 JASON HIRSCHHORN:一个for循环。 什么是应该 for循环是什么样子? 顾客: - 我们需要通过每个海豚 在海洋中的阵列。 因此对于变种海豚在 - 你能写的海洋数组? JASON HIRSCHHORN:像这样? 观众:也许这就是正确的。 JASON HIRSCHHORN:让我们坚持 那现在,然后我们将 回来吧。 而你要负责 该行。 所以我必须通过for循环。 迈克尔,你起来吧。 我现在应该怎么办? 观众:你将不得不采取 从海豚存储图片。 JASON HIRSCHHORN:那么, 是,存储在哪里? 观众:在海豚数组? JASON HIRSCHHORN:我现在困惑 太了解发生了什么。 让我们弄清楚我们该怎么办调试 这一点,然后我就来 回到你身边,好不好? 什么是相当于 printf的在JavaScript? 安妮? 观众:这是写一个文件? JASON HIRSCHHORN:要不怎么能 我看到一些在 安慰下底部? 观众:CONSOLE.LOG。 JASON HIRSCHHORN:CONSOLE.LOG, 究竟。 因此,让我们做的console.log,让我们 只是把“海豚”的,好不好? 理想情况下,如果这个工程,我们要 有 - 让我们来看看,早在该文件 dolphins.js,有六海豚, 所以我应该拿到六或某事 希望打印出来 控制台,对不对? 这就是我们走了多远,因为我们 没有Kurt的线在这里,然后我们 没有诺亚for循环,和我们有这个 行,所以希望我们应该看到六个 东西打印到控制台。 所以,让我们在这里,让我们打开了我们的 控制台和刷新我们的页面。 OK,这样它看起来像 我们看见六只指数。 零个,一个,两个,三个, 四块五,是啊。 观众:你怎么来 该网页在你的 - JASON HIRSCHHORN:我怎么得到 这个东西在这儿? 观众:不,Chrome的页面中 [听不清]家电。 我们可以看到,还是不? JASON HIRSCHHORN:此镀铬 页面在这里? 观众:是啊。 JASON HIRSCHHORN:所以就像P中集 8,我已经开了一个Chrome窗口 我的桌面上,在我的 Macintosh桌面。 如果您在看到了这里这个URL 左上角,符合这个IP 下来解决在这里。 所以这样做,虽然初 问题的设置规范指导您 经过究竟是如何做到这一点。 但我只是跟着那个,而是 与航天飞机的代码,我只是做了 我们自己的代码。 最酷的是,我们还可以 检查ocean_array。 所以看起来ocean_array是 6对象的数组,并 让我们打开每一个。 轰! 之一。 所以库尔特,它看起来像你 代码工作完美。 一切都开始了在ocean_array。 因为我刚才讲错。 但是,是的,真棒工作。 该ocean_array是正确的,它看起来 像现在我们看到的是海豚 一个从0至5,所以它看上去 像在数组中的索引。 所以,有了这些知识,迈克尔, 现在应该怎么办呢? 想出声来。 什么是我们想要做的事情? 观众:我们想要得到的 JPEG每个海豚。 JASON HIRSCHHORN:确定。 那么,我们如何可以参考 - 我们怎样才能为JPEG? 我们从哪里开始? 凡一切存储在哪里? 观众:在ocean_array? JASON HIRSCHHORN:确定。 观众:所以ocean_array,海豚 - JASON HIRSCHHORN:我们如何 里面得到的东西 - 所以这为我们提供了对象。 和我们以前看到这个 与结构。 那么什么样的符号 我们需要使用? 观众:这可能是点。 JASON HIRSCHHORN:一个点。 然后什么领域? 观众:图片? 或者说,不是一个领域 - JASON HIRSCHHORN:它是什么 叫dolphins.js? 看看,你可以看看。 我们可以去回到这里。 我们可以看到ocean_array, 我们可以探索它。 什么是它叫什么名字? 观众:类型。 等待。 图片? 我说的画面。 JASON HIRSCHHORN:图片。 右。 你听起来不像你知道什么 你在谈论,虽然。 这听起来更像是一个猜测。 让图片,这样就会给 我们的图像的URL。 杰夫,你有问题吗? 观众:是啊,我得不到的东西 你有你的Chrome浏览器 浏览器在我的电脑上。 我刚刚得到一个“未捕获的参考 错误,控制台是没有定义。“ JASON HIRSCHHORN:你 成立了一切? 观众:嗯,我想我 所做的一切,你 做了大屏幕上。 JASON HIRSCHHORN:你 chmodded的所有文件? 和你去通过 整个安装? 观众:我会再次尝试。 JASON HIRSCHHORN:确定。 我跳过了,很多在 开始,但你需要经过 整个安装就像在 开始习题集规范的。 CHMOD一切, 确保它是英寸 观众:我会去和 仔细检查它。 我想我做到了,但 我会仔细检查。 JASON HIRSCHHORN:所以,这看起来 喜欢它会给我们的 字符串和一个图片。 大。 我们有图像的URL。 如何我们现在把它放在 - 如果我们写会发生什么 只是这一点,迈克尔? 观众:它只是让画面。 它实际上不显示它。 JASON HIRSCHHORN:让我们 看看会发生什么。 我们将保存。 我们将在这里执行它。 看起来我们没有得到任何东西。 如果我探讨这个表中, 它看起来像里面 - 是啊,貌似我没有得到任何东西。 观众:我们要不要 - JASON HIRSCHHORN:这是一个字符串, 这段代码就在这里。 我在哪里希望把这个字符串? 观众:你要 把它放到大海? JASON HIRSCHHORN:确定。 而在这儿,我把一个字符串 在海洋中称为HTML。 观众:那么会是美元 标志,海洋,HTML [听不清]。 JASON HIRSCHHORN:那倒 把它直接在那里。 但是,如果我想将它添加到 - 我已经创建一个字符串,对不对? 把在海洋,什么是 该字符串的名字吗? 观众:HTML。 JASON HIRSCHHORN:HTML。 那么我写的下一个? 观众:等于,等于。 或者只是等于? JASON HIRSCHHORN:什么会 发生什么,如果我写等号? 观众:那不设置 平等 - 或者不会说 - 观众:分配? JASON HIRSCHHORN:它会分配给它, 但会发生什么一切 被存储在它之前? 观众:它会摆脱它。 JASON HIRSCHHORN:它会摆脱它。 我那么如何才能将它添加到尽头? 我只是复制 - 观众:加等于。 JASON HIRSCHHORN:加 等于,完美。 这是完全正确的。 所以,现在让我们来看看这是什么呢。 轰! 哦,我的天啊。 这仅仅是大量的文字。 确定。 所以看起来我们得到了很多 文本的,但这是伟大的。 你们这样做 - 我知道这是很难的,这是新的。 到目前为止,你们三个 做了梦幻般的。 好吧,你是下一个。 我们应该怎么办呢? 显然,我们不希望它 玩只是字符串。 是吗? 观众:我只是有一个问题。 你知道,当你做ocean_array, 海豚,在括号内,不 像一颗颗关联 数组本身? JASON HIRSCHHORN:我讲错。 海豚的索引。 观众:但不是变种 海豚在海洋 - 我的意思是,当你开始加载它 好了,在海豚变种海豚,是不是 那一颗颗一个关联数组? JASON HIRSCHHORN:此海豚? 观众:是啊。 JASON HIRSCHHORN:号 这是海豚的索引。 观众:确定。 那么,有没有海豚变量? 我的意思是,像海豚关键 关联数组? JASON HIRSCHHORN:就在这里? 像,dolphin.name? 观众:是啊,有没有 像海豚点 - 像不海豚意思 为每个对象? 观众:是啊,这 我的想法了。 观众:我觉得海豚很喜欢 关联数组中海豚。 因为有6联想 阵列海豚,对不对? JASON HIRSCHHORN:对。 我们这个书面的方式 现在,事实并非如此。 观众:为什么呢? JASON HIRSCHHORN:我们能做到这一点,和 那里实际上是一个jQuery函数 调用。每个给 你每一件事情。 但这种语法不 - 我刚才讲错 - 此语法 是不是这就是索引。 这只是给我们的指标。 但你可以做的美元符号。每个, 这是一个jQuery函数。 这将使你的每个 关联数组。 因此,检查了这一点。 但是,这就是所有这些代码一样。 观众:所以这第一个for循环,我 想这将重复六次 因为你有六个指标。 然后第二个for循环, 这不就是遍历 次同量? JASON HIRSCHHORN:是啊。 观众:所以真的没有 - 我们 可以写在第一个for循环 再次,它会工作。 海豚一样,变种海豚? JASON HIRSCHHORN:是的,但我们 现在使用ocean_array。 我们已经搬到一切成 ocean_array因为说我们永远要 改变什么在dolphins.js,或者如果 我们要操纵ocean_array 后来,我们不想操纵 海豚,该变量。 我们想操纵它的一个副本, 因为如果我们要采取一些 出,这样一来我们只是 将是安全的。 这是否有道理。 观众:是啊。 JASON HIRSCHHORN:确定。 因此,卡洛斯,我怎么把这个字符串 并使它的图像代替,并获得 实际的图像? 你以前看到这样的代码。 我该怎么做,包括一个页面上的图像? 观众:是不是我们做的事儿 该HTML加上等于TE调用冲刺 宽度,她删除了? JASON HIRSCHHORN:这 东西就在这里? 观众:是啊。 那种。 JASON HIRSCHHORN:不 担心。 这只是开始的HTML字符串。 如果我想包括图像在我 HTML网页,我该用什么标签? 观众:我不记得了。 JASON HIRSCHHORN:确定。 AVIE,帮助他? 听众:这将是锚, HREF,然后你连接了吗? JASON HIRSCHHORN:所以在锚。 观众:你并不需要 联系起来,不过,对不对? JASON HIRSCHHORN:那如果我只是 要创建的图像吗? 观众:这将是IMG,然后 SRC等于任何字符串是什么? JASON HIRSCHHORN:好了, 这是正确的,IMG。 卡洛斯,你要 把它从这里。 IMG代表“形象,”和src看台 为“源”。你需要给它 URL或一些 - 甚至没有一个URL。 有些位置的 图像被存储。 所以,我知道,这将让我一个 图像,所以现在我怎么把这一切 在一起,以为? 我有一些语法,我需要修复。 究竟我需要 打字,卡洛斯? 观众:我没有得到什么 你正在试图做的。 所以你试图把所有的 将图像转换成一个表? JASON HIRSCHHORN:我们想显示 在该页面中的所有图像。 我们看到这个怎么行代码的权利 在这里添加字符串到我们的HTML字符串 并打印出来是这样的。 我们不是要显示的图像。 我们意识到,丸,告诉我们 这行代码 - 所以让我们来看看在这里。 如果我们去和摸索,我们将 编辑此为HTML。 丸,说,如果我们做这种 语法,我们得到的图像。 这是否有道理? 这是字符串的类型,我们 真想把海洋里 潜水,不是简单的文本本身。 观众:[听不清] JASON HIRSCHHORN:对不起? 观众:你就不能复制 那一个Kianna了, 并把它变成了 - JASON HIRSCHHORN:复制此, 并把这个权利吗? 观众:是啊。 JASON HIRSCHHORN:这已经很接近,但 有一个问题,这一点, 那是什么? HTML是一个字符串,我们需要 为字符串添加到它。 观众:所以后来你把它放在 - 罗。 JASON HIRSCHHORN:我们有三个 - 这里这个权利不是一个字符串。 我们如何让一个字符串? 你怎么总是做 一些字符串? 观众:我不知道。 JASON HIRSCHHORN:如果我有文字, 我怎么做它一个字符串? 想在这里在这条线就在这里? 观众:把它放在一个表? JASON HIRSCHHORN:怎么样呢? 观众:报价。 JASON HIRSCHHORN:双 报价,对不对? 双引号使东西 一个字符串。 这样就使得该字符串, 这是一个字符串。 我如何把两个字符串 一起在JavaScript? 观众:点。 JASON HIRSCHHORN:不点。 这是PHP的。 观众:加。 JASON HIRSCHHORN:另外,分毫不差。 所以加上,然后你是什么 亦建议我在这里? 观众:另一句名言。 JASON HIRSCHHORN:另一句名言,确定。 我如何结束一个字符串? 观众:另一句名言。 JASON HIRSCHHORN:另一句名言。 和我怎么把这个字符串 连同这个字符串? A加。 这是完全正确的。 你只是做了这个给我们。 这是完美的。 所以,现在让我们来渲染这一点。 你看,我们已经有了一个整体 一堆图像。 噢,我的上帝。 这些都是可怕的。 我们要去探索 它们在一秒钟。 是啊,诺亚? 观众:我知道它不是真的 事,但如果你闭上你的 用图片标签元素? JASON HIRSCHHORN:我们可以,如果 我们希望,关闭我们的形象 就像该标签。 让我们来渲染。 对,不,我们不能这样做。 观众:哦,我把它弄坏了。 JASON HIRSCHHORN:我觉得这 为验证,虽然。 我不认为你需要 结尾的斜线。 OK,这是伟大的。 卡洛斯,谢谢你。 到目前为止,你们的四个 做一个真棒的工作。 当然,你可以看到,我们是 创建一些表型坡口。 我想这些东西 要在一个表中。 所以,我怎么把这些 在一个表中的东西呢? 我清楚地需要一些更多的HTML。 阿萨姆邦,我缺少什么样的HTML? 观众:你这是什么 想做的事,对不起? JASON HIRSCHHORN:我希望把所有 在一个表中这些图像,所以每个图像 应该是在表中的一列。 我怎么说,这是一列? 你以前见过这个代码。 这是P中设置7。 观众:我记得有一个是风帆? JASON HIRSCHHORN:TR是为行。 观众:我不知道它关闭 我的心脏,但我可以检查。 JASON HIRSCHHORN:是否 有人还记得吗? 观众:TD? JASON HIRSCHHORN:TD,分毫不差。 运输署把它作为列。 所以,如果我把TD那里,阿萨姆, 我需要什么放? 我需要什么补充? 观众:你必须关闭它? JASON HIRSCHHORN:没错。 哪里去了? 观众:就在那儿? JASON HIRSCHHORN:就在这里? 观众:我想是这样。 JASON HIRSCHHORN:这是什么 关在这里? 这是什么呢? 那蓝色的东西? 观众:这是为图像。 它应该去后,我想。 JASON HIRSCHHORN:OK,完全正确。 因此,让我们看看这是什么一样。 哦,那是很尴尬。 让我们打开了海洋,表, 表身,TR。 因此,我们有一吨,但我 看不到的影像。 这是奇怪的。 它看起来像它建造它,但 没有显示我的图像。 任何想法为什么会是这样? 有什么想法? 观众:如果您滚动 下来,你会看到它们。 JASON HIRSCHHORN:轰! 因此,他们在那里,但是这奇怪, 他们是一路下跌那里。 观众:他们也都在一排。 JASON HIRSCHHORN:而且他们都在一个 划船,他们都是不同的大小。 所以阿萨姆,再给我一次行代码 如果我可以让每一个图像 相同的大小,并且它看起来像我有 已经标注的尺码我 希望他们能。 我怎样才能让每一个图像 相同的大小? 给胡乱猜测。 那么这行代码? 观众:你能不能让 就像一个恒定的? JASON HIRSCHHORN:或者哪里是另一个 请将我可以把下面这行代码, 如果我只是复制吗? 观众:一路下来 在同一行? JASON HIRSCHHORN:好吧,让我们把 它在这里,完全正确。 现在让我们看看会发生什么。 哦,我的天啊! 现在看来,我们开始得到 什么,它看起来像他们 排序的所有适合的表 我们在每一个TD建造。 此外,阿萨姆邦,比方说,我喜欢他们的 高度是多一点点 - 高度的东西是扔我了,所以 我应该怎么设置自己的身高? 选择任何号码。 观众:200? JASON HIRSCHHORN:200。 我要挑100。 这是伟大的。 对于真正喜欢200。 我们走吧! 好了,现在该是开始看起来有点 更好一点更有条理。 任何其他的想法什么我们需要 做存储海豚的照片吗? 是吗? 观众:是的报价,或单 引号,周围的值 源,高度,宽度, 是那些可选的? JASON HIRSCHHORN:在哪里 有单引号? 观众:像一些例子, 你就得喜欢高度 报价等于“150”。是 这不是必需的。 JASON HIRSCHHORN:让我们 往下看这里。 如果我们点击的海洋,进入表中, 你会发现其实这儿了 加引号的那些对我来说。 观众:确定。 JASON HIRSCHHORN:所以,我意识到发生了什么 我们正在做的似乎极为缓慢。 我们只写三行代码 迄今为止,或四行代码,但 这实际上是在该过程 我经过每一次我想 做这个网站。 一行行,使用控制台向下 这里,探究事物和辩别 出一步一步的就是我想做的事情。 所以希望,这种模仿为你们 在一个良好的,教学方法是什么你 实际会做什么时 你建立自己的网站。 让我们继续前进。 我们已经创建了这些东西。 我要去其实 - Avie将,我对你的一个大问题。 我不知道,我们会继续前进。 让我们去“训练海豚时,其 图片被点击了。“你怎么了 亦建议我写这行代码? 观众:有一个函数 所谓的“列车”。 JASON HIRSCHHORN:有一个函数 所谓的“火车”,完全正确。 观众:它需要一个索引。 JASON HIRSCHHORN:火车预计 一个索引,所以,确定。 Avie将,这也正是推理 我喜欢看。 火车需要一个索引。 观众:所以你要去 有一个for循环。 JASON HIRSCHHORN:嗯,我想这样做 图片被点击时,那么Avie将, 如何监控时, 图片被点击? 有几种方法可以做到这一点。 这是JavaScript的能力和 jQuery的,也是最困难的部分。 观众:如果括号,没有。 或者,如果括号事件,还是 比较简单? JASON HIRSCHHORN:所以我们看到了一对夫妇 如何做到这一点的讲座。 有一件事是,到这里,你可以 这样做,你可以创建一个 功能像点击,或做 像上点击。 大家都记得看到 类似的东西? 你在HTML标签内做到这一点。 我看到一些空白的面孔。 有些人是这样,有什么 是他在说什么? 这很好,因为我认为这是 更复杂的方式来做到这一点。 我们要做一个更容易 方法使用jQuery。 所以,Avie将? 观众:嗯? JASON HIRSCHHORN:如果我想要做的 jQuery的东西,我明明开始, 像以前一样,有了这个美元符号,开放 括号,括号接近,和双 引用在这里。 现在我们知道了,我需要一个选择在这里。 你建议将适用什么选择 每一个单一的形象或每 单画面? 观众:图片? JASON HIRSCHHORN:这是 完全正确。 这将适用于每一个单一的形象。 获取所有的人。 这不是一个ID,它不是一个类,它的 一个类型的标签,而这是要 让每一个。 现在我要告诉你这 现在,你可以看看更多 在它后面的文件,但这个 所谓的“上”与事件交易的事情。 所以,你该得到现在要做的,而且是 超级强大,是说什么的类型 你要找什么事件 你想要做的,当你 接收该事件。 所以,我要给你一个小 更多的代码,Avie将,然后 你得走了,好不好? 观众:确定。 观众:开 - 我们要去说 “点击”在这种情况下,你会 一般使用。 依此类推一下,然后我们要 它传递了一个匿名函数。 而这个语法你会看到 了很多,希望你会 被写了很多。 这样做是什么,同样,在点击 一种叫做形象,什么的, 什么叫形象,我们将 运行这个匿名函数。 我不会给它一个名字。 我没有向它传递任​​何参数。 我只是像,营造这里有一个 功能,并在这里解释一下代码 你要做的。 这就是用这种语法手段。 而且,你会发现,它看起来 非常相似,这在这里,我们 之前写了。 OK,Avie将。 所以,你想打电话给列车上的索引。 这是你想要做什么? 观众:是的。 JASON HIRSCHHORN:这是什么? 确定。 让我们看看会发生什么。 观众:请等待,虽然。 指数是不是一个变量现在。 JASON HIRSCHHORN:所以指数不 可变现在。 我不知道你从哪里得到它。 观众:[听不清]。 所以,你需要首先弄清楚 其中海豚得到了点击? JASON HIRSCHHORN:优秀。 你需要弄清楚哪些 海豚得到点击。 这是一种野生在黑暗中拍摄。 任何人有任何想法如何,我自己看着办 什么海豚得到了点击? 如果没有,我只是把它送给你, 因为这是很疯狂。 确定。 因此,让我们通过的console.log打印出来。 这件事情。 因此,美元符号,打开括号, 这种密切括号。 所以,当我点击这个图片,我要去 打印此控制台, ,让我们看看会发生什么。 让我们回到这里。 让我们去安慰。 没有错误,谢天谢地。 确定。 我点击。 让我做了。 我点击这个第一的形象,而这 得到了打印到控制台, 这条线的事情。 我将要使用的 词“这”了很多。 这个东西就在这里,这是很 特别,它在做什么 Avie将要它做的。 它得到了什么 点击或什么的。 因为再次,这个选择会发生 要处理很多事情,我们不 一定知道我们的事 谈,所以我们要弄清楚 其中的事情,我们正在谈论 关于通过这种语法。 在这种情况下,就在这里,包括hashtag海洋, 我们总是知道我们在做什么东西 将要谈论的,所以 我们从来没有真正需要这个 里面包括hashtag海洋。 它总是海洋,那格。 这是一个ID,只有一个可能的事情。 但在这种情况下,这适用于很多 图像,其实6图象 所以我们想知道什么特别的 图像被点击。 它看起来像这样的 信息类型,我们得到。 我们得到它看起来像一些大的 字符串,我们得到了这一切 信息与此有关。 我们得到了成吨 和吨的东西。 jQuery是超级强大。 它给我们一个信息吨 关于这个特殊的HTML元素。 Avie将,什么我们想知道 这个HTML元素? 观众:有点像一个ID。 JASON HIRSCHHORN:一个ID。 好了,我们有一个来源, 一个宽度和一个高度。 观众:我们可以使用一个来源。 JASON HIRSCHHORN:我们 可以使用源。 这会给我们一个字符串, 一个URL字符串。 我们怎么做 一旦我们拥有了吗? 我们怎样才能回到我们 指数ocean_array? 观众:我们可以比较 它到另一边。 JASON HIRSCHHORN:所以我们可以 循环遍历每个。 现在,我们可以再次循环 然后再进行比较。 设想这将是一个更简单的方法, 如果你能想象吗? 观众:由于没有循环。 JASON HIRSCHHORN:由于没有循环。 观众:刚刚搞清楚 海豚,[听不清]。 JASON HIRSCHHORN:塑造 什么海豚。 确定。 因此,让我们保存信息 在此图像中标记。 再次,现在,一部分这方面的东西 仅仅是神奇的,因为我可能会 向您展示这是第一次, 但希望这些事情 你会做的事情。 所以,这是后话 神奇的,你可以做。 你可以节省一些额外的元数据 中的元素。 它会显示不出来,也不会 有什么影响。 你可以将它保存在那里。 而且我建议大家保存 索引与每个图像。 所以,你这样做的方法是创建 所谓数据破折号一个属性, 那么无论你的名字 想给它。 数据破折号是一种特殊的东西,就是 给你,它说这是 一些用户将创建。 因此,我们正在创造这个东西叫 指数,该键称为索引。 和它的里面,我们打算把 不只是一个每次,但做什么 我们把它里面,Avie将? 善有善报就在这里? 观众:海豚。 JASON HIRSCHHORN:海豚。 那是不是这个词。 海豚。 再次,我们已经打印海豚 早些时候,即0,1,2,3,4,5,和 我们正在保存与图像。 所以,现在,如果我这样做 - 并再次, 我们保存元数据。 如何访问这些元数据? 这是一个刚刚被调用函数“的数据。” 而你需要通过它的一个 只有一个参数,这个参数 是事物的名称。 所以,我要打印出来, 然后我会回答大家的提问。 但本质上,我是说给我这个 被点击的对象,看看 在所有的数据属性, 而一个名为“索引” 给我的价值。 ,让我们看看会发生什么时, 我们刷新此页面。 正是我们的预期。 再次,这是相当不可思议的。 我们只是做了很多在那里。 谁都有关于什么问题吗? 是吗? 观众:我只是有一个问题 关于你的真实代码。 您可以使用像一个单引号,双 报价,喜欢那里。 JASON HIRSCHHORN:就在这儿。 观众:是啊。 在那里,为什么你做一个理性的 单引号,双引号? JASON HIRSCHHORN:还有一个原因, 而这又回到了马库斯 刚才问。 在这一行,我是一个 位在我的编码更好。 我想这一点,这就是我说实话 应该已经做了所有的 时间,宽度和高度 特别是。 让我们来看看这儿吧。 你会看到这里, 你可以看到? 我知道这是有点小,但数据 短线指数是在双引号中。 这些事情总是需要 要在双引号。 该值总是需要 在双引号。 但在这里,如果我做了双引号,那 将结束这个字符串就在这里, 现在我也不会 在输入一个字符串。 所以我避开,通过只使用一个 单引号,因为一个单引号 不结束的JavaScript字符串,但 在HTML中它并不关心,如果你是 给它单引号 或双引号。 这将只是把它解释 像双引号。 这是否有道理? 是吗? 观众:你如何得到该IP地址 在客户端的底部? 雷说,没有IP地址。 有什么我应该 已经做了[听不清]。 JASON HIRSCHHORN:在您的设备, 它有什么? 观众:是的。 JASON HIRSCHHORN:也有一些是 你可以做些什么来解决它,但我不 会花时间走 通过现在。 但是,我们可以节后做到这一点。 观众:如果你回去 控制台,为什么是 上市012321号? JASON HIRSCHHORN:控制台? 呵呵,因为我只是点击 各地疯狂。 观众:哦,好吧。 没关系。 JASON HIRSCHHORN:再次,我可以点击 在东西bajillion次。 观众:我的问题是关于 你的循环再次,你的for循环。 因为你知道P中设置八人,他们 使用不同形式的循环。 因此,他们像变种i等于0,我少 比,ocean_array.length,我+ +。 是那些相同呢? JASON HIRSCHHORN:这是 一个标准的for循环。 或者是啊,这就是for循环。 事实上,我们已经看到这是等价的。 观众:这就是等价 什么你在这里做什么? 一个更好的考虑 比其他的? JASON HIRSCHHORN:号 所以,再一次,我们已经走了 在一些事情。 现在我们已经搬出了我们的舒适区 并开始做一些很酷 事情,我们不一定去 在课堂上过,但会 希望是非常强大 为你编码时。 AVIE,让我们回到了这里。 我有海豚的索引。 现在有什么我需要做什么? 观众:你需要训练它。 所以,而不是把console.log的,你 可以设置一个变量等于? JASON HIRSCHHORN:确定。 所以呢? 观众:我不知道 如果你能做到这一点。 JASON HIRSCHHORN:那么变种x等于 这一点,无论它返回, 它会返回它。 没关系。 它可以返回任何变量。 有没有种在这里。 观众:或者你可以只 做函数调用。 JASON HIRSCHHORN:是啊, 我为什么不这样做呢? 只是做函数调用。 观众:是啊。 把另一组括号。 JASON HIRSCHHORN:完美。 这是完全正确的。 因此,将调用列车的功能。 当然,没有什么是在火车上 功能,所以建议,AKSHAR,我 应该做在火车上的功能。 给我一些伪代码。 观众:我觉得你应该删除 从原始表海豚。 JASON HIRSCHHORN:这是越来越 诺亚更早,为什么我们复制 到一个新的数组。 对的,因为我们没有给我们的编辑 海豚数组,因为什么,如果另一 程序的使用它,或如果我们想 访问到其他地方? 不是我们不想做一个拷贝,而这 一,我们要编辑。 观众:那么你的位置 它在您的新位置。 JASON HIRSCHHORN:什么做的 我们需要在那之后呢? 观众:然后你打印出来的 关于海豚的信息。 JASON HIRSCHHORN:这是 完全正确。 我们从ocean_array删除它,我们 把它放在池,然后我们绘制 海洋池中。 如何删除海豚 从ocean_array? 观众:你去索引。 哦,好吧。 使用拼接功能。 JASON HIRSCHHORN:OK,所以这是正确的。 我可以用一个拼接功能, 取出来的东西从一个数组, 凝结了。 这是新的东西,我们 以前没有见过的。 但事实上,我想保留一个空格 那里,因为我想打印出 在海洋中的空白。 观众:然后你可以设置图像 该指数的ocean_array 指数点的图片。 JASON HIRSCHHORN:OK, ocean_array,索引。 观众:点图片。 JASON HIRSCHHORN:点图片。 观众:你将它设置为NULL? JASON HIRSCHHORN:等于空。 确定。 所以没什么的存在,这样的话 我怎么把在游泳池? 康斯坦丁,我该怎么办 把它放在池? 我们有这个变量,我们称之为, 所谓的游泳池,在这里。 观众:我们是否只是做等于 ocean_array指数? 观众:应该不是你 开关的顺序? JASON HIRSCHHORN:一秒钟。 是吗? 观众:是啊,这是 实际上是一个很好的点。 JASON HIRSCHHORN:善有善报吗? 观众:它是索引? JASON HIRSCHHORN:指数,没错。 和你说什么,君士坦丁, 是我们应该做的? 观众:我们也许应该 切换的顺序。 JASON HIRSCHHORN何必 我们切换顺序,也许? 观众:因为在那个 指出它已经空。 JASON HIRSCHHORN:所以这还不是全部为空, 但我们已经失去了图像的URL。 我们已经失去了它永远不会消失? 观众:从技术上讲没有? JASON HIRSCHHORN:有 我们失去了它永远不会消失? 观众:号 JASON HIRSCHHORN:嗯,它在哪里? 观众:在你原来的海豚 - JASON HIRSCHHORN:这是海豚, 但在ocean_array 我们已经永远地失去了它。 所以康斯坦丁,你能提出一个 更好的方式来写这条线? 事实上,对不起,它保存在池中。 我们有它在池,因为 池是一个对象,对不对? Ocean_array指数,一个ocean_array 是一个对象数组。 所以池是一个对象,我们有 在那里一个URL,并且向下 在这里它被设置为null。 所以实际上,我们有没有 永远的失去它。 这只是保存在池中。 但它肯定不是在ocean_array, 而像你说的,卡洛斯,它是在 海豚阵列。 所以这个长相甜美。 然后我们怎么画 海洋和池? 马里奥? 观众:你可以只调用 draw_pool和draw_ocean? 这么喜欢,draw_pool,然后 - 嗯,是的,它不带任何东西。 JASON HIRSCHHORN:太好了。 什么是draw_pool怎么办呢? 观众:绘制池? JASON HIRSCHHORN:是啊, 它是什么怎么办? 观众:对不起。 你可以做同样的 的事情,就像有 - JASON HIRSCHHORN:等一下, 我们去到那里。 什么都没有。 它什么都不做,现在。 让我们来看看这工作的。 谁给了我们的代码? AKSHAR和君士坦丁 给我们的代码? 好吧,让我们看看会发生什么。 啊! 这是如此令人兴奋。 它的消失。 呵呵,小伙子。 这是有点丑。 好了,我们可以回去 并修复以后。 我不知道它在哪里? 我们救了它在该池中的变量。 我怎么能弄清楚,如果是 该组的变量? 好了,再次,JavaScript的力量, 特别是工具 Chrome浏览器给你,是你现在可以 检查该池的变量。 这是全球性的,还记得吗? 我们没有把var关键字。 所以,如果我输入回车就在这里, 康斯坦丁,你觉得我 要得到,当我按下回车键? 观众:我不知道。 JASON HIRSCHHORN:你猜。 观众:什么都没有? JASON HIRSCHHORN:没什么,错了。 这是一个很好的猜测,虽然。 我得到的对象。 记住你给我 这行代码。 池,你保存在该 变量的对象。 而事实上,我们所看到的物体 你救了它。 这真棒。 我们可以检查从这里。 这几乎就像实时GDB的 我们可以通过看我们的代码和 弄清楚的东西了。 那是超爽,超强悍。 好吧,让我们来完成这件事。 让我们画池在五分钟内。 丸,给我行 代码绘制的游泳池。 观众:你可以有另一种 变量的HTML,但/对。 JASON HIRSCHHORN:让我们 它现在很简单。 让我们只是打印的名称 海豚,我们正在训练。 观众:然后你就可以做美元 签署,开括号, 然后打开引号。 我猜一斤池,如果 这是一件事。 我不记得了。 JASON HIRSCHHORN:让我们回顾一下。 我认为这是一个东西。 观众:好吧,是的。 然后关闭引号,括号接近 ,HTML,开括号, 然后我猜池,就像打开支架 0或类似的东西。 关闭点名称。 我不知道是否能工程。 观众:好,让我们看看会发生什么。 “无法读取的属性名 未定义的。“所以,再一次,这里是 我们要退房。 我们要探讨这个问题。 你们这样做,游泳池,开放bracket0。名。 同样,我做这一切的时候,我 困惑是怎么回事,有哪些呢 这个警告的意思。 让我们来看看池。 让我们来看看池支架 0,未定义。 所以这就是我们正在运行 进入我们的问题,对不对? 池支架0没有, 显然,存在。 你怎么看这些现象? 观众:是池刚 一个目的是通过本身? JASON HIRSCHHORN:那么, 它说的对吗? 当我们敲回车上池, 它说什么这是什么? 对象:对象。 JASON HIRSCHHORN:它是一个对象,所以? 观众:哦,是的。 所以只是pool.name代替 - JASON HIRSCHHORN:Pool.name给 你想要什么。 我意识到我所经历的这 慢慢地,哪一方这一点上,但 这就是我究竟是如何做到这一点的东西。 你会遇到这些错误 您的最终项目中,所以我希望 这赋予你能 使用所有这些工具。 这些都是至关重要的,将 让你的超级骗子远。 所以,我不希望只是 打印出了名。 让我们把它一点点 位比这更好的。 观众:还有什么我们想要做什么? JASON HIRSCHHORN:好,很好。 我们就是这样做的。 唉。 伙计们,就没有生命。 OK,繁荣,得到了它。 看起来不错。 你会看到,AKSHAR,到这里, 我们已经为空,没有发现。 所以看起来它仍然试图 找一些形象,并没有做 正是我们想要做什么。 我们不打算进入,现在,但 有可能是一个更清洁的方式 这样做。 观众:你能像离开 对于图像的空白区域? 而不是将其设置为空似的, 您可以将其设置为喜欢的空白 串什么的? JASON HIRSCHHORN:喜欢这个? 观众:是啊。 JASON HIRSCHHORN:[听不清]。 没有找到。 因此,有这样做的更好的方法。 我建议这样做。 只是设置空在那里。 然后,当然,有什么 会发生什么? 这将完全消失。 因此,如果我们想保留一个空间,做 这一点,我们可能想要做的事 在这里为好。 我将让你开始。 AKSHAR,给我这个行 代码真快。 观众:如果ocean_array,海豚, 等于,等于,等于 - 等于null? 是啊。 JASON HIRSCHHORN:然后呢? 观众:然后做HTML。 你刚才复制的底层代码,真的。 JASON HIRSCHHORN:复制什么? 观众:你可以复制 - JASON HIRSCHHORN:这个? 观众:是啊。 JASON HIRSCHHORN:所有呢? 我们没有图像。 观众:我的意思是你 可以只留下 - 是的,你可以关闭它。 但我认为你必须设置宽度。 JASON HIRSCHHORN:那么,就 创建一个空列。 确定。 然后在这种情况下,我们可能会 要做到这一点。 哎呀。 呵呵。 没有工作,但我们不 收到该错误。 让我们来看看发生了什么事到这里。 所以,有什么也没有,那又怎样 你说我们应该补充? 观众:我们应 行的宽度。 JASON HIRSCHHORN:要什么? 观众:我认为这是150。 观众:是的,这是150。 JASON HIRSCHHORN:我们会把这个位置 保持我的代码是一致的。 但是,这是不是一个。 好的,好的。 发布。 好不好? 因此,它仍然要离开。 观众:哦,叫宽? JASON HIRSCHHORN:它看起来 像的宽度为150。 让我们来看看。 现在我们要做的最后, 冷静,强大的东西,我很 要告诉你。 我们不打算做完这个代码,但 网上之前,我们不干,这一切 代码是正确的。 我会向您发送电子邮件的修正版本 用我自己的一些造型后 节,并会在网上公布。 我鼓励你继续探索这个 并以此作为参考,但我 想告诉你这样做的最终工具 类,那就是在这里上 右手侧。 我们看着这最后一周,但现在 希望这是更熟悉一点 你和舒适。 你可以动态地玩 用页面的CSS。 实际上我们已经看到了我们 与HTML动态地玩。 请记住,我们做了正确的 单击编辑为HTML? 就在这里? 因此,我们已经发挥动态 与HTML。 在控制台中,您可以动态地玩 用页面的JavaScript的。 举例来说,这是一个有效的 JavaScript的线。 轰,我得到了正是我想要的。 因此,我们可以动态地与玩 HTML,动态与玩 JavaScript的。 现在,我们要动态 玩了CSS。 而这一切是因为它像 瞬间,生​​活GDB的反馈,所以你 能有之前知道的东西的权利 去你的代码,你可以 不猜是什么东西的 将会是什么样。 因此,这是超级骗子爽。 而且我们最后看一下动态 玩了CSS。 这就是在这里上的权利 右手边,element.style。 让我们去到这一点。 这里是我们的元素。 让我们给它一些额外的CSS。 或不好意思,我们可以给它一些额外的 CSS的,但是我们可能,在这种情况下, 要更改此属性。 所以,让我们到这里来这条线。 哦,我不能这样做在这里。 抱歉。 编辑AS - 所以这就是你如何能编辑的CSS。 我们不会编辑CSS在这 第二,但是我们要编辑 HTML和给它 一个额外的属性。 那你建议改变这个呢? 我想Avie将有一个建议。 观众:山口宽? JASON HIRSCHHORN:这看起来像 它没有做任何东西。 让我们尝试了CSS。 观众:[听不清]类? JASON HIRSCHHORN:它说 这是行不通的。 它给出了黄色的东西。 观众:但是[听不清]。 观众:你是不是设置width 图像以150的,当你这样做吗? 就像你不会只用宽度? JASON HIRSCHHORN:是啊。 观众:但是我们没有 图像了。 JASON HIRSCHHORN:号 我们没有在那里有什么。 因此,我们不会解决 具体的问题。 我们要回去AKSHAR的 的解决方案,因为我想设置一个 海豚当时, 或者这是最后 我要完成的事情。 所以,我们要离开这里了这个 同时认识到它不是相当 正确的,我们将 回来吧。 抱歉。 我说我们可以动态 更改CSS。 让我们来看看那个,做 那真的很快。 所以,如果我检查这个元素到这里, 并说我想让它蓝色, 你可以在这里过来,颜色,因为 我知道,改变的颜色 什么,我们看到了如何 它改变了蓝色。 所以这是我的动态 改变的CSS。 不改变它的好,但随后 我可以返回到我的CSS文件和 改变对象的颜色。 确定。 这是一个很多。 我们没有完成我的惊人的计划。 让我告诉你它是真正的快, 然后我们再把​​头伸出。 哦,它在哪里? 不! 坚持住。 好了,当你正在收拾起来,一 惊人的预览,或前 查看下一次。 这是海豚训练师2013年, 而这是行不通的。 大。 [笑] JASON HIRSCHHORN:哦! 轰! 这是什么意思? 观众:你没有文件模式。 JASON HIRSCHHORN:我没有chmod将其。 观众:行之一。 JASON HIRSCHHORN:哦,看那个。 确定。 所以,我有我的六个海豚。 发生了什么? 让我们来看看。 如果我训练之一,现在的训练丽丽。 哦,我想你自由,丽丽。 你去那里,回到了大海。 所以这是这个星期。 如果您有任何疑问, 我们会在外面。 再次,我会送你 这段代码的其余部分。 谢谢你,伙计们。