Javascript:XMLを使った日時指定可能なメッセージ表示

JavascriptとXMLを使って指定した日時の間だけメッセージを表示します。仕事で運営しているECサイトで指定された日時の間だけサーバーメンテナンスのお知らせを表示することになりました。しかも立て続けに2回!!いちいち差し替えるのは面倒なので指定した日時になったら自動的にメッセージの表示・非表示をするスクリプトを作りました。 XMLないの<news>~</news>を増やすことで複数のメッセージが表示できます。

※XMLの解析にKawa.netさんの JKL.ParseXMLを使用しています。こちらからライブラリをダウンロードしてください。
→ライブラリのダウンロード

Javascriptのソース
<script>
<!--
//ニュース情報が入ったXMLファイル
var url = "news.xml";
//XML解析オブジェクト
var xml = new JKL.ParseXML( url );
//表示メッセージ
var message="";
//XMLデータ読み込み
var data = xml.parse();
//今日の日付ゲット
date = new Date();
var y = String(date.getFullYear());
var mt = String(date.getMonth() + 1);
if(mt.length<=1) mt = "0"+mt;
var d = String(date.getDate());
if(d.length<=1) d = "0"+d;
var h = String(date.getHours());
if(h.length<=1) h = "0"+h;
var today = Number(y+mt+d+h);
if(data!=null){
//データ数分繰り返す
for(var i = 0;i < data["data"]["news"].length; i++){
//開始時日ゲット
var s_date = data["data"]["news"][i]["sdate"];
//終了日時ゲット
var e_date = data["data"]["news"][i]["edate"];
//開始・終了日時生成
s_date = s_date.replace("/", "");
s_date = s_date.replace("/", "");
s_date = s_date.replace("/", "");
e_date = e_date.replace("/", "");
e_date = e_date.replace("/", "");
e_date = e_date.replace("/", "");
s_date = Number(s_date);
e_date = Number(e_date);
//指定日時内ならメッセージ表示
if((today >= s_date) && (today <= e_date)){
//メッセージの最初だけ
if(message==""){
message = "<div id='news'>";
}
message += data["data"]["news"][i]["title"]+"<br>";
message += data["data"]["news"][i]["description"];
message += data["data"]["news"][i]["ps"]+"<br><br>";
}//if
}//for
//表示するメッセージがあれば表示
if(message!=null){
message+="</div>";
document.write(message);
}
}//if
//--></script> 

XMLファイル <data>
<news>
<!--2005年11月19日0時から-->
<sdate>2005/11/19/00</sdate>
<!--2005年11月22日9時まで表示-->
<edate>2005/11/22/08</edate> 
<!--メッセージのタイトル-->
<title> サーバメンテナンスのお知らせ</title>
<!--メッセージ本文-->
<description> メッセージです。
</description>
<!--追記がある場合はこちらに-->
<ps>
</ps>
</news>
</data> 

**** Javascript参考書 ****
古い入門書しか持っていないので新しく購入したいなぁ。Javascriptといったら古旗さんの本は外せませんね。
→改訂第3版 JavaScriptポケットリファレンス Pocket reference

→速効!図解プログラミング JavaScript

→JavaScript逆引きクイックリファレンスfor Windows & Macintosh


それ以外のおすすめ
→JavaScriptビジュアル・リファレンス

This entry was posted in Javascript. Bookmark the permalink.

3 Responses to "Javascript:XMLを使った日時指定可能なメッセージ表示"

コメントを残す

メールアドレスが公開されることはありません。