人力検索はてな
モバイル版を表示しています。PC版はこちら
i-mobile

javascriptについて質問します。
以前、今日の日付を画像で表示する方法について教えて頂いたのですが、さらに曜日も画像で表示させたいのですが、方法が分かりません。表示は、2014年2月5日(水)というように表示したいです。詳しくないうえに時間がなくて困っています。教えてください。よろしくお願いします。


●質問者: nashie0306
●カテゴリ:ウェブ制作
○ 状態 :終了
└ 回答数 : 1/1件

▽最新の回答へ

1 ● a-kuma3
ベストアンサー

前の回答で書いたスクリプトの最後に、曜日を表示するコードを書き足してみました。
曜日の画像を、以下のように用意します。
(日)── images/wday_0.gif
(月)── images/wday_1.gif
(火)── images/wday_2.gif
(水)── images/wday_3.gif
(木)── images/wday_4.gif
(金)── images/wday_5.gif
(土)── images/wday_6.gif

<script language="javascript">
<!--
//------------------------------------------------------------
//javascript by @うさ http://www.usagi-js.com/
//------------------------------------------------------------

 //変数宣言
 var dtToday = new Date;
 var strYear;
 var strMonth;
 var strDate;
 //0から9までの画像を用意してください。
 //画像のURLを宣言します。
 var strPicture = new Array("../images/number/orange0_on.gif",
 "../images/number/orange1_on.gif",
 "../images/number/orange2_on.gif",
 "../images/number/orange3_on.gif",
 "../images/number/orange4_on.gif",
 "../images/number/orange5_on.gif",
 "../images/number/orange6_on.gif",
 "../images/number/orange7_on.gif",
 "../images/number/orange8_on.gif",
 "../images/number/orange9_on.gif");

 //年月日を取得
 strYear = dtToday.getFullYear();
 strMonth = dtToday.getMonth() + 1;
 strDate = dtToday.getDate();

// //桁数を整理します
// if (strMonth < 10)
// {
// strMonth = "0" + strMonth;
// }
// if (strDate < 10)
// {
// strDate = "0" + strDate;
// }

 //数字に画像を当てるための準備です。
 var imgYear, imgMonth, imgDate;
 imgYear = strYear.toString();
 imgMonth = strMonth.toString();
 imgDate = strDate.toString();

 //ここから表示
// document.write("<img src='"+strPicture[imgYear.substring(0,1)]+"'>"+"<img src='"+strPicture[imgYear.substring(1,2)]+"'>"+"<img src='"+strPicture[imgYear.substring(2,3)]+"'>"+"<img src='"+strPicture[imgYear.substring(3,4)]+"'>"+"年<br>");
// document.write("<img src='"+strPicture[imgMonth.substring(0,1)]+"'>"+"<img src='"+strPicture[imgMonth.substring(1,2)]+"'>"+"月");
// document.write("<img src='"+strPicture[imgDate.substring(0,1)]+"'>"+"<img src='"+strPicture[imgDate.substring(1,2)]+"'>"+"日");
 // 「年」の表示
 document.write(
 "<img src='"+strPicture[imgYear.substring(0,1)]+"'>"+
 "<img src='"+strPicture[imgYear.substring(1,2)]+"'>"+
 "<img src='"+strPicture[imgYear.substring(2,3)]+"'>"+
 "<img src='"+strPicture[imgYear.substring(3,4)]+"'>"+
 "<img src='../images/year.gif'><br>");
 // 「月」の表示
 if (strMonth < 10) {
 document.write(
 "<img src='"+strPicture[imgMonth]+"'>");
 } else {
 document.write(
 "<img src='"+strPicture[imgMonth.substring(0,1)]+"'>"+
 "<img src='"+strPicture[imgMonth.substring(1,2)]+"'>");
 }
 document.write(
 "<img src='../images/month.gif'>");
 // 「日」の表示
 if (strDate < 10) {
 document.write(
 "<img src='"+strPicture[imgDate]+"'>");
 } else {
 document.write(
 "<img src='"+strPicture[imgDate.substring(0,1)]+"'>"+
 "<img src='"+strPicture[imgDate.substring(1,2)]+"'>");
 }
 document.write(
 "<img src='../images/date.gif'>");

// ★ここから
 // 曜日の画像を用意します
 strPicture = new Array(
 "../images/wday_0.gif", // 日曜日の画像
 "../images/wday_1.gif", // 月曜日の画像
 "../images/wday_2.gif", // 火曜日の画像
 "../images/wday_3.gif", // 水曜日の画像
 "../images/wday_4.gif", // 木曜日の画像
 "../images/wday_5.gif", // 金曜日の画像
 "../images/wday_6.gif"); // 土曜日の画像

 var wday = dtToday.getDay();
 document.write("<img src='"+strPicture[wday]+"'>");
// ★ここまで
//-->
</script>

最後の「★ここから」?「★ここまで」を追加しています。


nashie0306さんのコメント
ありがとうございます。 曜日を表示することは出来たのですが、曜日の前後に()が出ないのですが、どうしたらいいですか?

a-kuma3さんのコメント
括弧を含めて画像にしたら、と思ったのですが、カッコを画像に入れないのであれば、この部分を >|javascript| var wday = dtToday.getDay(); document.write("<img src='"+strPicture[wday]+"'>"); ||< このような感じにすると、カッコがつきます。 >|javascript| var wday = dtToday.getDay(); document.write("(<img src='"+strPicture[wday]+"'>)"); ||< 非常に分かりづらいですが、全角のカッコを足してます。

nashie0306さんのコメント
ありがとうございました。画像に()を付けることまでは思いつかなくて質問しました。どちらの方法でも出来るんですね。ありがとうございました。
関連質問

●質問をもっと探す●



0.人力検索はてなトップ
8.このページを友達に紹介
9.このページの先頭へ
対応機種一覧
お問い合わせ
ヘルプ/お知らせ
ログイン
無料ユーザー登録
はてなトップ