年齢表示の簡潔化方法を教えてください

このQ&Aのポイント
  • 現在サイトで名簿を作成しているのですが、HTMLのtableを使用してリストにしてます。年齢の項目のところで現在の年齢を表示させる為に下記のjavascriptのソースを使用しているのですが、30人分のリストなら30回使用しています。
  • 30回も使用するとファイルのソース自体が長くなってしまってるので少しソースを簡潔化させたいのですが、良い方法はあるでしょうか?外部ファイルを使用する方法でも構いません。
  • ご存知の方いらっしゃいましたら、ご教授ください。
回答を見る
  • ベストアンサー

年齢表示

現在サイトで名簿を作成しているのですが、HTMLのtableを使用してリストにしてます。 年齢の項目のところで現在の年齢を表示させる為に下記のjavascriptのソースを使用しているのですが、30人分のリストなら30回使用しています。 <SCRIPT language="JavaScript"> <!-- var birthyear=1990; var birthmonth=11; var birthday=10; var age=0; now = new Date(); y=now.getYear(); m=now.getMonth()+1; d=now.getDate(); if(y<1900) {y=y+1900;} if(m < birthmonth){age=y-birthyear-1} if(m > birthmonth){age=y-birthyear} if(m == birthmonth){ if(d < birthday){age=y-birthyear-1} else{age=y-birthyear} } document.write(age+"歳"); //--> </SCRIPT> 30回も使用するとファイルのソース自体が長くなってしまってるので少しソースを簡潔化させたいのですが、良い方法はあるでしょうか?外部ファイルを使用する方法でも構いません。 ご存知の方いらっしゃいましたら、ご教授ください。 よろしくお願いします。

質問者が選んだベストアンサー

  • ベストアンサー
  • hitomura
  • ベストアンサー率48% (325/664)
回答No.1

こんな感じでいかがでしょうか。もっといい手があるのかもしれませんが……。 <HTML> <HEAD> <SCRIPT language="JavaScript"> <!-- function writeAge(birthyear, birthmonth, birthday) { var age=0; now = new Date(); y=now.getYear(); m=now.getMonth()+1; d=now.getDate(); if(y<1900) {y=y+1900;} if(m < birthmonth){age=y-birthyear-1} if(m > birthmonth){age=y-birthyear} if(m == birthmonth){ if(d < birthday){age=y-birthyear-1} else{age=y-birthyear} } document.write(age+"歳"); } //--> </SCRIPT> </HEAD> <BODY> <TABLE border="1"> <TR> <TD> <!-- 年齢を表示する部分に以下のスクリプトを書く。カッコ内は順に生年、生月、生日 --> <SCRIPT language="JavaScript"> <!-- writeAge(1990, 11, 10); //--> </SCRIPT> </TD> </TR> <TABLE> </BODY> </HTML>

KEN1159
質問者

お礼

hitomuraさん ご回答ありがとうございました。 仰るとおりにソースを記述したら年齢表示でき、ソースもすっきりしました。 langage属性についても勉強になりました。 本当にありがとうございました。

その他の回答 (1)

  • hitomura
  • ベストアンサー率48% (325/664)
回答No.2

……と、いかんいかん。 つられて書いちゃいましたが、 <SCRIPT language="JavaScript"> のlanguage属性は現在非推奨となっております。よっぽど古いブラウザを使っている方が会員にいらっしゃるのでない限り、 <SCRIPT type="text/JavaScript"> とすべきでしょう。

関連するQ&A

  • 現在時刻をボタンクリックで表示

    下記の現在時刻を表示させるスクリプトを書いたのですが、 これをボタン <INPUT type="button" value="時刻" onClick=""> を押したら表示という形にさせたいと思っています。 どうすればよいのでしょうか?お力をお貸しください、お願いします。 _______________________ <script language=javascript> <!-- function writedate(date){ var obj=new Date(date) var y=obj.getYear() if(y<2000){y+=(y<70?2000:1900)} var m=obj.getMonth()+1 var d=obj.getDate() document.write(y+" 年 "+m+" 月 "+d+" 日 ") } writedate(new Date()) //--> </script> _______________________

  • JS 日付表示

    JavaScript for文の日付表示について JavaScriptでfor文で日付表示したい場合、月末の最終日を取得するだけでは月の切り替えができないのでしょうか? 今日から一週間後までを表示するアプリを作りたいのですが1/31を過ぎると2/1にならず1/32と表示されてしまいます。 何か間違っている所ありますでしょうか? 以下ソースコード <script type="text/javascript"><!-- var now = new Date(); var y = now.getFullYear(); var m = now.getMonth() + 1; var d = now.getDate(); console.log(now); // Thu Jan 30 2014 00:00:00 GMT+0900 (東京 (標準時)) console.log(new Date(now.getFullYear(), now.getMonth() + 1, 0)); // Fri Jan 31 2014 00:00:00 GMT+0900 (東京 (標準時)) for(i=0;i<100;i++){ document.write(y + "/" + m + "/" + (d + i).toString() + "<br>"); } // --></script> <body> </body>

  • javascript 日付自動更新

    以前にもご質問させてもらったのですが、解決にいたらなかったので今一度ご質問させてもらいます。何卒、宜しくお願い致します。 javascriptでサイトをアップした日付を、"最終更新日:2009年12月12日"と自動で更新したいです。 今までは、こちらのjavascriptを使っていたのですが、これですとブラウザ、GoogleChromeに対応していません。 文字化けしてしまいます。 <SCRIPT language="JavaScript"> <!-- renew = new Date(document.lastModified); y=renew.getYear(); m=renew.getMonth() + 1; d=renew.getDate(); if(y<1900) {y=y+1900;} document.write("最終更新日:"+y+"年"+m+"月"+d+"日"); //--> </SCRIPT> こちらのコードですとGoogleChromeで動くのですが、 <script type="text/javascript" charset="utf-8"> <!-- var d = new Date(); if (d.toLocaleDateString) { document.write("最終更新日:" + d.toLocaleDateString(document.lastModified)); } else{ y=d.getYear(); m=d.getMonth() + 1; d=d.getDate(); if(y<1900) {y=y+1900;} document.write("最終更新日:"+y+"年"+m+"月"+d+"日"); } // --> </script> このように表示されてしまいます。 最終更新日:Saturday,December,12,2009 "最終更新日:2009年12月12日"この形で表示させたいです。 どなたかお力を貸して下さい。お願い致します。

  • javascript 自動日付更新

    宜しくお願いします。 サイトをアップした日付を、自動で更新したいです。 今までは、こちらのjavascriptを使っていたのですが、これですとブラウザ、クロムに対応していません。 文字化けしてしまいます。 <SCRIPT language="JavaScript"> <!-- renew = new Date(document.lastModified); y=renew.getYear(); m=renew.getMonth() + 1; d=renew.getDate(); if(y<1900) {y=y+1900;} document.write("最終更新日:"+y+"年"+m+"月"+d+"日"); //--> </SCRIPT> クロムでも動くjavascriptのコードはありませんか? 何卒、宜しくお願い致します。

  • 明日の日にちを表示するときは

    下記のように1日後の日付を常に表示するときは どこを変えればいいのでしょうか? <TD>※明日は<script language="JavaScript"> <!-- // 訪問日表示 now = new Date(); year = now.getYear(); if (year < 2000) year = year + 1900; month = now.getMonth()+1; day = now.getDate(); wk = new Array("日","月","火","水","木","金","土"); document.write("有効期限:"+year+"年"+month+"月"+day+"日"); // --> </script>

  • 「誕生日まであと○日です」

    <html> <head> <title>test</title> </head> <body> <SCRIPT LANGUAGE="javascript" TYPE="text/javascript"> <!-- var weeks = new Array('日','月','火','水','木','金','土'); var now = new Date(); var year = now.getYear(); // 年 var month = now.getMonth() + 1; // 月 var day = now.getDate(); // 日 var week = weeks[ now.getDay() ]; // 曜日 var hour = now.getHours(); // 時 var min = now.getMinutes(); // 分 var sec = now.getSeconds(); // 秒 if(year < 2000) { year += 1900; } // 数値が1桁の場合、頭に0を付けて2桁で表示する指定 if(month < 10) { month = "0" + month; } if(day < 10) { day = "0" + day; } if(hour < 10) { hour = "0" + hour; } if(min < 10) { min = "0" + min; } if(sec < 10) { sec = "0" + sec; } document.write('今日:' + year + '年' + month + '月' + day + '日'); // --> </SCRIPT> </body> </html> これで今日の日付けは表示できたのですが 誕生日が7/31なのですが document.writeで 「誕生日まであと○日です」 と表示するにはどうすれば良いでしょうか?

    • ベストアンサー
    • HTML
  • JavaScriptからphp関数の呼び出し

    javaScriptで1秒毎にphpの関数を呼び出しているのですが、 php側で、returnしている日時が動的に表示されません。 何がいけないのか教えて頂けますでしょうか? 色んな参考ページを見ると、phpの関数で動的に 動かせると書いてあるのですが、動的になりません。 -------------------------------------------------------- <jsphptest.htmlソース> <html> <head> <script type="text/javascript"src="jsphptest.php"></script> <script language="javascript"> <!-- function time() { //JavaScriptで日時表示 var now = new Date(); mon = now.getMonth()+1; day = now.getDate(); hou = now.getHours(); min = now.getMinutes(); sec = now.getSeconds(); year = now.getYear(); if (year < 2000) { year += 1900; } if (mon <= "9"){mon = "0" + mon;}; if (day <= "9"){day = "0" + day;}; if (hou <= "9"){hou = "0" + hou;}; if (min <= "9"){min = "0" + min;}; if (sec <= "9"){sec = "0" + sec;}; document.form1.j_tokei.value= year +"/"+ mon +"/"+ day +" "+ hou +":"+ min +":"+ sec; //PHP関数の呼び出し document.form1.p_tokei.value= php_time(); //1秒毎 setTimeout('time()',1000); } // --> </script> </head> <body onLoad="time();"> <form name="form1" mathod=post> JavaScript日時<input type="text" name="j_tokei" size=25><br> PHP日時<input type="text" name="p_tokei" size=25> </form> </body> </html> -------------------------------------------------------- <jsphptest.phpソース> <?php $str .= "function php_time(){"; $str .= "return('".date('Y-m-d H:i:s')."');"; $str .= "}"; echo $str; ?>

  • Google AJAX Feed APIで、ホームページにアメブロRS

    Google AJAX Feed APIで、ホームページにアメブロRSSを表示する際、「PR」広告を排除したいです。 現在のソースは以下の通りです。 ------------------------ <script type="text/javascript" src="http://www.google.com/jsapi?key=・・・・・・"></script> <script type="text/javascript"> google.load("feeds", "1"); function initialize() { var feed = new google.feeds.Feed("http://feedblog.ameba.jp/rss・・・・・"); feed.setNumEntries(5); feed.load(function(result) { if (!result.error) { var container = document.getElementById("feed"); for (var i = 0; i < result.feed.entries.length; i++) { var entry = result.feed.entries[i]; var dd = new Date(entry.publishedDate); // now var yearNum = dd.getYear(); if (yearNum < 2000) yearNum += 1900; var m = dd.getMonth() + 1; if (m < 10) {m = "0" + m;} var d = dd.getDate(); if (d < 10) {d = "0" + d;} var date = yearNum + "." + m + "." + d + " "; container.innerHTML += "<p>" + date +" <a href='" + entry.link + "' target='_blank'>" + entry.title + "</a></p>"; } } }); } google.setOnLoadCallback(initialize); </script> (ボディー内) <p><div id="feed"></div></p> ------------------------ どこをどのようにすればいいのでしょうか? どうぞ宜しくお願いいたします。

  • JavaScriptでdocument.fileCreatedDate

    JavaScriptでdocument.fileCreatedDateを使おうとして <script type="text/javascript"> <!-- var date = new Date(document.fileCreatedDate); var year = date.getYear(); var month = date.getMonth() + 1; var day = date.getDate(); var hour = date.getHours(); var min = date.getMinutes(); if(year < 2000){year += 1900;} if(month < 10){month = "0" +month;} if(day < 10){day = "0" + day;} if(hour < 10){hour = "0" + hour;} if(min < 10){min = "0" + min;} document.write("作成日:" + year + "年" + month + "月" + day + "日" + hour + "時" + min + "分" + "<BR>"); //--> </script> のようなスクリプトを作ったんですが表示がおかしくなります。 Google chromeでも正常に表示できるようにしたいです。 よろしくおねがいします。

  • Scriptを読み込み中の表示について

    HTML <script language="JavaScript" type="text/javascript" src="AAA.js"></script> 外部JS <!-- google.load("feeds", "1"); function initialize() { var feed = new google.feeds.Feed("RSSURL"); feed.setNumEntries(5); feed.load(function(result) { if (!result.error) { var container = document.getElementById("mini_feed"); for (var i = 0; i < result.feed.entries.length; i++) { var entry = result.feed.entries[i]; var div = document.createElement("div"); var entry = result.feed.entries[i]; var dd = new Date(entry.publishedDate); // now var yearNum = dd.getYear(); if (yearNum < 2000) yearNum += 1900; var date = yearNum + "年"+(dd.getMonth()+1)+"月"+dd.getDate()+"日"; container.innerHTML += "<div>【"+"<b>" + date+"</b>" +"】<br /><a href='" + entry.link + "'>" + entry.title + "</a></div>"; } } }); } google.setOnLoadCallback(initialize); //--> を設置し、RSSをスクリプトで表示しています。 2秒くらい読込みが遅いので、その部分が、一時空白状態のままになります。 そこで、読み込み中に読込みしていますというぐるぐる回る画像を表示したいのですが、どのように記述すれば宜しいのでしょうか?

専門家に質問してみよう