>> 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：哦，看那個。
確定。
所以，我有我的六個海豚。
發生了什麼？
讓我們來看看。
如果我訓練之一，現在的訓練麗麗。
哦，我想你自由，麗麗。
你去那裡，回到了大海。
>> 所以這是這個星期。
如果您有任何疑問， 我們會在外面。
再次，我會送你 這段代碼的其餘部分。
謝謝你，伙計們。