memo-memo

javascriptで、ブラウザにクッキーを保存、取得する方法。
まず、クッキーを保存する方法。

var cName = "test";
var cData = "hoge";
var cDay = "30";
	if(!navigator.cookieEnabled){    // クッキーが利用可能かどうか
		return;
	}
	var sday = new Date();
	sday.setTime(sday.getTime() + (cDay * 1000 * 60 * 60 * 24));
	s2day = sday.toGMTString();
	document.cookie = cName + "=" + escape(cData) + ";expires=" + s2day;

こんな感じ。
この場合、「test=hoge」が、30日間保存される。
これを、ある程度汎用的な関数にすると、

function cookieWrite(cName , cData , cDay){
	if(!navigator.cookieEnabled){    // クッキーが利用可能かどうか
		return;
	}
	var sday = new Date();
	sday.setTime(sday.getTime() + (cDay * 1000 * 60 * 60 * 24));
	s2day = sday.toGMTString();
	document.cookie = cName + "=" + escape(cData) + ";expires=" + s2day;
}

こんな感じになる。
呼び出し方は、

cookieWrite("sample","abc",10)

こんな感じ。この場合、「sample=abc」が、10日間保存される。
次は呼び出し方。

var cookie_memory = "";
var read_cookie = document.cookie;
 var read_cookie_split = read_cookie.split("; ");
 for(var i=0; i<read_cookie_split.length; i++){
 var read_cookie_split2 = read_cookie_split[i].split("=");    
 if (read_cookie_split2[0] == "test"){
 var cookie_memory = read_cookie_split2[1];
 }
 }

まずは、オレンジ文字の「var cookie_memory」で、最終的に必要なクッキーのデータを格納する変数を定義しておく。

次に、青文字の「var read_cookie = document.cookie;」で、ブラウザに保存されているクッキーを全部取得する。

次に、赤文字の「var read_cookie_split = read_cookie.split(“; “);」で、配列にする。クッキーは、「test=hoge; sample=abc」こんな感じで、複数の場合は「; 」で切っている。read_cookie_split[0]は、「test=hoge」。read_cookie_split[1]は、「sample=abc」が格納されている。

次に、緑文字のfor文。一つ前の段階で、「; 」で切ったデータを、さらに「=」で切る。そのデータが、var read_cookie_split2に配列として入る。この時点で、例えばクッキーが「test=hoge」の時は、read_cookie_split2[0]は、「test」、read_cookie_split2[1は、「hoge」が格納されている。

後は、if文で、必要なデータの時は、変数cookie_memoryに格納してしまえば良し。それ以外の、必要じゃないデータの時はスルーさせれば良し。

もう少しブラッシュアップ出来るかもしれないけど、とりあえずこんな感じでいけました。

後、ブラウザで記録されているクッキーを表示させるには、URL欄に

javascript:document.cookie;

と打てばよし。

今回のコードを作るのに、以下のページを参照させて頂きました。詳しい説明も載っています。

今まで、使った事が無かったので、使ってみました。
heightLine.js
使い方は、
まず、heightLine.jsを、読み込んで、揃えたいブロック要素に、class=”heightLine”と書くだけ。
例えば、下記の様な感じ。

<div id="container">
<div id="left" class="heightLine"></div>
<div id="right" class="heightLine"></div>
</div>

こんな感じに使う。

2カラムとか、3カラムのサイトをコーディングする時に便利。

総ミリ秒が格納されている変数nTimeを、1000で割った余りがミリ秒になり、nTimeを1000で割った整数分を、もう一度nTimeに格納し直す。
次に、nTimeを60で割った余りが秒になり、nTimeを60で割った整数分を、もう一度nTimeに格納し直す。
次に、nTimeを60で割った余りが分になり、nTimeを60で割った整数分が、時になる。
言葉で記述するのは、ちょっと難しいので、下記コード参照

var nTime = 45296789;//総ミリ秒
var milliseconds = nTime % 1000;
nTime = Math.floor(nTime / 1000);
var seconds = nTime % 60;
nTime = Math.floor(nTime / 60);
var minutes = nTime % 60;
var hours = Math.floor(nTime / 60);

こんな感じ。後は、milliseconds、seconds、minutes、hoursに格納した値を整形すれば良し。
この考え方は、汎用的に色々なスクリプトで応用出来そうな気がする。

今まで、全然知らなかったけど、どうやら連想配列は、Array型では無いらしい。

http://js.tank.jp/javascript/post.html

http://d.hatena.ne.jp/amachang/20070202/1170386546

例えば、

var arr = ["Takahashi","28"];
var obj = {name:'Yamada', old:24};
alert(arr.length);
alert(obj.length);

上記の様なjavascriptを書いたとき、青字のalert(arr.length);は、普通に、配列の中の個数をalertする。（今回は、2が出力される。）

一方、赤字のalert(obj.length);は、undefinedが出力される。

どうやら、連想配列は、Object型らしい。

よく、配列の中にあるものを、for文の繰り返しで、中にあるものを全部処理するっていう感じの文を書くけれど、

例
for (var i; i<hairetu.lenth; i++ ){
～ここに処理～
}

連想配列の場合は、for in文を使う事で、中にあるもの全部に対して、処理が出来る。例えば、

var obj = new Object();
obj.name = 'Yamada';
obj.old = 24;
for(var soe in obj){
document.write(soe+":"+obj[soe]+"<br />");
}

こんな感じで、実行する。

for in文に関して、詳しくは、下記のサイトに乗ってます。

http://www.ajaxtower.jp/js/for/index8.html

どうやら、若干連想配列の指定の仕方に違いはあるかもだけど、ActionScriptでも、同じようなことがいえそうです。

その辺は、後でまた調べてみよう。

ActionScriptを勉強していたら、便利そうなテクニックが書かれていたので、メモ。

例えば、2009年10月4日を、スラッシュで区切って、「2009/10/4」と表現する時に、出来れば、日にちを表す「4」を、「04」こんな感じに表現したい時の処理。

例えば、if文とかを使って、条件分岐で、1〜9の時は、頭に「０」を追加して、10以上の時は、そのまま表示。こんな感じでもいいけど、条件分岐をせずに処理する方法が下記の様な書き方。

ActionScript

var my_date:Date = new Date();
var nYear:Number = my_date.fullYear;
var nMonth:Number = my_date.month + 1;
var nDate:Number = my_date.date;
var year_str:String = String(nYear).substring(2);
var month_str:String = String(nMonth + 100).substring(1);
var date_str:String = String(nDate + 100).substring(1);
var today_str:String = year_str + "/" + month_str + "/" + date_str;
trace(today_str);

重要なのは、赤字の3行の処理。

まずは、var year_str:String = String(nYear).substring(2);は、単純に、取得された年（2009とか）の後ろの２文字を、substring();で抜き取っている。(09とか)

で、var month_str:String = String(nMonth + 100).substring(1);と、var date_str:String = String(nDate + 100).substring(1);は、数値は、月と日で違うけど、処理としては同じ。

まず、取得された日にち（もしくは月）の数値に100を足す。String(nDate + 100)は、この時点で、今日が４日の場合、「104」になる。その100を足した数値の後ろの2文字を年同様、substring();で抜き取れば、「04」になる。

このやり方だと、日にちや月が一桁でも二桁でも使える。

例その１）

13日の場合

13+100=113

後ろの2文字は、「13」

例その２)

3日の場合

3+100=103

後ろの2文字は、「03」

ちなみに、substring();は、今回は第二引数を省略した形で書いてます。

多分、javascriptでも、同様の考え方で同じ結果が出せるでしょう。（多分ね。）