Webデザインラボ当サイトはJavaScriptが有効に設定されていないと正しく表示されません。【iPhone・iPad】投稿の準備中にエラーが起きました。後でやり直してください。2018/04/13こんにちは(・∀・)三回に渡って行われたWebデザイナー向けjQuery超簡単入門講座も終わり、今回からは実践でjQuery入門が始まります。覚えることはたくさんあり、前三回の超入門で聞いたこともないようなメソッドや文法的なことも出てきますが、まずは「習うより慣れよ」ということで、「そうするとそうなるのかー」的な感じで覚えていってください。「なんで?」、「どうしてそうなる?」というような疑問は学習において大切なことですが、そこで立ち止まってしまうと中々前に進みませんので、ここではそれらは置いておいて、とりあえず先に進んでみましょう。英語学習における文法と会話みたいな関係と同じような感じですね。今回はjQueryで日時を表示させる方法です。JavaScriptで日時を表示をご覧ください。Date()を使えば簡単に現在日時を表示することができます。Date()で現在日時を表示させてみます。Date()で現在日時を表示させております。Date()を使って現在日時を表示することができました。今度はsetInterval();を使ってリアルタイムで現在日時を表示できるようにしてみます。1000);を使うと一定の時間ごとに特定の処理を繰り返します。この場合、現在日時を1000ミリ秒ごとに繰り返して表示しております。これだと使いようがありません。表示されている中から必要な物(月・日・時間等)を抜いて書き直す必要があります。Date()を使えば簡単に現在日時を表示することができます。今度はその日時の必要な部分だけ抜き出して表示させます。それには変数という仕組みを使います。変数については次回解説しますが、簡単に言うとあるデータを任意の名前で作った箱に入れて使いまわすという仕組みです。nowという名前の箱を作ってそれに入れてあちこちで使いまわすという方法です。ここではサンプルを見てなんとなく「そんな仕組みがあるのかー」ぐらいの理解をしていただければ大丈夫です。Date()がnowという変数の箱に入りました。それ以外の日時を抽出するための呪文もそれぞれ変数の箱に入れてあります。wという箱には曜日が入るのですが、ここには実際に曜日が入っているわけではなく0から6の数字(0:日曜日、1:月曜日~)が入っており、その数字を曜日に割り当てるための箱、wdという箱を作り、曜日が自動的に繰り返して表示される仕組み(配列)を作って曜日を表示させています。.text()の中で変数や文字列を文字列として繋ぐのに「+」の記号(演算子)を使って繋いでいきます。抜き出したデータをリアルタイムで表示する抜き出したデータをリアルタイムで表示させます。それには前に使ったsetInterval();でリアルタイムで現在日時を表示できるようにしてみます。1000);});Result抜き出したデータの秒数が変わっていることがわかります。1000);を使って現在日時を1000ミリ秒ごとに繰り返して表示しております。桁数を揃える表示された数字を見ていただければわかると思いますが、一桁だったり二桁だったりしています(年号を除いて)。それを01とか02というようにサンプル1・サンプル2のように二桁に統一したい場合は次のようにします。1000);});Result太字になっている部分が今回追加変更した箇所です。最初に定義した変数から数値を足したり引いたりして桁を揃えています。その桁が揃った変数でさらに新しい変数を作って.text()メソッドに挿入しています。箱に入れた物に変化を加えてさらに別の箱に入れてそれを使用するといった感じになります。ちなみに年月日秒曜日を記号に変更したり、曜日をなくしたり、年号をなくしたりは.text()メソッドに挿入した部分で調整してください。dd);});Result.text()メソッドのパラメータで表示したい情報を調整します。いかがでしたでしょうか、日時の表示に関しては以上になりますがそれ程難しくありませんね。この調子でjQueryをマスターしていきましょう、次は何をしましょう。Webデザインラボ中の人NYのデザイン学校でグラフィックデザインを学んだ後、同じくNYにあるWeb制作会社にてインターンからWebデザイナーへ。同時期に米国永住権(グリーンカード)を取得。その後某旅行会社系のWebクリエーター兼社内インフラ担として働いた後、結婚を機に約12年に渡るアメリカ生活を終え日本に帰国。日本では某携帯キャリアの社内Webクリエーターとして勤務。Web系に携わる前はホノルル空港でGreeterとして働いていた経験や、アメリカ国内の衣料品を中心としたアパレル系のバイヤー経験もあり。趣味はお酒を飲みながらの家でまったり音楽鑑賞とアウトドア系全般。最近は自転車にもハマってます。更新情報はTwitterかFacebookで配信してるのでフォローして確認してみて。