JASONハーシュホーン：ようこそ、 週9に誰もが、。 我々は我々の前に刺激的な週持っている 我々は最後の問題のセットを持っているので。 我々はまた、ブランドの新しい言語を持っている、 あなたは既にしているJavaScriptの、 これのためだけでなく、使用している最中 問題設定されますが、皆さんの多くは、意志 おそらく最終的なためにそれを利用して 特にプロジェクト、 Webベースの最終的なプロジェクト。 だから、我々は後に、今日の上に行くよ何が リソースについて簡単に話して、 私たちは毎週やるいる。 次に、JavaScriptにジャンプして、よ 私たちは、とセクションのすべてを費やす ドルフィントレーナーコーディング活動ハンズオン マッデンのようなものです2K13、 2013しかし、イルカのために JavaScriptで。 [笑い] JASONハーシュホーン：だから、いつものように、リスト チェックアウトするためのリソースを。 これらのリソースは、特に重要である 来週の理由 水曜日は、2つ目のクイズ1です そして、このコースの最後のクイズ。 ただクイズゼロのように、それは75分です そして午後1時以降はほとんどを開始します。 それは、ゼロ日以降すべてをカバー このコースの、しかし確かにそれ 持つすべてのものを強調している クイズの1以来起こった。 しかし、もちろん、私たちはforループカバー 年の初めに。 ループは、おそらくまだしようとしているため このクイズの一部となるので、そうではありません あなたはそのすべてを無視することができますように 週5またはクイズゼロの前に起こった このコースでは、構築しているため 自体にたくさん。 確かに重点がオンになります 私たちは週6以来学んだもの。 それは、PHPやJavaScript、SQLのが含まれてい 必ず、また、より高度な 我々は、Cでの話なデータ構造 全体の他のトピックのホストが、我々は その次の週に議論する 私たちは、クイズのレビューとして。 また、何かを持っている場合、いつものように あなたがしているように、クイズに関する質問 準備、お気軽に 彼らに私の方法を送る。 今、誰もがいずれかを持っているん クイズについての簡単な質問？ [OK]をクリックします。 それか、フリークを心配する必要はありません 今約出ますが、中にそれを保つ あなたの心の奥、それはだから 今から一週間、一日が起こって。 最後に、私は我々が向かって実行している知っている 学期の終わり - 後に残された唯一つのセクションがあります この - 私はまだ興奮していますし、 あなたのフィードバックを熱望 あなたがいずれかを持っている場合。 私はそれらの作りたい 史上最高の2のセクション。 彼らはおそらく、各ので、となります ここは素晴らしいですし、史上最高。 私はそれが可能なのか知らないが 彼らはすべての素晴らしいされてきたと思います。 私が得ているフィードバックはオフに引きずっている 用以来何とnoneに ここ数週間、そう与えてください あなたがそれを持っているなら、私にいくつかのフィードバック。 これは、3分かかります。 あなたは私にあなたが良いものを伝えることができます 私がやって維持したいか 物事は私が上で動作することができます。 私は最良の教師になろうとしています 可能な、または私は最善をやろうとしている 私がすることができますが、私にはない場合、私はそれを行うことはできません 君たちがやっている方法を知っている。 そして、それはあなたが落ちている理由を伝えるのは難しいです クラスで眠って、そうさせて頂いております それがそうであった理由を後に知っている。 私は先週あなたにこのイメージを示した。 これはティーンエイジ·ミュータント·ニンジャ·タートルズです 私が若かったときに私が持っていたバイク、 私たちはあなたたちをプッシュし続けている 補助輪なしで私達が浸すように 別の言語で使用。 しかし、安心は、JavaScript、PHPのような、 あなたがしたものと非常によく似ています 過去に行われ。 ロジックの多くは、次の場合に、上の転送 ていない構文、正確に1対1。 しかし、再び、これらの言語のすべてのこと 我々は過去数で見てきました 週間、彼らは圧倒的に見えるものの、 信じられないほど強力であり、できるようになります あなたの最終的なプロジェクトで多くのことを行うには おそらく他のウェブサイトがあること 将来的にコード。 そう前置きすることなく、我々は行っている JavaScriptにダイビングを開始します。 我々は簡単にそれについて話をするつもりだと その後、実際に実践的に入る このセクションの一部をコードする。 だから、JavaScriptはクライアント側のスクリプトである それがあることを意味し、言語、 PHPとは異なる、それは違う C. JavaScriptをコンパイルしていないのものより それはサーバが実行されないだ。 むしろ、あなたはそれをロードします。 あなたがロードするときには、JavaScriptのページをロードする ウェブページ、及びそれが実行する あなたのマシン上で。 その意味は、すべて見ることができます たJavaScriptのコード お使いのコンピュータに送信されます。 時にはそれは、Aを短くしたりコード化されたのは あなたがそのようにビット、ビット暗号化 何が起こっているのかを明示的に伝えることはできません。 たとえば、チェックアウトするかどうか、CS50 今週のためのスタッフのソリューション 、問題が設定され、あなたがservice.jsに行く あなたが実際に言うことができないわかります 私たちはあなたを与えたものから実行する。 我々は作ってそれを少し暗号化 もう少し難しいもの。 それにもかかわらず、あなたは正確に見ることができます JavaScriptを我々は実行されているファイル 私たちのプログラムが実行されている。 だから、それがあることを意味するものだ クライアント側のスクリプト言語。 CとPHP、しかし、JavaScriptに似た forループ、IF /他があります whileループ条件。 PHPと同様に、有する foreachループにも。 にして、もう一度、非常によく似 私たちが見てきた構文 我々はすでにきた言語 と働いた。 最後に、クールな部分の一つ JavaScript、および我々はできるでしょう何か 今日多くのことをやって、そしておそらくあなたがよ もしあれば、あなたのPセットで多くの処理を実行する すでにそれを経​​験していない、あなたがある あなたが持っているすべてのエラーをチェックアウトすることができます JavaScriptコンソールを経由して、コード内。 我々は少し先週見た。 私たちは、コンソールの異なるタイプを見て ページを検査しますが、INに Chromeは、繰り返しになりますが、レイアウトを見ることができ、 あなたのページがあり、HTMLドキュメント 画面上のあなたを示す。 また、JavaScriptのすべてを見ることができます そのページを構成し、以下のことができ、また、同じよう 私が言った、すべてのエラーを参照してください。 JavaScriptコンソールでの。 そして、我々は経験するだろうという点で、より多くの 我々はコーディングを開始ビット。 約もう一つ注意すべき JavaScriptの変数。 PHPの変数と同じように、彼らはしている あなたがする必要はありません、緩く型付けされた 彼らに特定のタイプを与える。 範囲に関しては、それが定義されている 「VAR」キーワードで。 だから、前にキーワードを入れていない場合は、 何か、あなただけの名前を書く 変数の、代入 オペレータ、この場合は等号。 私は、すぐそこにセミコロンを忘れています しかし、セミコロンがあると仮定し すぐそこ。 次に、作成している グローバル変数。 あなたは "VAR"キーワードを入れている場合は、 あなたはそれを地元のいくつかのタイプを与えている スコープは、それがするのかどうか 機能またはループ。 だから、一つのことにある 変数のために注意してください。 JavaScriptは言語です。 jQueryは上に構築されたライブラリです JavaScript言語、あなたが持っている 講義で前にそれを見。 あなたがしようとしている場合、私は非常にお勧め あなたの決勝ではJavaScriptを使用している プロジェクトには、jQueryを知ってもらうこと。 それはあなたが望むすべてを作る はるかに簡単に、多くをすることができません。 また、素晴らしいが付属しています ドキュメントと得るのを助けるために例 あなたが開始した。 今日は、ことになるだろう だけでなく、jQueryを使って。 私はこのスライドに持っているもの、これらの、 jQueryの非常に基本はある。 HTMLファイルの先頭にあるか 何でも - あなたのindex.phpファイル、お index.htmlファイルは、 - 次のことを行う必要があり この2行が含まれています。 これらは非常に一般的なラインです。 最初の行は、jQueryを含み JavaScriptのファイル、2行 あなたが書いたどこに含まれてい 独自のJavaScriptコード。 そしてもちろん、あなたの中にあるため JavaScriptコードは、おそらく使用してきました いくつかのjQueryのライブラリ関数、 それは後に行く必要がある jQueryの包含スクリプト。 我々はこれを探求する 再び瞬間に。 そして最後に、JavaScriptファイル内の、 私はこの1 index.js呼ぶ。 それがscripts.jsである可能性があります。 それが何であれ、どのようなJavaScriptの ファイルには、あなたが、あなたは一般的に開始しました このコード行で、ドル記号、 オープン括弧、ドキュメント、近く括弧、 期間、準備ができて、オープン括弧、関数、 そして括弧、近くに括弧を開き、 中括弧。 そこの内側にコードを投げて、 近くに、中括弧で終了 括弧、セミコロン。 そのため、指定されたとして、これを取る。 あなたはjQueryを使用しているつもりなら、ラップ 中にあなたのjQueryコードのすべて このコード行。 そして、我々は第二で再びそれを見ることができます。 再び我々は、jQueryを使っての作業になります 私たちが行くようにして質問してください 今日、しかし、誰もがいずれかを持っているん jQueryのかに関する質問 今のJavaScript？ [OK]をクリックします。 そう前置き、私が提示 ドルフィントレーナー2K13あなたに。 私は、この最新の約超興奮 製品のバージョン。 いや、ああ！ 私はとても興奮していた。 私はあなたたちに見せするつもりだった、 我々は持っていないようですが、それが見える まだそれを実装しました。 それでは、これは少し大きくしてみましょう。 だから私は、イルカのコードをロードする場合 トレーナー - それをかっこよ。 私は、みんなごめんなさい。 私はクラスの前にこれに取り組んでいた。 私はそれが終わっただろうと思って、 が、私はまだいくつかを持っていると思います 作業が行われなければ残しました。 しかし、ありがたいことに、皆さんには、すべてのいくつかを持っている JavaScriptとjQueryの練習なので、 それでは先に進み、終了してみましょう 一緒にこの。 私は、私はあなたたち、こののコピーを送ったと思う 私は超興奮していたので、 それについて、あなたが持っている必要がありますので、 私が持っている同じコード。 それではに頭みましょう - それダン、みんな、ごめんなさい。 のはしかし、端子に頭みましょう。 ちょうどあなたの過去の問題と同じように セット、あなたが私を持っている場合 - のは、この少し大きくしてみましょう、 あまりにも、あなたたちのために - あなたは私のzipファイルを取った。 あなたは、おそらくそれを解凍した。 それでは、ここで行きましょう。 して、うまくいけば、あなたはにそれを移動する あなたが保存したディレクトリ あなたの問題は、8のコードを設定してください。 私ができるように、我々はそのディレクトリに保存します それにアクセス - または私達はすべてにアクセスすることができます Chromeブラウザのコード 我々のコンピュータ上で。 そして再び、あなたは、そのコードを取得する 単純で発見アドレスを入力 底部の右側 ここにダウンアプライアンス、。 あなたは、あなたのIPアドレスを見つける。 あなたは、Chromeブラウザにそれを入力する お使いのコンピュータ上で、この場合、 私たちはセクション9フォルダしているので、 我々はまた、追加する必要があります セクション9を大幅に削減する。 とさせて頂いております - おっと。 私は私にはない、これを最小化するつもりだ そのクリックスルーを維持する必要があります。 だから、私はこのコードを設定する方法を説明します。 私はすでに、すでにそれをやった。 私はそれらを通過するつもりはありません ステップそれが何だから 問題セット散歩の始まり 行う方法を通して、あなた。 だから先に行くと、あなたはこれを設定するために買ってあげる 第二は、最大が、最初のレッツ グループとして、このコードを探る。 のは、私が何をしたか見てみましょう。 私はそれのほとんどを成し遂げることを試みた クラスの前に、私は思う、私 少し後ろにいた。 それでは、index.htmlを開きましょう。 [OK]をクリックします。 とindex.htmlのは本当に簡単です ページ私はしませんでしたので、 あまりにもクレイジー取得したい。 私は実際にそれを確認したかった 作業していて、私は推測した私 そこまで取得できませんでした。 ここで右来るヘッドは、だ これらのHTMLタグの中に、私たちは気づく 右バットオフカップルのこと。 私たちは、CSSファイルの権利がある ここに、適切な CSSファイルの場所。 我々はここjQueryライブラリを持っている、 あなたは何か違うことがわかります このことについて。 ソースは何かある 本当に、本当に長い。 ajax.googleapis.com/-- ソートのそれは、URLのように見えますが、 確かに似ていない JS / jquery.js。 私が決めたので、それはだと私 ダウンロードする必要はしたくない jQueryのファイル、およびドラッグして保存 マイライブラリに、となる それを担当する。 むしろ、私は取るつもり そのGoogleがホストのJavaScriptファイル。 だから、Googleは実際の数をホストしている ライブラリ、jQueryの、それが1であるため、 最も人気のある、それのホストの その1にも。 それは、それをホストしているだからと、私はしないでください それを心配する必要があり、それらは 彼らはそれを更新しない場合にも、それを更新 私はおそらく、これらを変更する必要があります ちょうどここの数字。 しかし、それはちょうど私のファイル全体を作ることだ システム少しきれいに。 私は本当にホスティング好きではありません これらのすべてのファイル。 Googleの場合は非常に良くだ 私のためにそれらをホストすることがあります。 これは、もう一度、全体を取得している JavaScriptのファイルが、それだけであることだ Googleがホストの代わりに、私の上に 私のコンピュータ上のファイルシステム。 我々はまた、私が2以上に入れていることがわかり ファイルdolphins.jsとtrainer.js。 私たちは、第二のものを見てみましょう。 そして最後に、右ここでこのタイトル。 誰が内部のどのようなコードを私に言うことができる これらのタイトルタグ、場所 それが私のページに行く？ 読者：そのことのようにその ツールバーまたは何？ JASONハーシュホーン：うん、少しタブ chromeウィンドウの上部にある。 そのテキストが行くところです。 体内の、することができますように ここでは、あまりないものを参照してください。 私はちょうど3 div要素を持っている。 私は彼らにいくつかのIDを与え、 私はインチ少しテキストを配置 しかし、私は我々がなぜそれがないと思う こちらには何も表示されます。 実際に、私たちはイルカのトレーナー2K13を参照してください。 私たちは、TODOを参照してください。 それから来てどこか分からない 私はここに表示されていないので。 そのため、おそらくそれは、のいずれかでの 私のJavaScriptファイル。 我々は、第二​​にそれをチェックアウトします。 他の誰かが私に言うことができるもの このIDはここ意味？ 観客：それは、呼び出しの方法だ [聞こえない]内の特定のセクション ファイル？ JASONハーシュホーン：うん。 それはちょうど、参照する方法です この特定のDIV。 IDは、理想的にユニークです。 OK？ タフな群衆。 だから、IDは一般的にユニークです。 あなたがある特定にそれらを与える コー​​ド内の要素。 私は番号を参照したい場合はどう それは、CSSのためだかどうかの要素、 スタイリングやjQueryの？ 私は彼らにどのような属性を与えることができますか？ 観客：クラス。 JASONハーシュホーン：クラス、正確に。 右。 [OK]を、のでindex.htmlを、もう一度、 あまりここで起こっていない。 それでは、別のファイルを開いてみましょう。 のは、私が持っているか見てみましょう。 それは私がここに持っているすべてです。 それではJSフォルダに行きましょう。 私が心配するつもりはありません 今のCSS。 それではdolphins.jsを開いてみましょう。 おっと。 というか - [OK]をクリックします。 だから、dolphins.js、それは実際に見える コー​​ドの一部あなたによく似 8を設定し、問題に与えられた。 あなたはそれをスクロールすることができます。 誰もが私に言うことができる、しかし、 イルカは何ですか？ このすべて大文字イルカ？ それは何ですか？ つまり、データはどのようなタイプですか？ 観客：配列。 JASONハーシュホーン：これは配列です。 そして、我々はそれが私のための配列を知っている ここで、これらの角括弧を参照してください。 そして他の誰かが、何 それの配列？ 観客：オブジェクト？ JASONハーシュホーン：それは オブジェクトの配列。 そして、あなたはそれを見ることができます。 そして、どのようにそれがあることを知っているか オブジェクトの配列？ 読者：あなたはこのコロンを持っているので 中括弧の間にブート？ JASONハーシュホーン：右。 だから私はこここれらの中括弧を持っている、 そしてその後、カンマを見ることができます 違うの分離 この配列内のオブジェクト。 し、各オブジェクトの内部に、私が持っている 何かのコロンと他の何か。 この最初の部分は、一般的に何である、 コロンの左側のもの？ それは何と呼ばれるのか？ 一般的に？ どのように我々はそれを参照していますか？ 観客：インデックス？ JASONハーシュホーン：インデックス、またはおそらく より一般的には、キーを押します。 した後、右手に 側、値。 そう、インデックス、キーを押します。 しかし、我々はそれらの話をしている場合には、 我々は一般的にものを意味する 左側。 単純な配列では、再び、 私たちは、インデックス0を持っていた。 1。 2。 3。 4。 やイルカで、私たちは、イルカ0があるでしょう イルカ1、イルカ2、イルカ3、 イルカ4。 また、このオブジェクトの内部で、持っている、私たち 一般的に物事を参照しません。 または我々だけで、このオブジェクトの権利を持っている場合 ここでは、オブジェクト0を言うつもりはない オブジェクト1、オブジェクト2。 私たちは、オブジェクト名を言おうとしたり、している オブジェクトタイプ、オブジェクトの長さ等といった。 そして、それは我々が値を取得します方法です 右手に。 我々は、オブジェクト名、前記もしそうであれば、例えば、 私たちは、この文字列になるだろう、 「グレース」。 あなたたちは、イルカを私に言ってきたように 単にオブジェクトの配列です。 そして、あなたはすべてのオブジェクトを参照してください。 名前、タイプ、属を持っている。 それを正しく発音されていますか？ 誰ですか？ 属？ 素晴らしい。 長さ、重さ。 それを正しく発音されていますか？ そう思います。 と絵だけのURL オンラインいくつかのファイルに追加します。 そして右ここでは、配列を閉じ、 右下の方に非常に左手に 私の画面の横。 だから、すべてのdolphins.jsですそれは。 ああ、私の良さ。 これはそれを説明しています。 私は、完成しただろうと思っていた すべてが見える。 これらすべてのTODOのがあります。 [OK]を、うまくいけば我々はできる 一緒にそれらを実行します。 我々は前にしかし、最初みましょう それは、ただ歩く このコードは非常に迅速に。 私が述べたように、我々は非常に参照してください。 私が持っていた、この行を開始する スライドは、（文書）。準備（関数（）。 そして、それがために起こっている本質的にどのような あなたの中のすべてのものまで待っているん ページがロードされたので、まで待つされています それはすべての配列は、すべての良いのだ 移動し、実行を開始 このコード。 だから、あなたには、いくつかのPHPを実行するために必要な場合に、もし あなたは、いくつかの画像を取得するために必要な それが何であれ、すべてのコードがされている 設定し、インデックスページに移動する準備ができ または何ページがロードされている、 そして今、あなたは起動しようとしている あなたのコードを実行する。 私たちが最初に行うことはあり 私たちは、この配列を設定します。 と私は、varキーワードを持っていない そこに、それがどうしている この配列の範囲？ 観客：それはグローバルだ。 JASONハーシュホーン：これは、グローバルなので、 ocean_arrayからアクセスすることができます このファイル内の任意の場所。 そして、我々は、ループのためにこれを参照してください。 これは、foreachの言うが、これはありません 基本的にforeachループである。 そして、これは単なるJavaScriptのバージョンであり、 イルカの各VARイルカのためそう どのようなデータ型？ 再び、JavaScriptがいなくても、 どのような、それ自体がこれらのデータ·タイプを有する データ型はイルカです？ 観客：オブジェクト。 JASONハーシュホーン：それには、オブジェクトの。 私たちは、各オブジェクトを取得している イルカ配列内。 私は忘れてしまったようなので、ここでは、それが見え 私たちからこれらのイルカのすべてを置く 巨大なイルカはに思う ocean_arrayので、我々はおそらく、何をすべき その第一。 そして、何かが呼ばれる このプール変数。 私はnullに設定してい。 そして私は、この関数を呼び出す draw_ocean。 私はイルカを訓練するとき、その 画像がクリックされた - 私はそれを行っていない - と イルカの自由を設定するとき ボタンがクリックされる。 したがって、これらは私がする必要があるものです。 私はあなたにいくつかを与える必要がありますね 私がやろうとしていたものの背景。 我々はここに行くのであれば、どのような私は本当に望ん これは、配列を上にしたように見えるように ここでは、むしろそれは "TODO"私を言ってより で、基本的に、テーブルが欲しかった すべてのイルカの写真。 してから、1画像をクリックすると、 私はそれがでそれを置くしたい 下の画面の半分を与える あなたのすべての情報、および それは、プール内のイルカであるように、 あなたが訓練されたイルカ。 だから私はそれは本当にクールだと思った。 あなたは海で、これらすべてのイルカを持っている ここに、あなたは1クリック、 それはプールに行き、と思います あなたはそれを訓練できた。 だから、それは私がやろうとしていたものだ。 して、ここでダウンボタンがあると思います プールでは、あなたがクリックすることもでき、 のように、「自由に」、あなたが設定することができます 無料のイルカ、それが戻って行くだろう 海に。 だから、それは私が作成しようとしていたものだが、 しかし、繰り返しますが、私はあなたの助けを必要とするつもりだ それを作成する。 これらのキーワードのそううまくいけば、いくつかの またはこれらの用語のいくつかを開始します コンテキストで今感覚を作る このプログラムの。 このファイルを使用して探し続けるのをしてみましょう。 我々は、この関数draw_oceanを呼び出します。 それは我々が呼ぶ唯一の機能だ document.readyセクションから。 だから我々はこのdraw_ocean関数を呼び出して、 それは文字列を作成しますように見え、 変数は、こちら。 詳細を追加し、文字列での何かを置く 文字列へのものは、より多くを追加します 文字列のもの、および 次のコード行。 私は、HTML文字列を出力しますと言う。 そして誰かが私に説明何 このコード行していますか？ さて、まず第一に、何をする そのドル記号の意味は？ これは、PHPの変数ではありませんが、どのような そのドル記号が意味するのでしょうか？ 読者：HTMLのIDへのリンク - それは、HTMLコードにリンクするようなものだ？ JASONハーシュホーン：何について そのドル記号？ そのドル記号は何を示しているのでしょうか？ 観客：どういうわけか、HTMLへのリンク？ JASONハーシュホーン：私たちはどこ見てきた JavaScriptでの前に、このドル記号？ 私たちは、講義でそれを見た。 我々はそれについて話しました。 ドル記号は何を意味するのでしょうか？ 観客：jQueryを使って何か？ JASONハーシュホーン：まったく正しい。 これはjQueryを使って何かを持っています。 このドル記号は、私が使用していますことを意味 ここにjQueryのライブラリ関数。 まったく正しい。 だから我々は、その後、ドル記号を書き、 私たちは、このオープン括弧を持っており、閉じた 括弧、そして何が起こるのか、そこに内部 そこに内部のあなたが使用しているとき jQueryのライブラリ関数、またはあなたがしている jQueryライブラリを使用して？ 繰り返しますが、講義でこれを見ました。 誰かが私を与えることができます - あなた また、ここで何かを参照してください。 何がそこの内部に入る？ ジェフは、私の推測を与える。 これは何を＃海、のように見えるのでしょうか？ 我々は前にその場所を見たことがありますか？ 観客：それはライブラリです か何か？ さあ、見当がつかないよ。 JASONハーシュホーン：まあ、みましょう 私は、インデックスのドットを開く - いや、間違った場所。 だから我々は我々が何かを持っ参照 ここに海と呼ばれる。 どこに＃海洋ハッシュタグを見てきました 海、構文の前に？ うん？ 観客：CSS？ JASONハーシュホーン：CSSで。 だから我々は何かをスタイルしたかった、 我々はハッシュタグ、CSSを置く覚えて セレクタ、またはハッシュタグの海、例えば、 とフォーマットのすべて 私たちは、ものに与えたいと思ったこと IDの海で、我々はそこに中に入れる。 だからここの内側には、CSSではありません セレクタは、ここに行く。 jQueryは、それ自身を定義します セレクタの種類。 しかし、それは実際には同じ考えだし、 それらの多くは、CSSと重複。 あなたは、これらのオープン括弧内そう セレクタを入れて、どのような セレクタは、それが何を意味し、 あなたが使うことになるだろう。 この場合、私は今 IDの海を選択する。 私はクラスを持っていた場合 - のは、私は物事のクラスを持っているとしましょう 「イメージ」と呼ばれ、私はにそれを与える 要素の多くは、どのように参照するか 「イメージ？ "と呼ばれるもののクラス 読者：私はそれがドットだったと思う。 JASONハーシュホーン：ドットで。 代わりに、私はここにドット画像を入れて、そうであれば それは私のクラスを与えるだろう と呼ばれるもの "のイメージ。" もちろん、これは超強力であり、そして あなたは多くのものを参照することができます。 実際、私は基本的に参照することができ HTML内の任意のタグ。 私はそれをやってみたかったのであれば、TDは、それはです 我々は前に見てきたタグとき テーブルを作成する。 おそらく精通している Pからのそれは7に設定してください。 この場合には、実際に起こっている それらのすべてを選択します。 それは私に配列を与えるために起こっている すべてのTDタグの。 しかし、それは少し圧倒得ることができ、 そのあちこちに、今、我々はしている ちょうどに固執するつもりは IDを参照する。 だから、これが何をするか、再び、ある すなわち、この場合には、取得する - 申し訳ありません。 index.htmlをし、ここに行く。 それはむしろ海のID、オーシャンズ DIVので、これのこの部分を参照する コー​​ド行は、そのDIVを取得します。 そして、この点は私が呼んでいることを意味 機能、その名 機能はHTMLです。 君たちが見たら、それは、の略です 前に、ドル記号、文書、ドットGET IDによる要素は、内部HTMLに点在しています。 これはちょうどjQueryのバージョンです。 だから、HTMLの機能だけで 内部HTMLを取得します。 その要素の。 我々はここに戻って見ればそう、もう一度、我々はよ インナーHTMLがありません参照してください。 私はこれをしなかったそうであれば、私はだろう HTMLを取得しようとする。 私はこれを入力すると、私は今 HTMLを設定する。 だから私は、文字列に、この関数を渡している、 私が作成した文字列 ここで、その置か格言 海のDIVの内側。 うん？ 読者：あなたが得る 、あなただけのHTMLを取得している コピー、それであれば、右？ あなたはそれを削除していない。 JASONハーシュホーン：右。 私はこれをやったと思った場合 VARでこれを保存する - おっと。 それは、そのすべての情報を得られる があったし、別に保存し 変数には、そのコピーを作成。 観客：[OK]をクリックします。 それを得た。 JASONハーシュホーン：だから我々はいくつかを作成 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ハーシュホーン：ここにこの権利？ 観客：はい JASONハーシュホーン：はい。 観客：だから、あなたはその名前のいたら 何か他のもの、つまり何か他のもの あなたがここに入れるだろうものだった。 JASONハーシュホーン：まったく正しい。 そして、それは良い点だ。 これは少し混乱しています 私は、HTML、HTMLを持っている。 ここで、この内部は私の名前です。 変数で、ここでこの権利はある jQueryの関数の名前。 観客：しかし、jQueryのためには 動作するように機能し、あなたがそれを与える必要が いくつかのHTML入力？ JASONハーシュホーン：その通りです。 または、それを文字列を与える必要があります。 これは、内部​​のその文字列を配置します DIVまたは何の。 これは単なる文字列です。 これは、HTMLで知っているのではなく、 明らかになるように意図的にそれをフォーマット 有効なHTML。 それは、質問に答えるのでしょうか？ 観客：はい。 JASONハーシュホーン：わかりました。 うん？ 観客：どのような場合呼ば海 ボタンか何かか？ 。HTMLはどうしますか？ それが変わってしまう ボタンのテキスト？ JASONハーシュホーン：だから質問です それは何のボタンと呼ばれる場合はどうなりますか？ それは、内部​​が変更されます 何かのHTML。 だから、オープンタグとクローズされている場合 タグは、それは間に何かを入れます 開閉タグ。 開閉いいえがない場合 タグは、それは何もしません。 観客：それは文字通りコピーで と実物のペースト一種？ JASONハーシュホーン：うん。 にコピーおよびペーストから何か 私はそれを渡すどんな変数、 文字列私はそれらの中に、それを渡す 開始タグと終了タグ。 それでは、ここでダウンしてみましょう。 ああ、私の良さ。 draw_poolはしませんでした すぐそこに何でもする。 それは残念だ。 うわー、訓練する。 [OK]を、それ以外にも他にあまりいない。 それではを始めましょう、と それではこれを修正してみましょう。 私は、みんなのを必要とするつもりです これを成し遂げるのに役立ちます。 その行数は実際には存在しない コー​​ドで、私は書くこと、だと思います。 私は数年前これをしたと思います 2K12バージョンについては、そこ その行数であってはならない 書き込むためのコード。 私は、そのコードを削除してはいけません。 私はそれを保存している必要があります。 ああ、クレイジー。 とにかく、を始めましょう。 だから私はこの配列にいるか、私はこれによ 行、と私は私のocean_arrayを持っています。 そして、私はこのすべてを入れたい、 このファイルから、私にすべて ocean_array。 だから、どうやってからすべてを取ることができます そこに、とに入れて ocean_array？ これは、1行のコードだ。 誰が私のコード行を与えることができますか 教えて、どのようなことを行いくつかのアイデアを持っている コー​​ドで何をすべき？ なぜ我々はここでは開始されませんし、私たちはよ 部屋の中を移動し続ける 質問に答える。 クルト？ 最初は何ですか？ 観客：Ocean_array、 ブラケット、イルカ。 イルカ、ブラケット、イルカに等しい？ 資本金すべてとイルカ。 JASONハーシュホーン：わかりました。 の構文を見てみましょう。 右ここでは、これはforeachループのようなものです、 そのため、実際には、多くのやっている 私たちのためのもの。 イルカはオブジェクトである。 だから我々は何かを記述する必要はありません なぜなら、イルカ、イルカのような イルカ自体はある 私がしたいオブジェクト。 それがインデックスではありません。 それは理にかなっていますか？ 観客：うん。 JASONハーシュホーン：それでは、どのようにあなたは あなたのコードを変更することを提案？ 私たちが知っているなら、我々は、インデックスを与えている？ あ、ごめん。 あなたは良いね。 しかし、どのように - 私は別の質問をしてみましょう。 私たちがしたい場合は - それでは実際にこれを書いてみましょう。 気にしないで。 我々はこれを書くつもりだ。 それは素晴らしいことです。 申し訳ありません。 私はそこだけ非常に混乱した。 それでは、そこに残しておきましょう、と 私たちは、イルカのトレーニングに戻ってくるだろう、 イルカを設定する。 ちょうど最初にこの図面海を修正しましょう 機能、我々は戻って来る クルト、それ。 しかし、これまでのところ、とても良い。 それではdraw_oceanの内側を見てみましょう。 間違っていることな行はこれです イルカ中の「ストアの写真 HTML文字列内の海。」と右 今、私はちょうどTODO好きだけど、 本当にイルカを入れたい 海での写真。 それでは、ノア、あなたはあると思いますか 私が最初にすべきこと？ 私は、全体を通過する場合 配列、最初のものです 私は何をすべきなこと？ 観客：我々がする必要がある forループを作成します。 JASONハーシュホーン：forループ。 そして、何べきであること forループのように見える？ 観客：のために - 私たちは、それぞれのイルカを通過する必要が 海の配列内の。 におけるVARのイルカのためのそう - あなたは海の配列を書き込むことができますか？ JASONハーシュホーン：そのような？ 観客：おそらくそうだね。 JASONハーシュホーン：それでは固執しましょう 今のところ、その後、我々はだろうと それに戻ってくる。 そして、あなたは責任を負うことになるだろう その行の。 だから私は、forループによって持っている。 マイケルは、あなたが今までしている。 私は今何をすべきか？ 読者：あなたが取らなければならないだろう イルカの画像を保存します。 JASONハーシュホーン：だからここで 保存されていることでしょうか？ 読者：イルカアレイでは？ JASONハーシュホーン：私は今混乱している あまりにも何が起こっているかについて。 それでは、デバッグを行うことができます方法を見つけ出すましょう この、次に私が来るよ あなたに戻って、OK？ 相当とは何ですか JavaScriptでのprintf？ アニー？ 観客：それは書き文書の？ JASONハーシュホーン：またはどのようにすることができます 私はで何を参照してください。 一番下にあるプルダウンコンソール？ 観客：CONSOLE.LOG。 JASONハーシュホーン：CONSOLE.LOG、 その通りです。 それではのconsole.logをやらせる、としてみましょう ただ、OKでは、「イルカ」を置く？ これが動作する場合、理想的に、我々はするつもりだ 持っている - を見てみましょう、背中、そのファイル内の dolphins.js、6イルカがあったが、 私は6か何かを取得する必要があります うまくいけばにプリントアウト コンソール、右？ 我々はこれまでにあるところですので、我々 クルトのラインアップは、ここでやったし、私たち ノアのforループをした、我々はこれを持っている ラインなので、うまくいけば、我々は6が表示されるはずです コンソールに出力の事。 それでは、私たちを開いてみましょう、のはここに行ってみよう コンソールと私たちのページを更新します。 [OK]を、ので、それは次のようになります。 我々は6指標を見ました。 ゼロ、1つ、2つ、3つ、 4 5、ええ。 観客：どのように入手できますか あなたの内側にそのページ - JASONハーシュホーン：どのように入手できますか ダウンここにこの事を？ 観客：いいえ、内部クロームページ [聞こえない]アプライアンス。 我々はそれを参照するか、できないのですか？ JASONハーシュホーン：このクローム ちょうどここのページ？ 観客：うん。 JASONハーシュホーン：だから、Pセットの中のような 8、私はクロームのウィンドウを開いた 私のデスクトップ上で、私の上 Macintoshデスクトップ。 そして、あなたは、最大でここに、このURLを気づけば このIPに一致する左上、 ここでダウンして対処する。 だから、これを行うには、しかし、初め 問題のセット仕様では、あなたを歩く 正確にこれを行う方法を経由。 しかし、私はちょうどそれを、その後、代わりに のシャトルコードで、私はちょうどでした 私たち独自のコード。 クールなことは、また私たちができるである ocean_array点検。 ocean_arrayがあるようなので、それが見え 6オブジェクトの配列、および それでは、それぞれを開いてみましょう。 ブーム！ 一つ。 そうクルトは、それはあなたのように見える コー​​ドが完全に働いた。 すべてがocean_arrayで始まった。 私は以前misspokeから。 しかし、はい、素晴らしい仕事。 ocean_arrayが正しいか、それが見える 今のように私たちはイルカであることがわかり 0〜5の数は、そうに見えた 配列内のインデックスのような。 だから、知識、マイケル、与えられた 私たちは今何をすべきか？ 声を出して考えてみてください。 私たちがやりたいものは何ですか？ 読者：私たちは、取得したい 各イルカのためのJPEG。 JASONハーシュホーン：わかりました。 では、どのように参照することができます - どのように我々は、JPEGを得ることができますか？ どこで始めるか？ すべてがどこに保存されている？ 観客：ocean_arrayで？ JASONハーシュホーン：わかりました。 観客：そうocean_array、イルカ - JASONハーシュホーン：どのように我々は何 内部の何かを得る - これは私たちにそのオブジェクトを提供します。 そして、我々は前にこれを見てきました 構造を持つ。 だから、表記はどのような 我々が使用する必要がありますか？ 観客：これは、ドットになる。 JASONハーシュホーン：ドット。 した後、どのような分野？ 観客：ピクチャー？ またはそれは、フィールドではありません - JASONハーシュホーン：それは何ですか dolphins.jsに呼ばれる？ そして、あなたが見ることができる、参照してください。 私達はちょうどここに戻って行くことができます。 我々は、ocean_array見ることができます 我々はそれを探索することができます。 それは何と呼ばれるのか？ 観客：タイプ。 待つ。 絵？ 私は絵を言った。 JASONハーシュホーン：写真。 右。 あなたが知っているようにあなたは鳴りませんでした あなたはしかし、話していた。 それはより多くの推測のように聞こえた。 だから絵、与えることはそう 私たちの画像のURLです。 ジェフは、あなたが質問がありますか？ 観客：ええ、私は何を得ることができない あなたのクロームに与える 私のコンピュータのブラウザ。 私はちょうど "キャッチされない参照を取得 エラーコンソールが定義されていません。 " JASONハーシュホーン：あなたはしました すべてのものを設定する？ 観客：まあ、私は私と思う もしすべてをした 大画面でやった。 JASONハーシュホーン：そして、あなた すべてのファイルをchmodded？ そして、あなたは通過しなかった 全体のセットアップ？ 読者：私は再びそれを試してみます。 JASONハーシュホーン：わかりました。 私は、たくさんのことをスキップ 始めていますが、通過する必要があり 時と同じように、全体のセットアップ 問題設定スペックの先頭です。 chmodコマンドのすべてと それはインチだことを確認してください 読者：私は行くし、 それを再確認。 私はそれをやったと思ったが、 私はチェックを倍増します。 JASONハーシュホーン：だから、これは見える それが私たちに与えますように 文字列と絵。 素晴らしい。 我々は、画像のURLを持っている。 どのように我々は、今ではそれを置けばいい - 私たちが書いてあれば何が起こる ちょうどこの、マイケル？ 観客：それはちょうど写真を取得します。 それは実際には表示されません。 JASONハーシュホーン：レッツ 何が起こるかを参照してください。 我々はそれを節約できます。 我々はここでそれを実行することになるでしょう。 我々は何も得ることはありませんように見えます。 私は、この表を探索する場合、 それは内部のように見える - 私は何も得ることはありませんように、ええ、見えます。 観客：我々はする必要がありますか - JASONハーシュホーン：これは文字列である、 右ここにこのコード。 私は、この文字列をどこに置くかをしたいですか？ 読者：あなたがしたい 海に入れて？ JASONハーシュホーン：わかりました。 そしてダウンここで私は、文字列を入れている 海のHTMLと呼ばれる。 観客：だから、それはドルだろう 記号、海、HTML [聞こえない]。 JASONハーシュホーン：それだろう まっすぐそこに入れて。 しかし、私はそれを追加したい場合 - 私はすでに、右の文字列を作成しています？ 海で言えば、何 その文字列の名前は？ 観客：HTML。 JASONハーシュホーン：HTML。 だから私は次は何を書くのですか？ 観客：等しい、等しい。 それとも等しい？ JASONハーシュホーン：何でしょう 私は等号を書きたらどう？ 観客：それは、それを設定しません 等しい - またはそれはできません - 観客：割り当て？ JASONハーシュホーン：それは、それを割り当てます、 しかし、何がすべてのものはどうなる それは前にそれに格納されていました？ 観客：それはそれを取り除くでしょう。 JASONハーシュホーン：これは、それを取り除くでしょう。 それでは、どのよう私は、最後に追加することができますか？ 私はコピーする - 観客：Plusは等しくなります。 JASONハーシュホーン：プラス 完璧に等しい。 それはまさにそうです。 だから今のはこれが何をするか確認してみましょう。 ブーム！ ああ、私の良さ。 それは、テキストだけのたくさんある。 [OK]をクリックします。 我々は多くのことを得たようなので、それが見えます テキストで、それは素晴らしいことだ。 君たちは行っている - 私は、これはこれは新しいですが、難しいですね。 皆さんのこれまでの3 素晴らしい行っている。 [OK]を、あなたは次のだ。 私たちは次に何をすべきか？ 我々は明らかにそれをしたくない 単に文字列を再生します。 うん？ 読者：私は質問があります。 あなたがocean_arrayをするときあなたが知っている、 イルカ、括弧内に、ではありません 連想のようなイルカ 自体の配列？ JASONハーシュホーン：私はmisspoke。 イルカは、インデックスです。 観客：しかし、VaRはありません 海でイルカ - 私は、あなたが最初にとしてそれをロードすると、意味 さて、イルカにおけるVARのイルカではなく、 つまり、連想配列をイルカ？ JASONハーシュホーン：このイルカ？ 観客：うん。 JASONハーシュホーン：いいえ。 このイルカは、インデックスである。 観客：[OK]をクリックします。 だから、イルカの変数がありますか？ 私は中のイルカのキーのように、意味 連想配列？ JASONハーシュホーン：右ここに？ dolphin.name、気に入りましたか？ 観客：ええ、あります イルカのドットのように - のような意味イルカされていません 各オブジェクトになりますか？ 観客：ええ、それはだ 私も考えていたもの。 読者：私は、イルカがどのようだと思った イルカでの連想配列。 6連想がありますので、 イルカの配列は、右？ JASONハーシュホーン：右。 我々は、これが書かれている方法 今、そうではありません。 観客：なぜこれは？ JASONハーシュホーン：私たちはそれを行うことができ、かつ jQueryの関数は実際にあります と呼ばれる。与える各 もしそれぞれの事。 しかし、この構文ではありません - 私は以前misspoke - この構文を それは、インデックスのではありません。 これはちょうど私達に指標を与えている。 しかし、あなたはドル記号を行うことができます。それぞれ、 そのjQueryの関数です。 それはあなたのそれぞれを与えるだろう 連想配列。 だから、それをチェックしてください。 しかし、それだけでは、このコードが何をするかだ。 観客：forループだから、これは最初に、私 それが6回を繰り返すでしょうね あなたは6インデックスを持っているので。 そして、ループする第二、 つまり、繰り返し処理されていません 回同量の？ JASONハーシュホーン：うん。 観客：そういいえ、本当にあります - 私たちは ループの最初に書かれている可能性が もう一度、それがうまくいったのかもしれない。 イルカのように、VARのイルカ？ JASONハーシュホーン：はい、しかし、我々はしている 今ocean_arrayを使用。 我々はにすべてを移動しました ocean_array私たちが今までにしたいと言うので、 dolphins.jsに何があるか変更したり、IFに 我々はocean_array操作したい その後、我々は操作する必要はありません イルカ、変数。 私たちは、そのコピーを操作する、 ので、我々は何かをしたい場合は、 うち、この方法では、我々だけだ 安全になるだろう。 意味をなすことはない。 観客：うん。 JASONハーシュホーン：わかりました。 だから、カルロス、どのように私はこの文字列を取るか そしてその代わりに、画像を確認し、取得 実際の画像？ あなたが前にこのコードが表示しました。 私は、ページ上の画像を含んでどのように行うの？ 観客：それは我々がやった事です そのHTMLのプラスは、TEコールダッシュに等しい 幅は、彼女はそれを削除した？ JASONハーシュホーン：この ちょうどここのもの？ 観客：うん。 の一種。 JASONハーシュホーン：ない そのことについて心配している。 それはちょうどHTML文字列を開始します。 私は自分の中でイメージを含める場合 HTML Webページ、私はどのようなタグを使用するのですか？ 読者：私は覚えていません。 JASONハーシュホーン：わかりました。 Avieは、彼を助ける？ 観客：それはアンカーであるように、 HREF、その後、あなたはそれをリンク？ JASONハーシュホーン：アンカーでのようにA。 読者：あなたがする必要はありません。 右、しかし、それをリンク？ JASONハーシュホーン：何ちょうど私の場合 イメージを作成したいですか？ 観客：その後のimgとされるであろう SRCは、文字列が何であれ等しい？ JASONハーシュホーン：[OK]を、そう つまり、IMGそうです。 カルロスは、あなたがしようとしている ここからそれを取る。 IMGは、「画像」の略で、SRCスタンド 「ソース」のためにあなたはそれを与える必要が URLまたはいくつか - ていない場合でも、URL。 いくつかの場所どこにその イメージが格納されます。 だから私はそれは私を得ることを知っている 画像、だから今、私はこのすべてを置けばいいか 一緒に、と思った？ 私は修正する必要があるいくつかの構文があります。 私は正確に何が必要なのですか 、カルロスを入力するには？ 読者：私は何を得ることはありません あなたがやろうとしている。 だから、すべてを置くしようとしている テーブルへのイメージ？ JASONハーシュホーン：私たちは、表示したい ページ内のすべての画像。 そして、我々は正しいコードのどのようにこの行を見た 私たちのHTML文字列には、ここを追加された文字列 このようにそれらをプリントアウトする。 私たちは、その代わりに、画像を表示したい。 そして、我々は私たちに語った、丸を実現 そのコード行 - それでは、ちょうどここを見てみましょう。 我々は行って、探求した場合、我々はよ HTMLとしてこれを編集します。 丸は、言った、我々は、この種を行う場合 構文、我々は、画像を取得します。 だから、理にかなっていますか？ これは、文字列のタイプです 本当に海の中に置きたい ダイビング、​​単にテキスト自体。 観客：[聞こえない] JASONハーシュホーン：申し訳ありませんが？ 読者：あなただけのコピーはできません キアンナが与えたその1、 そのに入れて - JASONハーシュホーンは、これをコピーして、 ここでこの権利を置く？ 観客：うん。 JASONハーシュホーン：それを閉じていますが、 この一つの問題は、そこだと 何それ？ HTMLは文字列であり、我々は必要とする それに文字列を追加します。 観客：だから、あなたはそれを置く - ナ。 JASONハーシュホーン：そして、我々は3を持っている - ここでこの権利は、文字列ではありません。 どのように我々はそれを文字列にするのですか？ あなたはいつもどのように作るのですか 何か文字列？ 読者：私は知らない。 JASONハーシュホーン：私はテキストを持っている場合は、 どのように私はそれを文字列に作るのですか？ 右こここの行でここまでのような？ 観客：表に入れて？ JASONハーシュホーン：何これは？ 観客：引用。 JASONハーシュホーン：ダブル 引用符、右？ 二重引用符は、何かを作る 文字列。 だから、その文字列を作り、 これは文字列です。 どのようにして二つの文字列を入れてください 一緒にJavaScriptで？ 観客：ドット。 JASONハーシュホーン：ドットん。 これはPHPの。 観客：プラス。 JASONハーシュホーン：プラス、まったく正しい。 あなたが何をすべきか、その後のでプラス、および こっち私が提案する？ 観客：もう一つの引用。 JASONハーシュホーン：別の引用符、[OK]をクリックします。 どのようにして、文字列を終了しますか？ 観客：もう一つの引用。 JASONハーシュホーン：もう一つの引用。 そして、どのように私はこの文字列を入れてください 一緒にこの文字列を持つ？ プラス。 それはまさにそうです。 あなただけの私たちのためにこれをした。 これは完璧です。 だから今のは、このレンダリングしてみましょう。 そして、我々は全体を持って、見て 画像の束。 ああ、私の神。 ものが怖いです。 私たちは、探検するつもりだ 第二にそれら。 ええ、ノア？ 読者：私はそれは本当にない知っている 問題が、あなたを閉じる必要があります イメージタグを持つ要素？ JASONハーシュホーン：私たちができる、もし 我々が望んでいた、私たちの画像を閉じる ちょうどそのようなタグ。 のはそれをレンダリングしてみましょう。 で、[いいえ、我々はそれを行うことはできません。 観客：ああ、私はそれを破った。 JASONハーシュホーン：私はこれを考える しかし、検証です。 私はあなたが必要とは思わない 終了スラッシュ。 [OK]を、これは素晴らしいです。 カルロス、ありがとうございました。 皆さんのこれまでの4 素晴らしい仕事をしている。 ご覧のように当然のことながら、我々はしている 表ベベルのあるタイプを作成する。 そして、私はこれらの事をしたい テーブルにあると。 では、どのように私は、これらは置かない 表にあるもの？ 私は明らかにいくつかのより多くのHTMLを必要としています。 アッサム、私は、HTMLはどのような不足しているのですか？ 読者：あなたは何をし 申し訳ありませんが、やってみたい？ JASONハーシュホーン：私はすべてを置きたい 表中のこれらのイメージなので、各画像 表の1列にする必要があります。 私は、これは1列でどのように言うのですか？ あなたは前に、このコードを見てきました。 これは、Pで7に設定されている。 読者：私は1はtrた覚えていますか？ JASONハーシュホーン：TRが行用です。 読者：私はそれを知らない 私の心が、私はチェックすることができます。 JASONハーシュホーン：か 誰か覚えている？ 観客：tdと？ JASONハーシュホーン：TD、まったく正しい。 TDは列として格納します。 だから私はそこにTDを置く場合、アッサムは、 私は何を入れる必要がありますか？ 私が追加して他には何が必要ですか？ 読者：あなたはそれを閉じる必要がありますか？ JASONハーシュホーン：その通りです。 それはどこに行くのでしょうか？ 観客：右がある？ JASONハーシュホーン：右ここに？ 読者：私はそう思います。 JASONハーシュホーン：これは何ですか 右ここに閉じ？ のためにこれは何？ その青の事？ 観客：イメージのためだ。 それが後に行くべきだと思います。 JASONハーシュホーン：[OK]を、まったく正しい。 それでは、これが何をしたか見てみましょう。 ああ、それは厄介だ。 の海、テーブルを開いてみましょう、 テーブル本体、TR。 だから我々はトンを持っていますが、私 画像が表示されません。 それは奇妙なことだ。 それはそれを建てたように見えますが、 私に画像が表示されませんでした。 任意のアイデア、なぜそうではあるかもしれない？ 任意の考え？ 読者：あなたがスクロールする ダウン、あなたはそれらが表示されます。 JASONハーシュホーン：ブーム！ そこで、彼らはそこにいるが、それは奇妙なことだという 彼らはそこにダウンすべての方法だ。 読者：彼らは、行のすべてのもね。 JASONハーシュホーン：そして、彼らは内のすべてのだ 行、およびそれらはすべて異なるサイズだ。 そうアッサムは、私に1行のコードを与える 私はすべての画像を作ることができれば 同じ大きさ、と私はしたように見えます すでにサイズの私が示された それらになりたい。 どのようにしてそれぞれの画像を作ることができます 同じ大きさ？ 野生の推測を与える。 どのようなコード行はどうでしょうか？ 読者：あなたがすることはできます 定数のように？ JASONハーシュホーン：または別のです 私はこのコード行を置くことができる場所、 私はそれをコピーしたら？を 観客：全押し その同じ行の？ JASONハーシュホーン：さあ、入れさせて それここでは、まったく正しい。 そして今度は、何が起こるか見てみましょう。 善良私の、ああ！ 私たちが取得し始めているようになりましたに見え 何かが、それは、彼らのようになります。 すべての種類の表に収まる 我々はそれぞれのTDで構築してきました。 また、アッサムは、のは、私が彼らのが好きと言ってみましょう 高さは、もう少しようにする - 高さの事はそう、私を投げている 私は彼らの高さに設定すべきか？ 任意の数を選択します。 観客：200？ JASONハーシュホーン：200。 私は100を選ぶつもりです。 それは素晴らしいことです。 本当に200のようにしてください。 我々はそこに行く！ [OK]を、今これは少し見え始めている より良く、もう少し組織した。 我々が必要なもののために、他の思考 イルカの写真を保存するためですか？ うん？ 観客：引用符であり、またはシングル の値の前後に引用符、 ソース、高さ、幅、 オプションのものがありますか？ JASONハーシュホーン：どこ 単一引用符は何ですか？ 観客：例のいくつかのように、 あなたは、高さのような必要があるだろう 引用「150」を表します。です その必要はありません。 JASONハーシュホーン：だからみましょう ここに見下ろす。 私たちは海をクリックすると、テーブルに移動し、 実際にここでそれをダウンに気付くでしょう 私のために、これらの引用符を追加しました。 観客：[OK]をクリックします。 JASONハーシュホーン：だから私は何を実現 我々がやっているが痛々しいほど遅いようだ。 私たちは3行のコードを書きました これまでのところ、または4行のコードが、 これは、実際にはそのプロセスで 私は私がするたび経る このウェブサイトを作る。 一行ずつ、ダウンコンソールを使用して ここでは、物事を探求し、考え出す うちステップ·バイ·ステップ私が何をしたいのか。 ので、うまくいけば、あなたたちのためにこの模倣 何をいい、教育的な方法で 実際にするときことになるだろう あなたのウェブサイトを作成します。 先に進みましょう。 私たちは、これらのものを作成しました。 私は実際に行くよ - Avieは、私はあなたのために大きな問題があります。 私は、我々が移動します、知りません。 ときにの列車イルカ」に行こう 絵をクリックする。「あなたはどのように 私は、コード行を書き提案する？ 観客：機能がある 「電車」と呼ばれて JASONハーシュホーン：機能があります 正確に正しい「電車」と呼ばれる。 観客：それはインデックスを期待しています。 JASONハーシュホーン：電車が期待する インデックスので、[OK]をクリックします。 Avieが、これは正確に推論される 私が見て愛している。 列車はインデックスを期待しています。 観客：あなたが行っている ループを有している。 JASONハーシュホーン：まあ、私はやってみたい 画像がクリックされたときに、Avieので、 ときどのように監視するか 画像がクリックされた？ これを行うにはいくつかの方法があります。 これでは、JavaScriptの力で、 jQueryのではなく、過酷な部分。 観客：カッコ場合、されない。 場合や括弧イベント、または何か 比較的単純な？ JASONハーシュホーン：だから我々はカップルを見ました 講演でこれを行う方法。 一つのことはあなたがダウンしてここに可能性がありました あなたが作成することができますような何かを クリックでのような関数、または実行 クリックでのようなもの。 誰もが見て覚えている そのような何か？ あなたは、HTMLタグの中にそれを行う。 私はいくつかの空白の顔を見る。 一部の人々は、どのようなものか 彼が話している？ 私はそれがだと思うので、それは大丈夫です それを行うには、より複雑な方法。 私たちは、はるかに簡単にやろうとしている 道jQueryを使って。 だから、Avie？ 観客：フム？ JASONハーシュホーン：私が何をしたい場合は 何かのjQuery、私は明らかに開始、 のように前に、このドル記号と、オープン 括弧、近く括弧、および二重 ここで引用している。 今、私たちは、私がここでセレクタが必要に知っている。 あなたはどのようなセレクタを適用する提案か すべての単一のイメージまたはごとに シングル絵？ 観客：イメージ？ JASONハーシュホーン：それです。 まったく正しい。 つまり、一つ一つの画像に適用されます。 それらのすべてを取得します。 それはだ、それはクラスではないが、IDではありません タグのタイプ、これがために起こっている ひとつひとつの1を得る。 そして今、私はあなたにこれを言うつもりだ 今のところ、あなたはより多くを調べることができます 後でそれに関する資料が、これ 事はイベントとお得な「オン」と呼ばれる。 それでは、あなたが今やらせると、これは 、どのような種類の言う超強力である あなたが探して、何しているイベント あなたがしたときにやってみたい そのイベントを受け取る。 だから私はあなたに少し与えるつもりだ それから、もう少しコード、Avie、 [OK]をクリックすると、行くんだ？ 観客：[OK]をクリックします。 観客は：オン - 私たちは言おうとしている この場合には「クリック」したあなたはよ 一般的に使用しています。 クリックでそうしてから、我々はするつもりだ それを匿名関数を渡す。 この構文は、次のように表示するつもりだ たくさんの、そしてうまくいけば、意志 多くのことを書いている。 これは何のクリックで、再び、ある 画像と呼ばれるものの、どのような、 画像と呼ばれるものは、私たちは行く この無名関数を実行します。 私はそれを名前を付けていないよ。 私はそれを任意の引数を渡していないよ。 ここで作成してもだ、のように私は、ちょうどよ 機能、ここではどのようなコードです あなたがやろうとしている。 つまり、この構文手段があります。 あなたが気づくようにし、また、それが見え ここまでこれと非常によく似て、その私たち 前書いた。 [OK]を、Avie。 だから、インデックスに電車を呼び出したい。 それはあなたが何をしたいですか？ 観客：はい。 JASONハーシュホーン：それですか？ [OK]をクリックします。 何が起こるか見てみましょう。 観客：しかし、待ってください。 インデックスは今、変数ではありません。 JASONハーシュホーン：だからインデックスではありません 今変数。 あなたからそれを得たところ私は知らない。 観客：[聞こえない]。 だから、最初に把握する必要があります そのイルカがクリックされましたか？ JASONハーシュホーン：優秀。 あなたが把握する必要がある イルカがクリックしまった。 これは暗闇の中で野生のショットです。 誰もが私が理解できるかどんな考えを持って うちどのようなイルカがクリックされましたか？ そうでなければ、私は、あなたにそれをあげる これはかなりクレイジーだからです。 [OK]をクリックします。 それではのconsole.logを経由してプリントアウトしてみましょう。 この事。 だから、ドル記号、オープン括弧、 この近くにかっこ。 私はこの画像をクリックしたとき、私は行くよ コンソールにこれを印刷するには、 そして何が起こるか見てみましょう。 それでは、ここで戻りましょう。 のコンソールに行きましょう。 エラーが、良さに感謝していません。 [OK]をクリックします。 私がクリックしました。 私は再びそれをやってみましょう。 私は、この最初の画像をクリックし、この コンソールに出力しまった、 物事のこのライン。 私が使用しているつもりだ 単語 "これ"がたくさん。 右ここでこのことは、これは、非常にある 特別な、それが正確に何をやっている Avieはそれが何を望んでいる。 それが何であれなってきた クリックまたは何でも。 繰り返しますが、このセレクターが起こるため、 多くのことに対処するために、我々はしないでください 必ずしも私たちがしているどの事を知っている について話して、私たちは理解したい 出ている事、我々は話をしている この構文を経由して約。 この場合、右ここで、ハッシュタグの海、 我々は常に我々がしているもののことを知っている の話をするつもりなので、 我々は実際にこれを必要なことはありません ハッシュタグ海の内部。 それは、常にそのDIVオーシャンズ。 それは、唯一の可能な事のIDです。 この場合には、これは、ロットに適用される 画像を、実際には、6つの画像、 そして私たちは、特定の何を知ってほしい 画像がクリックされた。 これはあるように見えます 我々が得る情報のタイプ。 我々は、いくつかの大規模なように見え取得 文字列、そして我々はこのすべてを取得 これとの情報。 私たちは、トン、トンを得る とかのトン。 jQueryは超強力です。 それは私達に大量の情報を与えている この特定のHTML要素について。 Avie、私たちは知りたいです このHTML要素はどうでしょうか？ 観客：I​​Dのような何か。 JASONハーシュホーン：ID。 まあ、我々はソースを持って、 幅、高さ。 読者：私たちは、ソースを使用することができます。 JASONハーシュホーン：私たち ソースを使用することができます。 それは私たちに、文字列をあげる、 URL文字列。 私たちはをどうしようとしている 一度、私たちはそれを持っている？ どのように我々は戻って私たちに入手できますか ocean_arrayのインデックス？ 観客：我々は比較することができます それ合う。 JASONハーシュホーン：だから我々は可能性 それぞれをループ。 今、私たちは、ループが再びできた してから、これを比較します。 簡単な方法になるか想像し、 あなただけの1を想像できるか？ 観客：ループする必要がない。 JASONハーシュホーン：ループする必要がない。 観客：ジャスト考え出す イルカ、[聞こえない]。 JASONハーシュホーン：考え出す うちどのようなイルカ。 [OK]をクリックします。 それでは、その情報を保存してみましょう このイメージタグ内。 そして再び、今、このようなものの一部 私は可能性があるため、単に魔法である 初めてあなたにこのことを示しても、 うまくいけば、これらのものがあります あなたがやっているつもりです。 だから、これは何かある 魔法のあなたが行うことができます。 あなたは、いくつかの特別なメタデータを保存することができます 要素内。 それはそれはしませんが、表示されません 何も影響を与えます。 あなたはそこに保存することができます。 そして私たちは、保存を提案 各画像にインデックス。 だから、あなたがそれを行う方法は、あなたが作成している データダッシュと呼ばれる属性、および その後、どのような名前を それを与えたいと思う。 データダッシュは特別なものです あなたに与えられており、これがあると言います ユーザーが作成しようとしているもの。 だから我々はと呼ばれるこの事を作成している インデックスは、このキーは、インデックスと呼ばれる。 そしてその中に、私たちは置かしようとしている 1度にするが、何をすべきかだけではなく、 我々は、その中Avieを置く？ 何が右ここに？ 観客：イルカ。 JASONハーシュホーン：イルカ。 つまり、その単語はありません。 イルカ。 そして再び、我々はすでにイルカを印刷 以前、すなわち0、1、2、3、4、5、および 我々は、画像とそれを保存している。 だから今、私は - と、再び、 私たちは、そのメタデータを保存します。 あなたはそのメタデータをどのようにアクセスするのですか？ それだけで呼び出された関数での「データ」 そして、あなたはそれに1を渡す必要があります 唯一つの引数、その ものの名前です。 だから私は、これをプリントアウトするつもりだ そして私が質問を取るよ。 しかし、本質的に、私は私にこれを与えると言っています クリックされたオブジェクトを、見て そのデータ属性のすべてで、 と呼ばれる1 "は、インデックス化」 私にその価値を与える。 とのは何が起こるか見てみましょう 私たちは、このページを更新します。 我々は期待まさに。 繰り返しますが、それはかなり魔法だった。 我々はちょうどそこに多くのことをやった。 誰がそのことについて疑問を持っている？ うん？ 読者：私は疑問を持っている ライブコードについて。 あなたは二重、一重引用符のように使う 引用符、すぐそこのような。 JASONハーシュホーン：右ここで。 観客：うん。 あなたは理由がありますか 一重引用符、二重引用符？ JASONハーシュホーン：理由があります、 これは戻って何をマーカスに行く 以前尋ねた。 この行では、私がされていた 私のコーディングで優れたビット。 私はこれが欲しい、これは、私正直である のすべてを行っている必要があります 幅と高さのための時間、 特に。 それでは、ここでダウンしてみましょう。 あなたはここを参照してくださいよ、 あなたはそれを見ることができますか？ 私はそれがちょっと小さいですが、知っているデータ ダッシュ指数は二重引用符である。 それらのものは、常に必要です 二重引用符でなければ。 値は常にする必要があります 二重引用符で囲む必要。 しかし、ここで、私は、二重引用符を行った場合 右こここの文字列を終わるだろう、 そして今、私はではないでしょう 文字列中のタイプ。 だから、僕は使用して、その回避 単一引用符のため一重引用符、 JavaScriptの文字列を終了するのではなく、 君がいるなら、HTMLでそれは気にしない それを一重引用符を与える または二重引用符。 それはちょうどそれを解釈します 二重引用符のような。 それは理にかなっていますか？ うん？ 観客：どのようにして、そのIPアドレスを得るのですか クライアントの底に？ 鉱山には、IPアドレスを言っていない。 私がすべきものはありますか [聞こえない]に行っている。 JASONハーシュホーン：お使いのアプライアンスでは、 それは何の関係もありません？ 観客：はい。 JASONハーシュホーン：何かがある あなたはそれを修正するために行うことができますが、私はないよ 歩いて時間を過ごすつもり 今それを通して。 しかし、我々はセクションの後にそれを行うことができます。 読者：あなたはに戻った場合 コンソールは、なぜだった 012321表示されている番号？ JASONハーシュホーン：コンソール？ ああ、私はクリックされたため、 周り乱暴。 観客：ああ、[OK]をクリックします。 気にしないで。 JASONハーシュホーン：そして再び、私がクリックすることができます 何か非常に多数の時間に。 読者：私は疑問を持っている もう一度ループ、あなたのforループ。 あなたはPで知っているので、彼らは、8セット そのループの別のフォームを使用しています。 そこで、彼らは私が少なく、0に等しいVAR好きです ocean_array.length、私は+ +より。 それらと同等ですか？ JASONハーシュホーン：それはある ループのための標準。 あるいはええ、それはforループです。 実際には、我々はそれが同等だ見てきました。 観客：だから、同等だ あなたがここに何をやったかと？ 1は、より良いと考えられている 他よりも？ JASONハーシュホーン：いいえ。 だから、もう一度、我々は行っている いくつかのものの上。 今、私たちの快適ゾーンを移動しました といくつかの本当にクールを始めた 我々は必ずしも行っていないもの 上のクラスの前にしますが、 うまくいけば非常に強力であること コー​​ディングする際にあなたのために。 Avieは、のはここに戻ってみましょう。 私はイルカのインデックスを持っている。 今、私は何をする必要がありますか？ 読者：あなたはそれを訓練する必要があります。 だからではなく、あなたをにconsole.logを置く と同等の変数を設定することができますか？ JASONハーシュホーン：わかりました。 そう？ 読者：私はわからないんだけど あなたはそれを行うことができます。 JASONハーシュホーン：だからVAR xが等しい この、どのような本を返し、 それはそれを返します。 関係ありません。 これは、任意の変数を返すことができます。 ここにはタイプがありません。 観客：それとも、ただ可能性 関数呼び出しを行います。 JASONハーシュホーン：ええ、 なぜ私はそれをしないのですか？ 単なる関数呼び出しを行います。 観客：うん。 の括弧の別のセットを置く。 JASONハーシュホーン：パーフェクト。 それはまさにそうです。 だから、列車の関数を呼び出します。 もちろん、何も電車の中ではありません 機能なので、Akshar、どのような私を提案 電車の関数で行う必要があります。 私にいくつかの擬似コードを与える。 読者：私はあなたが削除すべきだと思う 元のテーブルからイルカ。 JASONハーシュホーン：そして、これはなっている ノアに以前、なぜ我々はコピー それを新しい配列に。 右、私たちは私たちを編集することないので、 イルカ·アレイのためどのような別の場合 プログラムのそれを使用して、または我々が欲しい場合 どこか別の場所にアクセスするには？ 私たちは、コピーを作成するか、そしてそれはです 我々は、編集しようとしている1。 観客：次に位置 それを新しい場所に。 JASONハーシュホーン：そして、何をすべきか 我々は、後に行う必要がありますか？ 観客：してから、プリントアウト イルカについての情報。 JASONハーシュホーン：それです。 まったく正しい。 我々はocean_arrayから削除し、私たち 我々は描画し、プールに入れて、 プール内の海。 私はイルカをどのように削除しますか ocean_arrayから？ 観客：インデックスに移動します。 [OK]を、ああ。 スプライス関数を使用します。 JASONハーシュホーン：オクラホマので、そうだね。 私は、そのスプライス機能を使用することができます 配列から何かを取り出し、 それを凝縮する。 それは何か新しい私たちの 前に見ていない。 しかし、私は実際にスペースを残しておきたい そこに私はプリントアウトしたいので、 海の中の空白。 観客：だから、あなたは画像を設定することができます そのインデックスの、ocean_array インデックスのドット絵。 JASONハーシュホーン：OK、 ocean_array、インデックス。 読者：ドット絵。 JASONハーシュホーン：ドット絵。 観客：そして、あなたはそれをnullに設定？ JASONハーシュホーンは：NULL等しい。 [OK]をクリックします。 だから何もしてありませんので、 どのように私はプールに入れますか？ 私はどのようにコンスタンティン、 プールに入れて？ 我々はと呼ばれるこの変数が、 ここまで、プールと呼ばれる。 観客：我々だけのequalsを行うのですか ocean_arrayインデックス？ 読者：あなたではない万一 順番を切り替える？ JASONハーシュホーン：1秒。 うん？ 観客：うん、した 実際に良い点。 JASONハーシュホーン：何がここに？ 観客：それはインデックスである？ JASONハーシュホーン：インデックス、正確に。 そして、あなたは、コンスタンティンを何と言った 私たちが行うべきものでしょうか？ 読者：私たちは、多分べき 順序を切り替えます。 JASONハーシュホーン：そして、なぜべき 我々は、多分、順番を切り替える？ 読者：その時点であるため それが既にNULLの視点。 JASONハーシュホーン：だから、すべてのNULLではないが、 しかし、我々は画像のURLを失ってしまった。 我々は永遠にそれを失ったことがありますか？ 観客：技術的にはありません？ JASONハーシュホーン：持っている 我々は永遠にそれを失った？ 観客：いいえ。 JASONハーシュホーン：まあ、どこにある？ 観客：元のイルカに - JASONハーシュホーン：それはイルカでだ、 しかしocean_array中 我々は永遠にそれを失ってしまった。 そうコンスタンティンは、あなたが提案することができます この行を記述するためのより良い方法？ 実際には、申し訳ありませんが、それはプールに保存されています。 私たちは、プールでそれを持っているので、 プールは右、オブジェクトである？ Ocean_arrayインデックス、ocean_array オブジェクトの配列です。 だから、プールがオブジェクトであり、我々は持っている そこでのURL、およびダウン ここでは、nullに設定だ。 だから実際に、我々はそうではありません 永遠にそれを失った。 それはちょうど、プールに保存されています。 しかし、それは、ocean_arrayでは確かではありません 等をあなたはカルロスが、それがである、と述べた イルカ配列。 だから、これは甘い見える。 した後、どのように我々は描きません 海とプール？ マリオ？ 読者：あなただけ呼び出すことができます draw_poolとdraw_ocean？ そうのような、draw_pool、次に - まあ、ええ、それは何もしていない。 JASONハーシュホーン：今すぐ。 何がdraw_poolどうするつもりだ？ 観客：プールを描く？ JASONハーシュホーン：うん、まあ、 それは何をするつもりだ？ 観客：申し訳ありません。 あなたが同じことを行うことができます 持っているようなもの、 - JASONハーシュホーン：待って、 我々はそこに取得するつもりだ。 何もない。 それが今は何もしません。 しかし、これは動作するかどうか見てみましょう。 誰が私たちにそのコードを与えた？ Aksharとコンスタンティン 私たちにそのコードを与えた？ さあ、何が起こるか見てみましょう。 ああ！ それはとてもエキサイティングだった。 それは逝ってしまった。 ああ、男の子。 それはちょっと見苦しい。 まあ、我々は戻って行くことができます その以降の修正。 それがどこにあるのだろうか？ 私たちは、そのプールの変数に保存された。 それはだかどうかは、どのように把握することができます そのプール変数に？ さて、もう一度は、JavaScriptの力、 特にツールは、その Chromeはあなたに与え、あなたが今できている そのプール変数を検査します。 それはグローバルですが、覚えている？ 私たちは、varキーワードを入れていない。 だから私は右ここで入力した入力した場合、 コンスタンティンは、私はあなたに何を思いますか 私はEnterキーを押したときに取得するつもり？ 読者：私は知らない。 JASONハーシュホーン：ゲス。 観客：何？ JASONハーシュホーン：何も間違って、。 それはしかし、良い推測だった。 私は、オブジェクトを得た。 あなたが私を与えた覚えている そのコード行。 プールには、その中に保存されて 変数オブジェクト。 実際、我々は、オブジェクトを参照してください。 あなたはそれに保存されている。 それは素晴らしいです。 我々はここから調べることができます。 これは、ほぼリアルタイムでのGDBのようなものだという 我々は我々のコードに目を通すことができますし、 ものを見つけ出す。 つまり、超クールな超強力です。 さあ、これを終了しましょう​​。 の5分のプールを描画してみましょう。 丸は、私の行を与える プールを描画するためのコード。 読者：あなたは別のを持っている可能性が 変数のHTMLが、/のための。 JASONハーシュホーン：それでは作ろう 今のところ非常に単純なこと。 ちょうどの名前を印刷してみましょう イルカは、私たちは訓練している。 観客：それから、あなたがドルを行うことができます サインインして開き括弧、 して、引用符を開きます。 場合、私は、ポンドのプールを推測する それがものだった。 私は覚えていない。 JASONハーシュホーン：それでは振り返ってみましょう。 私はそれがことだと思う。 観客：OK、うん。 [閉じる引用符、近くのカッコ 。HTML、開き括弧、 そして私は開き括弧のように、プールを推測 0またはそのような何か。 ドット名前を閉じます。 それが動作するかどうか私は知らない。 観客：さあ、どうなるか見てみましょう。 "のプロパティ名を読み取ることができません undefinedは。 "だから、もう一度、ここにあるもの 私たちは、チェックアウトするつもりだ。 我々はこれを探求しようとしている。 あなたは、プール、オープンbracket0、。名前をした。 繰り返しますが、私はこのすべての時間をして、私は今 何をするか、何が起こっている混乱 この警告の意味は。 のプールを見てみましょう。 プールブラケットを見てみましょう 0、未定義。 我々は実行しているところだからです 我々の問題に、右か？ プールブラケット0はないが、 明らかに、存在しています。 あなたは存在しませんどう思いますか？ 観客：プールですちょうど それだけでオブジェクト？ JASONハーシュホーン：まあ、どのような それはここと言っていますか？ 我々はヒットすると、プールに入力し、 それはそれが何であるかと言っていますか？ 観客：オブジェクト。 JASONハーシュホーン：それはとても、オブジェクトである？ 観客：ああ、うん。 だから代わりにpool.name - JASONハーシュホーン：Pool.nameが与える あなたが望んで正確に。 そして私はこのを通じてつもり実現 ゆっくりとこの点をbelaboringが、 これは私がこのようなものをまったく同じ方法です。 あなたは、これらのバグに遭遇するつもりだ あなたの最終的なプロジェクトの間に、私は願っています これはあなたができるように力を与えるされている すべてのこれらのツールを使用します。 これらは非常に重要であるとウィル 超大型の遠いあなたを得る。 だから、僕はしたくない 名前をプリントアウト。 のは、それを少ししてみましょう これより少しよりよい。 観客：我々は他に何をしたいのですか？ JASONハーシュホーン：罰金、[OK]をクリックします。 我々だけでこれを行うだろう。 ぐふ。 Guysは、あなたは命を持っていません。 [OK]を、ブーム、それを得た。 よさそうだ。 あなたがダウンして、ここで、Aksharが表示されます、 我々は、ヌル、見つかっていない。 それはまだしようとしているようなので、それが見えます いくつかの画像を見つけ、それはしませんでした まさに私たちがやってみたかった。 我々は今、その中に行くつもりが、していない のクリーンな方法はおそらくあります これを行う。 読者：あなたは次のように残すことができる 画像のための空白？ 、のような代わりのヌルに設定する あなたはそれが空白を好きに設定することができます 文字列か何か？ JASONハーシュホーン：このように。 観客：うん。 JASONハーシュホーン：[聞こえない]。 見つかりません。 ので、それを行うためのより良い方法があります。 私はこれをやって提案する。 単にNULLがある設定。 そして、もちろん、何が 起こるだろう？ それは完全に離れて行くだろう。 我々はスペースを維持し、やってみたかったそうであれば つまり、我々は、おそらく何かをしたい ここにも同様。 私はあなたが始めるつもりです。 Akshar、私にこのラインを与える コー​​ドの実に素早い。 観客：ocean_array場合、イルカ、 等しい等しく、等しい - ヌルに等しい？ うん。 JASONハーシュホーン：その後何？ 観客：[HTML]を行います。 あなたは本当に、一番下のコードをコピーしてください。 JASONハーシュホーン：何をコピー？ 読者：あなたがコピーすることができます - JASONハーシュホーン：この？ 観客：うん。 JASONハーシュホーン：それのすべて！ 私たちは、イメージを持っていません。 読者：私はあなたを意味する ちょうど残すことができます - ええ、あなたはそれを閉じることができます。 しかし、私はあなたが幅を設定していると思う。 JASONハーシュホーン：まあ、ただ 空の列を作成します。 [OK]をクリックします。 次いでその場合、我々は、おそらくよ 同様に、これをやってみたい。 おっと。 ああ。 動作しないが、我々はわからないんでした そのエラーを取得。 それでは、ここでダウンして何が起こったのか見てみましょう。 だから、何もありませんので、どのような あなたは私たちが追加する必要が言ったの？ 観客：我々は、設定する必要があります 行の幅。 JASONハーシュホーン：何に？ 読者：私はそれが150だと思う。 観客：ええ、それは150だった。 JASONハーシュホーン：我々はここで、これをあげるよ 一貫性の私のコードを維持する。 しかし、これは1ではありません。 良い[OK]。 投稿しました。 OK？ だから、それはまだ先になるだろう。 観客：ああ、幅を呼んでいるのか？ JASONハーシュホーン：それが見える 幅150と同様である。 見てみましょう。 今、私たちは最終的にやろうとしている、 私はクールな、強力なもの お見せする予定。 私たちは、このコードを仕上げるつもりが、していない オンライン私たちは、このすべてを終了する前に コー​​ドが正しくなります。 私はあなたの修正版をメールでお知らせいたします 私自身のスタイリングの一部とした後 セクション、それがオンラインで公開されます。 私はこれを模索しておくことをお勧め とリファレンスとしてこれを使用しますが、私は あなたにこのための最終的なツールを表示したい クラスで、それはここに上にある 右側。 そして、我々は今、この先週見たが、 うまくいけばそれは少し慣れだ あなたに快適な。 あなたが動的に再生することができます ページのCSSを使用した。 私たちは、実際に、すでに私たちを見てきました 動的にHTMLで遊ぶ。 我々は権利をやった覚えている 編集としてHTMLをクリックして？ 右ここに？ だから我々は、動的にプレイしました HTMLと。 コンソールでは、動的に再生することができます ページのJavaScriptを使用して。 例えば、それは有効だ JavaScriptのライン。 ブーム、私は私が欲しかったまさにました。 だから我々は、動的で遊ぶことができます HTMLは、動的で遊ぶ JavaScriptを。 今、私たちはダイナミックにするつもりだ CSSで遊ぶ。 それのようなので、これがすべてである 瞬間、あなたはとてもGDBのフィードバックを生きて、 持つ前に何かの権利を知ることができる あなたのコードを移動し、あなたが缶に どのようなものだと思うしない のように見に行く。 だから、これは超大型のクールです。 とのは、最終的には、動的に見てみましょう CSSで遊ぶ。 つまり、ここでは、右側に終わった 右側、element.style。 のは、これに行きましょう。 ここに私たちの要素です。 のはそれをいくつかの余分なCSSを挙げてみましょう。 または申し訳ありませんが、我々はそれにいくつかの余分を与えることができる CSSが、我々はおそらく、この場合には、 この属性を変更したい。 それでは、この行には、ここを下に行きましょう。 ああ、私はここでそれを行うことはできません。 申し訳ありません。 AS編集 - だから、あなたは、CSSを編集できるかである。 我々は、この時にCSSを編集するつもりはありません 第二に、私たちは、編集したいです それをHTMLと与える 余分な属性。 何を、これを変更することを提案しましたか？ 私は、Avie私たちに示唆を持っていたと思った。 読者：コル幅？ JASONハーシュホーン：のように見えた それはどちらか何もしませんでした。 のは、CSSを試してみましょう。 観客：[聞こえない]クラス？ JASONハーシュホーン：それが言う それは動作しません。 それは、その黄色のものを提供します。 観客：しかし、[聞こえない]。 読者：あなたは、幅を設定しない あなたはそれを行う150の画像の？ あなただけの幅を使用していないだろう、気に入りましたか？ JASONハーシュホーン：うん。 観客：しかし、我々が持っていない もうイメージ。 JASONハーシュホーン：いいえ。 我々はそこには何もありません。 だから我々は解決するつもりはない 特定の問題。 私たちは、Aksharのに戻るつもりだ 私が設定したいので、ソリューション、 当分の間、無料のイルカ、 あるいはそれは、最後の 私は仕上げたいもの。 だから我々は、ここで、このままになるだろう 認識しつつ、それはかなりありません 正しい、私たちはなるだろう それに戻ってきて。 申し訳ありません。 私たちは、動的にすることができた CSSを変更してください。 それでは、その見て、やってみましょう 本当にすぐにそれ。 だから私はここでダウンして、この要素を検査した場合、 そして、私はそれを青にしたいと言う あなたがこちらに来ることができ、色、なぜなら 私は、色が変化するのを知っている 何か、私たちはどのように見た それが青に変更。 だから、動的に私です CSSを変更する。 その後、利益のためにそれを変更しませんが、 私は私のCSSファイルに戻ることができますし、 オブジェクトの色を変更します。 [OK]をクリックします。 それは楽しかった。 私たちは、私の素晴らしいプログラムを終了しませんでした。 、私はちょうどそれが実際に素早くお見せしましょう そして、我々は出かけます。 ああ、どこにある？ 違う！ 少々お待ちください。 [OK]を、あなたは梱包しているように 素晴らしいプレビュー、またはフロント 次回の眺め、。 これは、ドルフィントレーナー2013です それは動作しません。 素晴らしい。 [笑い] JASONハーシュホーン：ああ！ ブーム！ これは何を意味するのでしょうか？ 読者：あなたはchmodのはなかった。 JASONハーシュホーン：私はそれをchmodのはなかった。 観客：行1。 JASONハーシュホーン：ああ、それを見てください。 [OK]をクリックします。 だから、私は私の6イルカを持っている。 何が起こるか？ 見てみましょう。 私は1を訓練した場合、今リリを訓練。 ああ、私は、無料のリリーあなたを設定したい。 そこには、戻って海に行く。 だから、この一週間でした。 ご不明な点がございましたら、 我々は外になるでしょう。 そして再び、私はあなたを受けています。 このコードの残りの部分。 、みんなありがとうございました。