Java Scriptを理解する

算術演算子
演算		演算子
加算		+
減算		-
乗算		*
除算		/
剰余算	%

代入演算子
演算子	意味
=		代入
+=		足して代入
-=		引いて代入
*=		掛けて代入
/=		割って代入
%=		割った余りを代入

単項演算子
演算子	意味
++		1足す
--		1引く
-		符号の反転

関係演算子
演算子	意味
>		大きい時
>=		以上
<		小さい時
<=		以下
==		等しい時
!=		等しくない時

真と偽
真は true
偽は false

論理演算子
演算子		意味
&& (and)	比較対象が真ならば真、それ以外ならば偽
|| (or)		比較対象のどちらかが真ならば真、それ以外は偽
!  (not)	比較対象が真ならば偽、比較対象が偽ならば真

条件演算子
 二つの値を評価し、どちらかの値を取得する。
 書き方は、

   (条件式) ? 値1 : 値2
 
 条件式が真ならば値1が、条件式が偽ならば値2を取得する。

演算子の優先順位
	演算子
1	( ),[ ]
2	++,--,-
3	*,%,/
4	+,-
5	<, <=, >, >=
6	==, !=
7	&&
8	?:
9	=, +=, -=, *=, /=, %=
10	,

if文
	if(条件式)実行命令;

	if(条件式)
		{実行命令;}


	if(条件式)実行命令1;
	else 実行命令2;

	if(条件式){
		実行命令1;
	} else {
		実行命令2;
	}

	if (a > 0) { b = 1; } else { b = 0; }
	と
	b = a > 0 ? 1 : 0;
	は、同じ結果になります。



switch文
	switch(変数)
		{case '条件1':実行命令1;
			break;
		case '条件2':実行命令2;
			break;
		case '条件3':実行命令3;
			break;
		default:実行命令4;
			break;
	}

for文
	for(ループ変数の初期状態; ループ継続条件; ループ変数の更新)
		{ 実行命令; }

while文
	while(ループ継続条件)
		{ 実行命令; }

do〜while文
	do {実行命令; }
	while(実行条件);


continue文 (ループの途中で次の繰り返し制御に移る命令)
例「0から10までの偶数の和を、変数a求めたい」場合

	a=0;
	for(i=0; i<11; i++){
		if(i%2==1)continue;
		a+=i;
	}
	alert(a);

	流れ
	1. 変数aを0で初期化
	2. forループを開始。(最初に変数iを0で初期化)
	3. ループの条件判定(iが11未満ならばループを続行)
	4. ループ内でif文の条件分岐
		iを2で割った余りが0以外の場合は continue 命令が実行され、 ループの先頭に
		もしiを2で割った余りが0の場合は、a+=i;の処理が実行されて変数aに変数iの値を加算

	5. 処理が終りループの先頭に戻った時、i++が実行されてiの値がインクリメント
	6. そのままループを続けて、iの値が10を超えた時点でループを抜ける
	7. 最後にalert(a);で、最終的な結果を画面表示

break文 (ループの途中でループから抜け出す命令)
例「0から30までの各数値の和を変数aに求め、aの値が50を超えたら処理を中断する」場合

	a=0;
	for(i=0; i<51; i++){
		if(a>50)break;
		a+=i;
	}
	alert(a);



try catch文(例外処理)

	try{
	  処理内容
	}catch(e){
	  うまく処理出来なかった場合に行う処理内容
	}

 XMLHttpRequest を呼び出す時によく使われます。

  Ajaxを使おう
  Ajaxはじめの一歩 XMLHttpRequest
  http://allabout.co.jp/internet/javascript/closeup/CU20050515A/



エスケープ処理
「'」→「\'"」→「\"\」→「\\」


Java Script をコーディングする上で必要なサニタイジング処理
http://www.atmarkit.co.jp/fsecurity/rensai/webhole12/webhole01.html

& → &amp;
< → &lt; 
> → &gt; 
" → &quot; 
' → &#39; ※ &apos;は使わない

<a href=""> や <img src=""> にスプリクトで流し込む場合は

 javascript:alert("hello"); 
 vbscript:MsgBox("hello"); 
 about:<script>alert("hello");</script>
  javas&#09;cript: 
  jav&#X41sc&#0010;ript:d=document;d.body.appendChild(d.createElement('<script src=test.js defer>'))

こういう事にも注意する。

  マルチバイトの落とし穴
 http://www.atmarkit.co.jp/fsecurity/rensai/hoshino10/hoshino01.html
 JavaScriptインジェクション攻撃
 http://itpro.nikkeibp.co.jp/article/COLUMN/20081006/316276/
 も参考に。




組み込み関数
escape()   文字列のエンコードを行います 
unescape()   文字列のデコードを行います 
eval()    引数をスクリプトとして実行します 
isNaN()   数値の場合は false、数値でない場合は true を返します 
parseFloat() 文字列を浮動小数点数に変換 
parseInt()   文字列を整数値に変換 
taint()     フォームの特定の要素を送信可能に設定 
untaint()   フォームの特定の要素を送信不可能に設定 



予約語
abstract
boolean
break
byte
case
catch
char
class
const
continue
default
do
double
else
extends
false
final
finally
float
for
function
goto
if
implements
import
in
instanceof
 int
interface
long
native
new
null
package
private
protected
public
return
short
super
 switch
synchronized
this
throw
throws
transient
true
try
var
void
static
while
with
 


文字を書く

document.write("文字を書く");

a="文字を書く";
document.write(a);


ダイアログボックスを表示

<html>
<script language="JavaScript">
<!--
alert("ダイアログを表示しています。");
//-->
</script>
</html> 



確認用ダイアログを利用する

<html>
<script language="JavaScript">
<!--
kotae=confirm("JavaScriptは理解出来そう?");
if(kotae==true)
document.write("良かったね!");
else document.write("それは残念・・・");
//-->
</script>
</html> 



文字入力用ダイアログを利用する

<html>
<script language="JavaScript">
<!--
kotae=prompt("貴方のお名前を入力して下さい。","");
if(kotae!="")document.write(kotae+"さん、こんにちは。");
else document.write("こんにちは。");
//-->
</script>
</html> 



テキストボックスの値を取得する

書式は、
  変数名=document.フォーム名.テキストオブジェクト名.value;
となる。

<html>
<head>
<script language="JavaScript">
<!--
function ck(){
	a=document.form1.text1.value;
	alert(a);
}
//-->
</script>
</head>
<body>
<form name="form1">
<input type="text" name="text1"size="10">
<input type="button" value="CLICK!" onClick="ck()">
</form>
</body>
</html>



チェックボックスの状態を取得する

値は true もしくは falese で、チェックがついている場合は true 、チェックがついていない場合は false になる
書式は、
  変数名=document.フォーム名.チェックボックスオブジェクト名.checked;
となる。

<html>
<head>
<script language="JavaScript">
<!--
function ck(){
	a=document.form1.check1.checked;
	alert(a);
}
//-->
</script>
</head>
<body>
<form name="form1">
<input type="checkbox" name="check1">
<input type="button" value="CLICK!" onClick="ck()">
</form>
</body>
</html>



ラジオボタンの状態を取得する

値は true もしくは falese で、チェックがついている場合は true 、チェックがついていない場合は false になる
書式は、
  変数名=document.フォーム名.ラジオボタンオブジェクト名.checked;
となる。 

<html>
<head>
<script language="JavaScript">
<!--
function ck(){
	a=document.form1.radio1.checked;
	alert(a);
}
//-->
</script>
</head>
<body>
<form name="form1">
<input type="radio" name="radio1"><br>
<input type="button" value="CLICK!" onClick="ck()"><br>
<input type="reset" value="RESET">
</form>
</body>
</html>

実際には、チェック項目が多数ある事が多いので
  変数名=document.フォーム名.ラジオボタンオブジェクト名[].checked;
	値は0から数分で取得する事となる



テキストエリアの値を取得する
書式は、
  変数名=document.フォーム名.テキストエリアオブジェクト名.value;
となる。

<html>
<head>
<script language="JavaScript">
<!--
function ck(){
	a=document.form1.textarea1.value;
	alert(a);
}
//-->
</script>
</head>
<body>
<form name="form1">
<textarea name="textarea1"></textarea>
<input type="button" value="CLICK!" onClick="ck()">
</form>
</body>
</html>



ドロップダウンリストボックスで選択されている場所

セレクトオブジェクトで選択されている場所を取得(0〜)

書式は、
  変数名=document.フォーム名.セレクトオブジェクト名.selectedIndex;
となる。

<html>
<head>
<script language="JavaScript">
<!--
function ck(){
	a=document.form1.select1.selectedIndex;
	alert(a);
}
//-->
</script>
</head>
<body>
<form name="form1">
<select name="select1">
<option value=""></option>
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
<option value="4">4</option>
<option value="5">5</option>
</select>
<input type="button" value="CLICK!" onClick="ck();">
</form>
</body>
</html>

ちなみに
.length で、 option の数
.options[0].text で 表示文字
.options[0].value で 値
を拾えます。(代入も出来ます)

スプリクトを使って option を書き換える場合(追加)は
var ele = document.createElement("option");
var txt = document.createTextNode("aaa");
ele.value = "AAA";
ele.appendChild(txt);
document.form1.select1.appendChild(ele);



テキストボックスに値を表示
書式は、
  document.フォーム名.テキストオブジェクト名.value="代入する値";
となる。

<html>
<head>
<script language="JavaScript">
<!--
function ck(){
	a=document.form1.text1.value;
	document.form1.text2.value=a;
}
//-->
</script>
</head>
<body>
<form name="form1">
1.<input type="text" name="text1" size="20">
2.<input type="text" name="text2" size="20">
  <input type="button" value="CLICK!" onClick="ck();">
</form>
</body>
</html>



テキストエリアに値を表示
書式は、
  document.フォーム名.テキストエリアオブジェクト名.value="代入する値";
となる。

<html>
<head>
<script language="JavaScript">
<!--
function ck(){
	document.form1.text2.value = document.form1.text1.value;
	document.getElementById('text3').value = document.getElementById('text1').value; //最近はこうかな?
}

//-->
</script>
</head>
<body>
<form name="form1">
1.<textarea name="text1" size="10" id="text1"></textarea>
2.<textarea name="text2" size="10" id="text2"></textarea>
3.<textarea name="text3" size="10" id="text3"></textarea>
<input type="button" value="CLICK!" onClick="ck();">
</form>
</body>
</html>



入力BOXにフォーカスを移動

document.form1.text1.focus();



黒から白へフェードイン

<html>
<head>
<title></title>
<script language="JavaScript">
<!--
function changeColor(){
	for(i=0;i<=255;i=i+5){
		document.bgColor=i+i*256+i*256*256;
	}
}
// -->
</script>
</head>
<body onLoad="changeColor()">
</body>
</html>



Cookieの削除

<html>
<head>
<title></title>
<script language="JavaScript">
<!--
function Start(){
	if(document.cookie==""){
		alert("このサーバによるCookieはありません。")
	}else{
		tmp=document.cookie.split(";");
		acDate=new 
		Date();
		acDate.setYear(acDate.getYear()-1);
		for(i=0;i<tmp.length;i++){
			temp1=tmp[i].split("=")[0];
			//temp1=tmp[i].split("=")[0].split("=")[0].replace(' ',''); //先頭にスペースが入ってる?
			document.cookie=temp1+"=;acDate="+acDate.toGMTString();
		}
		alert("このサーバによるCookieを削除しました。");
	}
}
//-->
</script>
</head>
<body>
<center>
<form>
<input type="button" value="Cookieの削除" onClick="Start()";>
</form>
</center>
</BODY>
</HTML>



onmouseover イベントでテーブルの 1 行を見やすく色を変える

<table bgcolor="#ffffff" border="1" cellspacing="1">
  <tr onmouseover="this.bgColor='#DEEBF6'" onmouseout="this.bgColor='#FFFFFF'">
    <td>マウスを乗せると色が変わります。</td>
  </tr>
  <tr onmouseover="this.bgColor='#DEEBF6'" onmouseout="this.bgColor='#FFFFFF'">
    <td>マウスを乗せると色が変わります。</td>
  </tr>
</table>



クッキー情報を表示する。

IEのアドレスに javascript:document.cookie; と打ち込みます。
すると、現在使われている、クッキーが表示されます。

 この手の手法の事をブックマークレットと呼ぶみたいですね。

 hidden と password を可視化したり、Javascript で書き換えられた後のソースを表示したり
 デバッグ用に便利な物が揃っています。

  ブックマークレットが溜まってきたのでまとめました
  http://d.hatena.ne.jp/murasuke/20060726
  JavaScript::Bookmarklet
  http://bookmarklet.daa.jp/
  Bookmarklet - パソコン遊戯
  http://pasokon-yugi.cool.ne.jp/bookmarklet/
  Javascript で書き換えられた後の Webページの内容を表示する
  http://groundwalker.com/blog/2007/01/javascripted_source.html


 ちなみに、クッキーを使わずクライアント PC へ保存する方法として
 DHTML の userData を使う方法があります。( IE 限定)

  Internet Explorer での HTML フォーム Part 2
  http://www.microsoft.com/japan/msdn/columns/corner/corner122099.aspx

 ※javascript:document.cookie='abc=123;path=/';void(0);
  とすることでクッキー情報が書き換えられる事に注意。(有効期限が設定されている場合に限る)

javascript:document.body.contentEditable='true';document.designMode='on';void(0);
で IE では HTML を触ることが可能に。IEPRO と組み合わせれば使えるかもね。



確認ダイアログを出さないでメインの窓を閉じるには

window.opener = null;
self.window.close();
又は
window.opener = window;
self.window.close();
で、ダイアログが出ないで消えてくれます。
※使えなくなる可能性がありますので程々に。。。



ステータス行に時間を表示

function tm(){
	var day   = new Date();
	var year  = day.getFullYear(); //getYear() を使うとファイアフォックスでは 108 と表示される
	var month = day.getMonth()+1;
	var date  = day.getDate();
	var hour  = day.getHours();
	var min   = day.getMinutes();
	var sec   = day.getSeconds();
	var itime = parseInt((day.getUTCHours()*3600 + day.getUTCMinutes()*60 + day.getUTCSeconds()+3600)/86.4);
	// getUTCHours(), getUTCMinutes(), getUTCSeconds() を使って現在のグリニッジ標準時の 時間・分・秒 を取得
	// インターネットタイムの基準はグリニッジではなく Swatch 社のあるスイスですので、時差を考慮し
	// 1時間(3600秒)を加えた値を1日の時間を 1 ビート(86400÷1000=86.4秒)で割り
	// 小数点を切り捨てた値が、インターネットタイムとなります。

	// インターネットタイムは Swatch社が中心となって提唱。
	// 1日を1000で割り、その単位を BEAT(ビート)とした世界共通時間

	if (month < 10){ month = "0" + month }
	if (date  < 10){ date  = "0" + date  }
	if (hour  < 10){ hour  = "0" + hour  }
	if (min  < 10) { min   = "0" + min   }
	if (sec  < 10) { sec   = "0" + sec   }
	if (itime < 10) { itime = "0" + itime }
	if (itime < 100){ itime = "0" + itime }

	youbi = new Array(7)
	youbi[0] = "(日)";
	youbi[1] = "(月)";
	youbi[2] = "(火)";
	youbi[3] = "(水)";
	youbi[4] = "(木)";
	youbi[5] = "(金)";
	youbi[6] = "(土)";

	window.status = year+"."+month+"."+date+youbi[day.getDay()]+" "+hour+":"+min+":"+sec+" @"+itime;
	setTimeout("tm()")
}
<body onLoad="tm()">
</body>



インラインフレームを操作

<script type="text/javascript">
function st(){
 var w = window.subwindow;
 var d = w.document;
 d.body.appendChild(d.createTextNode("Hello,World!!"));
 d.body.style.backgroundColor = "#FFFFDD";
}
</script>
<body onload="st()">
<iframe id="submit_window" name="subwindow" src="about:blank"></iframe>

ちなみに、インラインフレームから親フレームを操作する場合は

parent.window.location.href = "http://www.kojikoji.net/";



909432 - iframe 内にて リストボックスにフォーカスすると onchange イベントが発行される



選択したボタンを押せなくする。

<input type="button" id="b1"
  onclick="b1.disabled=true;b2.disabled=false;b3.disabled=false;>
<input type="button" id="b2"
  onclick="b1.disabled=false;b2.disabled=true;b3.disabled=false;>
<input type="button" id="b3"
  onclick="b1.disabled=false;b2.disabled=false;b3.disabled=true;>



リンクやボタンを使って「xxx.asp」へPOST送信

<html>
<head>
<script language="JavaScript">
<!--
function wPost(a1,a2){
	document.form1.text1.value=a1;
	document.form1.text2.value=a2;
	document.form1.action = "http://www.kojikoji.net/index.asp";
	document.form1.submit();
}
//-->
</script>
</head>
<body>
<a href="javascript:wPost('text1','text2')">送信</a>
<input type="button" OnClick="wPost('text3','text4')" value="送信">
<form name="form1" method="post" action="err.html">
<input type="hidden" name="text1">
<input type="hidden" name="text2">
</form>
</body>
</html>

※ http://www.kojikoji.net/ にて GET と POST のパラメータを表示するようにしています。
  JavaScript で 送信した場合に結果がちゃんと飛んでいるかの確認に、よければ使って下さい。
  http://www.kojikoji.net/?TEST=テストだよ
  日本語は UTF8 でエンコードしてから送信しないと文字化けします(多分)


送信する前にメッセージを表示させる

<script language=javascript>
function warning(){
	if ( confirm ('送信します。宜しければ[OK]ボタンを押して下さい。')){
//			document.form.encoding = "multipart/form-data";	//ファイルを送信する場合
			document.form.action = "http://www.kojikoji.net/";
			document.form.submit();
		return;
	} else {
		return false;
	}
}
</script>
<body>
<form action="" method="post" name="form">
<input type="file" name="file1">
<input type="text" name="text1">
<input type="button" onclick="warning()">

※javascript:document.forms[0].onsubmit=null;void(0);
 と打ち込まれるとチェックを回避される事に注意。

リンクから
<a href="http://www.kojikoji.net/?Act=Delete" onclick="return confirm('削除します。宜しければ[OK]ボタンを押して下さい。')">削除</a>
動作確認 >削除





Enter キーが押されたら送信

<input type="text" name="text1"
	OnKeyPress="if (event.keyCode == 13) {warning();return false;}">



タグを生成して送信

<script language=javascript>
function send(){
	var element = document.createElement("input");
	element.type = "hidden";
	element.name = "data1";
	element.value = "生成したデータだよ";
	document.form.appendChild(element);

//	alert(document.form.data1.value);	// 確認
//	document.form.method = "POST";  // POST で送信したい場合
	document.form.action = "http://www.kojikoji.net/";
	document.form.submit();
}
</script>
<body>
<form action="" method="get" name="form">
<input type="button" onclick="send()">
</form>



リセットボタンの処理

IE の場合、フォーム上にリセットボタンが配置されていた場合は、[ESC] でリセット。
リセットボタンが無い場合は、[ESC] 2回押すとリセットされます。

<form action="about:blank" onreset="return false;">
で、無効化。

<form action="about:blank" onreset="
  if( !confirm('本当に入力内容を消去してもよろしいですか?') ) { return false; }
">
で、確認ダイアログ表示。



要素数取り出し実験(おぼえがき)

<script language=javascript>
alert("INPUTの要素数は " + document.getElementsByTagName('INPUT').length);
alert("2 番目が " + document.getElementsByTagName('INPUT')[2].name);
alert("2 番目が " + document.getElementsByTagName('INPUT')[2].type);
document.getElementsByTagName('INPUT')[2].value = "1";
alert("2 番目の INPUT に " + document.getElementsByTagName('INPUT')[2].value + " を代入");
</script>

innerHTML タグの間の内容を取得・書き換えをする。
outerHTML タグごと内容を取得・書き換えをする。

 Document.open
 Document.write msg.outerHTML
 Document.close
 こんな感じでごっそり入れ替え。

アドレスに下記を貼り付けて実行で動きがわかります。
JavaScript:document.all.tags("html").outerHTML='<form><input%20type="text"%20value="123"><input%20type="submit"><form>'



フォーカス時に背景変更

<input type="text" name="text1"
	onFocus="if(document.all) {this.style.backgroundColor='#e5ddff';}"
	onBlur="if (document.all) {this.style.backgroundColor='#fafafc'}">



マウスカーソルが重なった時にメッセージ表示

<input type="text" name="text1"
	onMouseOver="window.status='TEXTを入力します。';return true"
	onMouseOut="window.status='';return true">



●HTML-FROMの TEXTで右寄せ(JAVAScript じゃないけど )
<input type="text" name="text1" value="abc" style="text-align:right">

●FORM タグを記述した時の隙間を詰める
<form action="http://www.kojikoji.net/" style="margin-top:0 ;margin-bottom:0">

●INPUT を書込み禁止にする
<input type="text" style="border: 0 solid;" value="データ" tabindex="-1" readonly="readonly">

●右クリック禁止(IE限定)
<body onContextmenu="return false">
  onDragstart="return false"
  onSelectstaet="return false"
 ググってみたら、この2つも同時に指定しているサンプルが多いみたい。
 oncontextmenu Event を使って操作できます。
 oncontextmenu Event Sample

●ダウンロード時の保存禁止(IE限定)
<meta name="DownloadOptions" content="nosave">

●オートコンプリート禁止(IE限定)
<input type="text" autocomplete="no">

●イメージツールバーの非表示(IE6)
<meta http-equiv="imagetoolbar" content="no">
または、
<img scr="" alt="" galleryimg="no">

●音楽を再生(これもIE限定だったかな?)
<BGSOUND SRC="">

●キャッシュの無効
<meta http-equiv="Pragma" content="no-cache">

●アドレス(URLの隣)のアイコンを好きなものに変更(IE)
http://www.netdive.jp/memo.asp で書いた気もするけど、、、
アイコン作成ツールを利用して、アイコンを作成。(ベクター等でチェック)
favicon.ico という名前で保存し、HTML ファイルと同じ場所に置く。
別の場所にある場合は
head 部分に
<link rel="shortcut icon" href="./img/favicon.ico">
と記述。

●表示時に使用禁止
<input type="text" name="text1" disabled>

●JavaScript エラーを無視する
window.onerror = null;
※ エラーが発生する可能性がある箇所の前に記述

●ブラウザ名をチェック
document.write(navigator.appName);

●直前の参照ページのURL取得
document.write(document.referrer);

●ページを印刷する
<INPUT TYPE="button" VALUE="印刷する" onClick="print()">

●別ファイルから読み込み
<SCRIPT SRC="script.js"></SCRIPT>
※script.js には、 <script language=javascript>、</script>  は不要

●非対応ブラウザへの配慮
<NOSCRIPT>
このページはJavaScriptに対応しているブラウザでご覧ください
</NOSCRIPT>

●左寄せと右寄せを同時に使いたい
 http://allabout.co.jp/computer/hpcreate/closeup/CU20060209A/index.htm

●時間のかかる処理でアイコンを砂時計にする話とか
 時間がかかる操作中に表示を更新する

●フルスクリーンで開く
window.open(url,name,"fullscreen=yes");
※戻し方知らないとハマります。(Ctrl+W や Alt+F4 で閉じましょう)

 IEの全画面表示を無効にする
 http://arena.nikkeibp.co.jp/tec/winxp/20060914/118639/?from=mail

●JavaScriptで画像の本来の幅と高さを取得する
 http://d.hatena.ne.jp/inamenai/20081011/p1[CSS]スタイルシートをIEだけに適用する大胆で簡単な条件式の使い方
 http://coliss.com/articles/build-websites/operation/css/1558.html


チェックボックスに連動して、入力許可 ※未チェック(^^;

<input type="checkbox" name="no" id="chk" onClick="
    if (chk.checked==true){
        txt1.disabled=false;
    } else {
        txt1.disabled=true;
    }
">
<input type="text" name="text1" id="txt1" disabled>



お気に入りに追加

<input type="button" value="お気に入りに追加" onClick="
    window.external.AddFavorite('http://www.netdive.jp/','NETDIVE')
">



ホームページに設定

<input type="button" value="ホームページに設定" onClick="
    this.setHomePage('http://www.netdive.jp/')
">



ファイルの参照ボタンを使わずにドラッグ&ドロップで設定

http://msdn.microsoft.com/library/default.asp?url=/workshop/Author/dhtml/reference/events/ondragstart.asp
サンプルはそのうち…

function eve1(){
window.onDragDrop.data;
}
window.onDragDrop = eve1;
↑チェックしてません。

関連
ドラッグ&ドロップライブラリ: Dragable
http://siva.cc.hirosaki-u.ac.jp/usr/koyama/dragable/



クリップボードへテキストをコピー

<script language=javascript>
function ClipBoard() {
	textRange = document.body.createTextRange();
	textRange.moveToElementText(Text1);
	textRange.execCommand("Copy");
}
</script>
<input type="button" value="クリップボードへコピー" onclick="ClipBoard();">
<div id="text1">
ここに書かれている内容がクリップボードにコピーされます。
createTextRangeについては下記を参考に。
http://www.microsoft.com/japan/developer/library/jpisdk/dhtml/references/methods/createTextRange.htm#createTextRange
</div>



クリップボードのテキストを表示

<script language=javascript>
function ClipBoard() {
	if(clipboardData.getData("Text")){
		document.form1.text1.value = clipboardData.getData("Text");
	}
}
<form name="form1">
<textarea cols="40" rows="10" name="Text1">
<input type="button" value="クリップボードの内容を表示" onclick="ClipBoard();">
</form>

知ってる人は多いと思いますが、こういった事が出来てしまいます。

 あなたのクリップボードが盗まれる
 http://private.ceek.jp/archives/001639.html
 URLをコピペしたら悪質サイトに――乗っ取り被害が続出
 http://www.itmedia.co.jp/news/articles/0808/20/news033.html



テキストエリアの文字数をステータスバーに表示 と、カーソル位置にテキスト代入
(昔書いたソースの一部切抜き加工。未チェック)

<script language=javascript>
var n=0;
var s=0;
function pp(par){
 var r=document.form1.mbody.createTextRange()
 r.collapse()
 r.moveStart("character",document.form1.mbody.value.replace(/\r/g,"").length-n)
 r.moveEnd("character",s)
 r.text=par + r.text
 r.collapse(false)
 r.select()
 r.parentElement().focus()
 s=0
 Check()
}

function Check() {
 dmy = escape(document.form1.mbody.value);
 dlen = dmy.length;
 moji = 0;

 var r=document.form1.mbody.createTextRange()
 var sel=document.selection.createRange()
 r.moveToPoint(sel.offsetLeft,sel.offsetTop)
 r.moveEnd("character",sel.text.length)
 s=r.text.replace(/\r/g,"").length
 r.moveEnd("textedit")
 n=r.text.replace(/\r/g,"").length+(document.form1.mbody.value.match(/(\r\n)*$/),RegExp.$1.length/2)

 for(i=0;i<dlen;i++){
  if(dmy.charAt(i) == "%") { i=i+4; }
  moji++;
 }
 window.status = "残り入力文字数: " + (500 - moji) + 
	" バイト (" + (500 - moji)/2 + " 文字) 文字位置:" +
	(document.form1.mbody.value.replace(/\r/g,"").length - n) + "文字目";
}
</script>
<form name="form1">
<textarea wrap="physical" name="mbody" rows="18" cols="17" 
	onmouseup="Check()" OnkeyUp="Check()" OnChange="window.status=''"></textarea><br>
<input type="button" value="カーソル行に文字挿入" onClick="pp('埋め込み')">
</form>

※IE7 では window.status が使えなくなってるみたい…



最終更新日をテキスト表示

 date = new Date(document.lastModified);
 y = date.getFullYear();
 m = date.getMonth() + 1;
 d = date.getDate();

 if (m < 10) { m = "0" + m; }
 if (d < 10) { d = "0" + d; }

 document.write(y + "/" + m + "/" + d);



数字のチェック

<script language=javascript>
function numchk(){
	var i;
	var sNum;
	var wNum;
	sNum = document.form.text1.value;
	if(sNum == ''){
		alert('数値を入力して下さい。');
		return false;
	}
	for(i=0; i<sNum.length; i++){
		wNum = sNum.charAt(i);
		if((wNum<'0') || (wNum>'9')){
			alert('数値を正しく入力して下さい。');
			return false;
		}
	}
}
</script>
<body>
<form action="" method="post" name="form">
<input type="text" name="text1">
<input type="button" onclick="numchk()">


一定時間なにもしなければログアウト。

 SetInterval メソッドを使用してログオフする方法が MS サイトに書かれています。

  [HOWTO] Web アプリケーションから自動的にユーザーをログオフする方法
  http://support.microsoft.com/default.aspx?scid=kb;ja;315584



Web ページダイアログ(showModalDialog/showModelessDialog) で表示した後に、そのページ内で URLの移動(POST処理等)する場合。

ウィンドウにスクリプトで名前を付けけておき(this.window.name="modal1" など)
URL を移動する際に target="modal1" などのように現在のウィンドウ名を指定する。

[IE] Internet Explorer のプロセスを複数起動すると showModalDialog/showModelessDialog からセッション Cookie が正しく送信されない
http://support.microsoft.com/default.aspx?scid=kb;ja;839443
 Google キャッシュ
 http://www.google.co.jp/search?hl=ja&rls=GGLG%2CGGLG%3A2005-31%2CGGLG%3Aja&q=showModalDialog+839443&lr=



リンククリック後に戻るボタンを無効化

<a href="http://www.netdive.jp" onClick="

    javascript:location.replace(this.href);
    event.returnValue=false;
    event.cancelBubble=true;

">NETDIVE TOPページへジャンプ</a>



APPLET、EMBED、OBJECT 要素を使っている場合の自動アクティブ化

Internet Explorer 用の累積的なセキュリティ更新プログラム (912812) (MS06-013)
http://www.microsoft.com/japan/technet/security/bulletin/ms06-013.mspx
適用後、IE の挙動が変わり、自動でアクティブにならない(特許の関係)

下記を参考にスプリクトで自動的にアクティブになるようにする。

 ActiveX コントロールのアクティブ化
 http://www.microsoft.com/japan/msdn/workshop/author/dhtml/overview/activating_activex.aspx

createElement で生成した場合に URL を流しこむと、音声だけで映像が表示されないような・・・
document.wite を使えば、正しく動作しましたが。。。

 IE の更新プログラムを適用すると、Flash や Shockwave を余計に一度クリックしないとコンテンツを操作できない
 http://support.adobe.co.jp/faq/faq/qadoc.sv?5503+001
 MS、Eolasからライセンス取得でIEの「余分な1クリック」解消へ
 http://www.itmedia.co.jp/news/articles/0711/10/news001.html

2008 年 4 月公開予定の IE 累積アップデートで元に戻るようです。

 Internet Explorer自動 コンポーネントアクティブ化(IE ACA)更新は、「アクティブ化するのをクリックする」動作を無効にするよう使用できます。 
 http://support.microsoft.com/kb/945007
 で、元にもどるようです。テスト版?



画像のリンクが切れている場合に、[X]マークを出さないようにする。

<img src="a.jpg" alt="a" onerror="this.style.display='none'"/>



角を丸くするには

 Nifty Corners: rounded corners without images
 http://pro.html.it/esempio/nifty/

のスプリクトを利用して、Rounded 要素で設定する。
ちなみに、XP + IE の場合は、<fieldset> タグを使うと角丸になる。(2000 の場合は角ばったまま)
<META HTTP-EQUIV="MSThemeCompatible" Content="No"> を付けると、OS(XP) と同じ概観を持たないようにも出来る。



[x]ボタンを押したときや、サイト移動時にスプリクトを動作させるには

<script for=window event=onbeforeunload language="JavaScript">
 window.event.returnValue = "メッセージ"
</script>



URL の ? 以降の文字を取得する。※未チェック

<body
    onload="
        if(location.search!=''){
        	var par = location.search; //「?以降の文字列を返す」#以降を返す場合は、.hash
        	par = par.replace(/\?/,'');
	        par = par.split('&');
	        for(var i=0; i<par.length; i++){
	        	alert(par[i]);
	        }
		}">



グレイスケール

<style>
.glayer {
    position: fixed!important;
    position: absolute;
    top:0;
    left:0;
    width:100%;
    height:100%;
    z-index:100;
    background-color:#1F1F1F;
    -moz-opacity: 0.8;
    opacity:.80;
    filter: alpha(opacity=80);
    display:none;
}
</style>
<!-- グレイスケール表示するためのエレメント -->
<div id = "glayer" class = "glayer"></div>

あとはスプリクトで座標指定
document.getElementById("glayer").style.zIndex = "100";
document.getElementById("glayer").style.display = "block";
document.getElementById("glayer").style.top = "100";
document.getElementById("glayer").style.left = "100";
document.getElementById("glayer").style.width = "100";
document.getElementById("glayer").style.height = "100";

これだとフラッシュの上に表示出来ない。
表示するには、iframe を利用する。

<!-- グレイスケール表示するためのエレメント -->
<iframe id = "glayer" class = "glayer" src="./glayer.html"></iframe>

glayer.html
<html><body style="background-color:#1F1F1F;"></body></html>



エレメントID を使って値を取得、変更

prototype.jp の $F が楽チンですが実装してみると。
function eID(tagid){
    return this.XMLHttpRequest ?
        document.getElementById(tagid) :
        document.all(tagid);
}

グレイスケールの表示(少しだけ短く書ける)
eID("glayer").style.display = "block";



メディアプレーヤーをコントロール(iframe に wmp を貼り付けて在るのが前提。)昔のソースを一部抜き出し。

--wmp.html はこんな感じで。
<body style="margin:0">
<object id="wmp"
	height="480" width="640"
	classid="clsid:6BF52A52-394A-11D3-B153-00C04F79FAA6"
	onmousemove="window.status='再生時に表示される視覚エフェクトは、メディアプレーヤで最後に選択した物になります。'">
	<param NAME="URL" VALUE="" />
	<param NAME="rate" VALUE="1" />
	<param NAME="balance" VALUE="0" />
	<param NAME="currentPosition" VALUE="0" />
	<param NAME="defaultFrame" VALUE="" />
	<param NAME="rate" VALUE="1" />
	<param NAME="balance" VALUE="0" />
	<param NAME="defaultFrame" VALUE="" />
	<param NAME="playCount" VALUE="1" />
	<param NAME="autoStart" VALUE="-1" />
	<param NAME="currentMarker" VALUE="0" />
	<param NAME="invokeURLs" VALUE="-1" />
	<param NAME="baseURL" VALUE="" />
	<param NAME="volume" VALUE="50" />
	<param NAME="mute" VALUE="0" />
	<param NAME="uiMode" VALUE="none" />
	<param NAME="stretchToFit" VALUE="-1" />
	<param NAME="windowlessVideo" VALUE="0" />
	<param NAME="enabled" VALUE="-1" />
	<param NAME="enableContextMenu" VALUE="0" /><!-- 右クリックメニュー許可・禁止 -->
	<param NAME="fullScreen" VALUE="0" />
	<param NAME="SAMIStyle" VALUE="" />
	<param NAME="SAMILang" VALUE="" />
	<param NAME="SAMIFilename" VALUE="" />
	<param NAME="captioningID" VALUE="" />
	<param NAME="enableErrorDialogs" VALUE="0" />
	<param NAME="_cx" VALUE="6482" />
	<param NAME="_cy" VALUE="6350" />
</object>
</body>
--
<iframe src="wmp.html" frameborder="0" scrolling="no" name="wmpframe" width="640" height="480"></iframe>
<input type="checkbox" id="fullscreen" onclick="makeFullScreen()"/>フルスクリーン
<input type="checkbox" onclick="wmpLoop()"/>Loop

function wmpRateChange(spd){
// 再生速度変更
	var w = window.wmpframe;
	var d = w.document.wmp;
	d.Settings.rate = spd;
}
function wmpFastForward(){
// 5倍速再生
	var w = window.wmpframe;
	var d = w.document.wmp;
	d.Controls.fastForward();
}
function wmpFastReverse(){
// 5倍速巻戻し
	var w = window.wmpframe;
	var d = w.document.wmp;
	d.Controls.fastReverse();
}
function wmpPisAvailable(f){
// Play       play メソッドが利用できるかどうかを調べます。 
// Pause      pause メソッドが利用できるかどうかを調べます。 
// Stop       stop メソッドが利用できるかどうかを調べます。 
// FastForward   ファイルが FastForward をサポートするか、および機能を呼び出すことができるかどうかを調べます。多くのファイルの種類 (またはライブ形式のストリーム) では、FastForward がサポートされません。 
// FastReverse   ファイルが FastReverse をサポートするか、および機能を呼び出すことができるかどうかを調べます。多くのファイルの種類 (またはライブ形式のストリーム) では、FastReverse がサポートされません。 
// Next       ユーザーが再生リスト内で次の項目に移動できるかどうかを調べます。 
// Previous     ユーザーが再生リスト内で前の項目に移動できるかどうかを調べます。 
// CurrentMarker  ユーザーが特定の名前付きマーカーに移動できるかどうかを調べます。マーカー付きのファイルに対してのみ有効です。 
// CurrentPosition ユーザーがファイル内の特定の位置に移動できるかどうかを調べます。移動がサポートされないファイルもあります。 
// CurrentItem   ユーザーが currentItem プロパティを設定できるかどうかを調べます。 
	var w = window.wmpframe;
	var d = w.document.wmp;
	d.controls.isAvailable(f);
}
function wmpPlayItem(no){
// メディア項目の再生
	var w = window.wmpframe;
	var d = w.document.wmp;
	d.controls.playItem(no);
}
function wmpNext(){
// 次の項目に移動
	var w = window.wmpframe;
	var d = w.document.wmp;
	d.controls.next();
	MediaPlay();
}
function wmpPrevious(){
// 前の項目に移動
	var w = window.wmpframe;
	var d = w.document.wmp;
	d.controls.previous();
	MediaPlay();
}
function MediaPlay(){
// 再生
	var w = window.wmpframe;
	var d = w.document.wmp;
	d.controls.Play();
}
function wmpStop(){
// 停止
	var w = window.wmpframe;
	var d = w.document.wmp;
	d.controls.stop();
	d.CurrentPosition = 0;
}
function wmpPause(){
// 一時停止
	var w = window.wmpframe;
	var d = w.document.wmp;
	d.controls.pause();
}
function wmpPlayStyleMode(){
//ランダム再生
	var st;
	var w = window.wmpframe;
	var d = w.document.wmp;
	if(d.settings.getMode('shuffle')==true){
		d.settings.setMode("shuffle",false);
	} else {
		d.settings.setMode("shuffle",true);
	}
}
function wmpLoop(){
//ループ
	var w = window.wmpframe;
	var d = w.document.wmp;
	if(d.settings.getMode('loop')==true){
		d.settings.setMode("loop",false);
	} else {
		d.settings.setMode("loop",true);
	}
}
function attachBehaviour() {
//フルスクリーン  の場合、attachEvent を使わないと動かない。
	var w = window.wmpframe;
	var d = w.document.wmp;
	d.attachEvent('playStateChange',makeFullScreen);
}
function makeFullScreen() {
	var w = window.wmpframe;
	var d = w.document.wmp;
	if (d.playState == 3) {
		if(top.document.getElementById("fullscreen").checked==true){ //チェックBOX確認
			d.fullScreen = 'true';
		} else {
			d.fullScreen = 'false';
		}
	}
}

プレイリスト(ASX)が在る場合のタイトルとか
d.currentMedia.getItemInfo("Title")
d.currentMedia.getItemInfo("Artist")
[WMP].asx ファイルの内容


クロスサイト・スクリプティング(XSS)対策

セキュアなWeb構築の秘訣〜クロスサイトスクリプティングは思わぬ個所に巣食っている〜
 第1回 クロスサイトだけが問題ではない
 http://itpro.nikkeibp.co.jp/members/NBY/Security/20040809/148383/
 第2回 多面的な特徴を持つ
 http://itpro.nikkeibp.co.jp/members/NBY/Security/20040809/148384/
 第3回 クロスサイトの意味
 http://itpro.nikkeibp.co.jp/members/NBY/Security/20040809/148385/
 第4回 さまざまな個所に潜む
 http://itpro.nikkeibp.co.jp/members/NBY/Security/20040809/148386/
 第5回 受動的攻撃との組み合わせで深刻に
 http://itpro.nikkeibp.co.jp/members/NBY/Security/20040809/148387/
 第6回 対策の基本はHTMLエンコード
 http://itpro.nikkeibp.co.jp/members/NBY/Security/20040809/148388/
 第7回 見落としがちな問題
 http://itpro.nikkeibp.co.jp/members/NBY/Security/20040809/148389/
 第8回 自動生成するJavaScript対策
 http://itpro.nikkeibp.co.jp/members/NBY/Security/20040809/148390/

◆画面解像度は横1,024ピクセルが6割〜Jストリームが Web 環境調査
 http://japan.internet.com/wmnews/20061106/3.html
◆IPA、「安全なウェブサイトの作り方 改訂第2版」を発行
 http://japan.internet.com/webtech/20061106/4.html
◆フィッシング詐欺(擬似サイトと対策)
 http://eazyfox.homelinux.org/Security/special/Security24.html
◆NO!PHISHING.JP : アドレスバー(URL)偽装の脆弱性と事例
 http://no.phishing.jp/topic/2006/06/url_1.html
◆XSSの実例
 https://www.webappsec.jp/modules/bwiki/index.php?XSS%A4%CE%BC%C2%CE%E3
◆XSS (Cross Site Scripting) Cheat Sheet
 http://ha.ckers.org/xss.html

  不正コードの標的はコンピュータからブラウザへ?
  http://www.itmedia.co.jp/news/articles/0703/28/news089.html
  常識を覆す「悪意あるコードの実態」--米社調査
  http://itpro.nikkeibp.co.jp/article/Research/20070328/266601/
  「企業はWebアプリケーションの脆弱性を認識していない」
  ――ネットワーク・ファイアウォールだけでは攻撃は防御できない 
  http://opentechpress.jp/security/article.pl?sid=07/03/23/0411234

[CSS]気をつけたいIE 7のバグ -CSS-Discuss
http://coliss.com/articles/build-websites/operation/css/577.html

情報セキュリティ白書2008 第II部「10大脅威 ますます進む『見えない化』」を公開
http://www.ipa.go.jp/security/vuln/20080527_10threats.html



TOPページ以外のページに直接アクセスされた場合、TOP へ誘導(ASP だけど。。。)

global.asa に記述

<script language="VBScript" runat="Server">
Option Explict

Dim uArray
Dim ScriptName
Dim CurrentPG
Dim CurrentDIR

Sub Session_OnStart
  ScriptName = Requset.ServerVariables("SCRIPT_NAME")
  If Instr(ScriptName, "/") > 0 Then
    uArray = Split(ScriptName, "/")
    CurrentPG = LCase(uArray(UBound(uArray)))
    If UBound(uArray) - 1 >= 0 Then
      CurrentDIR = LCase(uArray(UBound(uArray) -1))
    Else
      CurrentDIR = ""
    End If
    If CurrentPG <> "index.asp" Then
      Response.Write "<" & "script lanugage='javascript'" & ">"
      Response.Write "parent.location.href='index.asp'"
      Response.Write "<" & "/script" & ">"
    End If
End Sub
</script>



IIS で UTF-8 の結果を返す

<%@ Language=VBScript ENABLESESSIONSTATE=False CODEPAGE=65001 LCID=1041 %>
<% Response.CharSet = "UTF-8" %>

出力時のデータは XML の場合
<?xml version="1.0" encoding="UTF-8" ?>
<data>
 <title>タイトル</title>
</data>
<!-- こんな感じ -->

HTML の場合は、 HEAD フィールドに
<meta http-equiv="Content-type" content="text/html; charset=UTF-8" />
を追加しておく。

クライアントからサーバへ送る時

 FORM で GET や POST する場合は
 <form id="form1" action="about:blank" method="get" accept-charset="utf-8">
 を忘れずに。

 XML で POST する場合は
 .setRequestHeader("Content-type","application/x-www-form-urlencoded; charset=UTF-8");

 javascript で POST する場合は
 document.form.method = "POST";  
  encodeURIComponent を使う?

※ファイルの保存時に UTF-8 を選択する事。
 [IIS]CodePage を UTF-8 に設定すると一致しない文字で出力されることがある
 http://support.microsoft.com/kb/295063/
 UTF-8 エンコーディングの危険性 - WebOS Goodies
 http://webos-goodies.jp/archives/51072404.html
 UTF-8.jp
 http://utf-8.jp/

msdn JScript
JScript 8.0(MSDN2 Library)
Firefox 3とFirebugで始めるJavaScript開発
日本の JavaScript ユーザのためのハブサイト
オブジェクトなJSの基礎講座
高度な JavaScript 技集
とみのホームページ
Javascriptで指定のHTML要素を動的に角丸デザインにする方法。
JavaScript統合開発環境 JSide 1.0 登場
そろそろきっちりJavaScript 第2回 執筆=富田陽介 無名関数についてもう少し考える
Javascriptによる大規模開発の覚え書き。高速化編
一行で IEJavaScript を高速化する方法
javascriptを初めて学ぶ人についてのおさらい。その1
IEFirefoxで「リファラを送信しない設定」をする
わずか数行で"ものすごいテーブル"に! - jQueryプラグイン「Flexigrid」
第6回 JavaScriptでHTMLをダイナミックに書き換える 前編

JavaScriptテトリスみたいなゲームを作ろう!
Flashなしでもここまで作れる!
印刷専用ページを簡単に作るには(SSI版)
インターネットチャンネル向けのウェブページを作りたいのですが…。
 Wiiのネット機能悪用の動き、Opera旧版の脆弱性に起因
最も人気あるプログラミング言語は「JavaScript」、Ajax開発における関心事1位は「クロスブラウザレンダリング
MicrosoftからJavaScriptメモリリーク検出ツール
MS、XSS脆弱性検出ツールを無償公開
もいちどイチから! HTTP基礎訓練中 第3回 Ajaxのセキュリティ、特殊なものだと思ってました

Ajax 関連 入門 Ajax Ajaxセキュリティ (単行本(ソフトカバー)) (アマゾン)
表示をぐりぐり動かせるWeb技術「Ajax」って、だから何なの?(ネット・トレンド)
JavaScript++かも日記
Microsoftの次世代ポータル「Start.com」が日本語に対応
AJAXを全面的に使ったマイクロソフトポータルサイトStart.com」が日本語に対応
Ajaxで作られた手書き文字認識
ふにゃふにゃGoogle
Ajaxフォトアルバムのフェードイン画像フレームを作ろう
JavaScriptでリッチアプリケーションを実現 - qooxdoo 0.1.4
Ajaxを超える「Arax」採用、リッチクライアント新技術の内容は
Opera、携帯向けAjaxサイトを構築するためのSDK
時間がないときの Ajax
ASP.NETAjax.NETでAjaxプログラミングを効率化するには?
MicrosoftAjaxベースのIM通信クライアント「Communicator Web Access」を発表
AJAX Toolkit Framework、Apache Incubator Projectへ提案される
ネットビレッジ、Ajax技術を活用したタイムマネジメントツールを公開
第3回 どんなに無茶をやっても「それもありかな」なAjax
ASP.NET にスパイスを加える: AJAX
浸透し始めたAjax,開発支援ツールに期待感 Windowsライクな操作性を実現できるが実装は「茨の道」
第4回 自動車業界のAjaxを活用したキャンペーンを目撃せよ
Ajax技術の目に見えない通信内容をのぞいてみよう
AJAXを使ったJava製プロジェクトトラッキングツール - TrackIt 1.0.0
Yahoo!からのバレンタインプレゼントはWeb 2.0/AJAXライブラリ
宇宙から見た富士山の3D画像! - JAXA、衛星「だいち」の取得画像を初公開
Ajax地図で住宅情報検索 リクルート
HOWS、ホームページをマウスだけで制作・ソフト開発
HOWS、動的 Web ページ作成ツール「AjaxBuilder Lite」β版を無料公開
マクロメディア、Web 作成ツール各種をバージョンアップ
Windowsでイントラ・ブログを構築する
リッチクライアントベンダ・インタビュー「Ajaxをコーディングレスで作成するAjaxBuilder」
Ajaxで人気のRuby on Ralisとは?
“どのブラウザでも動くAjax”を共有財産として育てよう
Microsoft、新検索サービス「Windows Live Search」ベータ版を公開
JSPAjaxポートレット JSP Controls Tag Library 0.5
Ajax開発環境を無償にしたTIBCOは勝ち組?
Ajaxのビジュアル開発が可能に,TenArtni Ninja-VA新版がEclipsにも対応
Ajaxを用いたWebアプリケーション構築ツール「AjaxBuilder Lite」
その70「Ajaxの仕組み」
JSONによるデータ通信でAjaxアルバムを完成させる
Ajaxを使ったファイルマネージャをPHPで作ろう
Ajaxを利用し、ブラウザ上でデスクトップと同じ機能を提供する「StartForce」
AdobeAjax対応ページ作成用の「Spry」公開
MSのAjaxツールセットの名前は「Comet」
Ajaxの特徴に潜むリスクをサンプルアプリで確認しよう
Yahoo!Web検索サービスとGWTを使ってみよう
Ajaxを理解する4つのポイント
そのサービスはAjaxフレームワークで一変できるか? (1/4)
サーバが通信を開始できるComet活用Webチャット
 Comet: Low Latency Data for the Browser
FlexフレームワークCairngormでサンプルアプリ
企業サイトに「Web 2.0」を実装する 連載一覧
Webアプリに使えるAjaxライブラリ8選!
Ajax YUIライブラリを使う準備
Ajaxな無料のWeb OS、スウェーデンのXcerionが開発中
第5回 Amazon Webサービスを料理してみる
Ajaxの高度な使用例、Yahoo! pipes
Ajaxデバッグしよう
JavaScriptレスでAjax開発、NTTデータフレームワークの実力は
【ハウツー】らくらくAjax実装!ちょっと使ってみませんか? - myAJAX
Ajaxフレームワーク「qooxdoo 0.7」登場 - メジャーリリースの位置づけ
リバースAjax機能はAjaxJavaをもっとやさしくする?
Ajaxおいしいレシピ
Prototype 1.6.0、待望のリリース - 同時に書籍も発売
詳解! Dojo Toolkit 1.0 (基礎知識編) - 頻出APIと便利機能を一気におさえる
いまからはじめるPrototype.js
JavaScriptへのマルチスレッド・プログラミングの導入
Google人気JavaScriptライブラリ配布開始、ネット全体でキャッシュ効果
まじで使えるJavascriptライブラリ75選
Yahoo!JavaScriptフレームワーク最新YUI 2.6.0発表
Prototype 1.6.0.3登場、待ち望まれていたバグ修正あり堅実さ向上
jQueryMicrosoft
SubSonicを使ってASP.NETで簡単にDBアクセスする - プログラミング編
Ajax JavaScriptフレームワークどれを選ぶべきか - John Resig比較
20の優れたAjax効果

小さくて可愛いフリーのアイコンセット「Minimalist Pixel Icon Set」
40,000個以上のアイコンをシンプルなインターフェースで検索できる『iconlet』
アイコン・ファビコンを作成するサイト20
なんとも太っ腹!無料で使えるかわいいアイコンが560個!『User Interface Icons』
商用・個人サイトで利用可能なロイヤリティフリーの写真素材サイト集
JavaScript復権
あなたのブログ読者はほかにどんなブログを読んでいる?--サイドフィードの新サービス
あなたのページを最速にする14の掟
MS、無償のWeb制作者向けIEプラグインInternet Explorer Developer Toolbar」正式版公開(CodeZine)
Firebug lite
 Firebug for IE7FireBug Lite ++」
IEjavascriptのエラーをデバッグする方法
IEでのデバッグ/動作確認に便利なソフトいろいろ
モバイルサイトをPCで見るためのツールやFirefoxアドオン
Web開発者は必須!様々なバージョンのIEを収録した「Internet Explorer Collection」
IEでのJavaScriptデバッグを可能にする「CompanionJS」
これは凄い、Ajaxをオンザフライ解析 - Razor Profiler
IE6 and IE7 速度テスト(ベンチマーク
http://www.openspc2.org/JavaScript/benchmark/index.html
 試してみた。
 ●Windows 2000 SP4 + IE6 P3 800Mhz Dual,   512MB 文字連結 36922msec
 ●Windows XP SP2 + IE6  P4HT 2.6GHz,    512MB 文字連結 5969msec
 ●Windows XP SP2 + IE7  core Duo 1.83GHz, 1024MB 文字連結 3047msec


API関連 最新WebサービスAPIエクスプロ-ラ ~AmazonはてなGoogleYahoo! 4大Webサービス完全攻略(アマゾン)
Webプログラミングで腕試し、米Googleが「Homepage API」を公開
意外と簡単!自社サイトの案内地図をGoogle Mapsに置き換えてみよう
ヤフー、API公開スタート まずは検索から
Yahoo! Photosなど4サービスのAPIを新たに公開
ヤフー、開発者向けサイトで Yahoo! オークション API を公開
【ハウツー】ゼロからはじめるYahoo! UI Library - Panel編
Konfabulator 2.1.1
Yahoo!、「Konfabulator」改め「Widget Engine 3.0」をリリース
はてなウェブサービス
はてな、会員認証APIを外部に開放
Amazon広告スクリプト:lilbox
Amazon AWS を利用できるためのXML, XSL理解備忘録
Amazon.com,開発者向けオンライン・ストレージ・サービス「Amazon S3」開始
Google AdSense API がベータ公開
ラクシーズ、ワールドカップを前にGoogle Maps API利用のチャットサービス開始
paperboy&co.、会員認証システム「JugemKey認証API」を公開
スケジュール管理サービス「Googleカレンダー」日本語対応版が登場
Windows Live ガジェット SDK の日本語版を公開
URLを入力するだけでHTMLをPDFに変換する無償サービス,Web APIも公開
DojoYahoo! Pipesをサポート
Google Apps Premier Edition、国内でも提供開始へ
楽天トラベル」APIを公開、約21,500軒の宿泊施設情報が取得可能
Wii向けFlashゲーム用の十字キー操作API
Ajaxアプリでもナビゲーションバーで戻りたい!」を叶える、dsHistory登場
知っておいて損はないAJAXCSSを駆使したタブインターフェース18種類
MS、Flashキラーの新技術「Silverlight」発表
 【Silverlight 2 日本語 チュートリアル提供開始】 実践に役立つ基本を徹底解説! http://silverlight.net/internationallearn/default.aspx
Googleがフィード組み込みを支援する開発者向けAPIを発表
Microsoft AJAX Libraryでドラッグ&ドロップ対応のWebページを作成する
かな漢字変換ソフト「VJE」、ヤフーのWeb APIとして“復活”
マイクロソフトWindows Live APIの日本語リファレンス公開

日経ソフトウエア 2006年5月号
http://software.nikkeibp.co.jp/software/backno/2006/0605indexc.html

 特集
  GoogleAmazonYahoo!徹底活用
  Web APIプログラミング!

  特集1 Web APIプログラミングに挑戦しよう!
  特集2 Google Web APIsでWeb検索プログラミング!
  特集3 Google Homepage APIを使ってみよう
  特集4 Amazon / Yahoo! JAPAN Webサービス徹底活用
  特集5 SOAPWSDL,REST――Web APIの基礎技術を学ぶ

 だ、そうです。

日本で公開されているAPI一覧(下書き)

最近参考にさせてもらったサイト
prototype.js の開発者向けメモ
Ajaxを勉強しよう
script.aculo.us - web 2.0 javascript
 11月11日の技術勉強会
AJAX Activity indicators | Animated GIFs designed to indicate your site is doing something
たのしいXML: XML/XHTML入門ページです

RSS関連
応用技術(RSS, SVG,MathML...) - [HTML・XML]All About
RSS作成ソフトを使ってRSSを自動生成しよう
W3CRSS/Atomフィードの文法を検証するバリデータを公開
ごく簡単なHTMLの説明
RSS -- サイト情報の要約と公開
Atom - RSS改訂の試み

ドリコムが具現したWeb 2.0の第一弾「ドリコムRSS」--ユーザーに合わせた広告配信も
RSS収集・分析サイト「BLOG360」開設、ブログで話題のキーワードを表示 形態素解析 の実験はhttp://www.netdive.jp/cha.aspで以前触ってみたことがあります。
 キーウォーカー、プロガーのプロファイリングを可能にする検索サービス
Web 2.0的」考察−第1回 RSSAtom
ASP.NET]データベースからRSSフィード情報を生成するには?

Web2.0
それはWeb 2.0へと続く道
後編 Web2.0の全体像を整理する Web2.0時代のお金・情報の流れをつかむ
話題の次世代WebサービスWeb2.0」っていったい何だ?
ベンチャー企業の代表者が解くWeb 2.0と経営の本質
広がるWeb 2.0の世界,使えるサービスはこんなにもある
大企業は発想の転換を、シリコンバレーの頭脳を使って開発する時代に
企業はコンテンツと顧客データベースの一元管理を
今後は製造業で企業情報システムとWebの統合が進む
Web 2.0時代の三行広告サイト「edgeio」がサービス開始
第5回:O'Reilly氏による「Web 2.0とは何か」のポイント(後編)
第7回:「Web 2.0」を理解するための、たった2つのポイント
ビジネス展開におけるWeb 2.0 第1回:Web 2.0が意味する新しいトレンド
Web2.0の背景を知る」 第1回 新しい時代の予感
Web2.0な日々 自分だけの検索エンジン
Google Appsで家族ドメインを運用する
Web 2.0は危険がいっぱい: 第1回 悪意のJavaScriptで情報が漏えい
 
SEO対策講座 - 検索エンジン事情 - 独自ドメインSEOに有利か?
http://www.fseeker.jp/seolecture/column/20060327.html
SEO の目的は何? 目的と手段を混同しない
http://japan.internet.com/column/webtech/20060322/7.html
こんなことが分かっていない!
http://japan.internet.com/column/wmnews/20060322/6.html
自分のサイトがほかのブラウザでどう見えるか試す「browsershots.org」
http://gigazine.net/index.php?/news/comments/20060908_browsershots/
色の組み合わせをチェックしてみる
http://www.kanzaki.com/docs/html/color-check
Webデザイン・マーケティングセミナー・レポート
http://itpro.nikkeibp.co.jp/webdesign/index.html
W3Cの検証サービス
http://validator.w3.org/
第5回 デザインのセンス,持ってますか
http://itpro.nikkeibp.co.jp/article/COLUMN/20061121/254314/
HTML 4.01の正しい記述方法、最小構成編
http://journal.mycom.co.jp/news/2008/09/30/023/
エンジニアのためのWebデザイン教室 第27回 フォームとCSS
http://itpro.nikkeibp.co.jp/article/COLUMN/20080924/315327/
DOCTYPE スイッチについてのまとめと一覧表 (HTML 5 や IE 8 Beta 2 のモードスイッチなどの情報も含んだ 2008 年版 )
http://hxxk.jp/2008/09/29/0118
JavaScriptベストプラクティス: Unobtrusive DOMプログラミングのススメ
http://journal.mycom.co.jp/news/2008/09/25/035/index.html
CEATEC JAPAN 2008 - 世界初! ソニー、テレビ用の自作アプリ開発環境を公開
http://journal.mycom.co.jp/articles/2008/10/02/ceatec_sony/
個人・商用サイトで利用可能な大きいサイズのテクスチャ配布サイト -Texturise
http://coliss.com/articles/build-websites/operation/design/1542.html
プログラミング向けフォント32選
http://kenz0.s201.xrea.com/weblog/2008/10/post_144.html