>> 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：哦，看那个。
确定。
所以，我有我的六个海豚。
发生了什么？
让我们来看看。
如果我训练之一，现在的训练丽丽。
哦，我想你自由，丽丽。
你去那里，回到了大海。
>> 所以这是这个星期。
如果您有任何疑问， 我们会在外面。
再次，我会送你 这段代码的其余部分。
谢谢你，伙计们。