プログラミング学習の記録 181.3 独習JavaScript (大型本)の第10章Ajaxの理解度チェック

開発環境:Mac OS X Snow Leopard+Firefox(ブラウザ)+Firebug(アドオン)

"独習JavaScript (大型本)"のp.400, 第10章Ajax、この章の理解度チェックを解いてみる。




1.
var request=new window.XMLHttpRequest(); request.onreadystatechange=function(){ if(request.readyState==4 && request.status==200){ alet(request.responseText); } }; request.open("open","/q1.txt",true); request.send(null);

2.
function clicked(){ var request=new window.XMLHttpRequest(); request.onreadystatechange=function(){ if(request.readyState==4 && request.status==200){ var d0=document.getElementById("d0"); if(navigator.userAgenet.toLowerCase().indexOf("firefox")==true){ d0.textContent=request.responseText; } else { d0.innerHTML=request.responseText; } } }; request.open("GET","/q1.txt",true); request.send(null); }
上記のコードの記述を変更し、実行するとテキストではなくKamimura's blogのラベル、JavaScriptの記事一覧を表示するようにしてあります。

3.
function onMouse(url){ var request=new window.XMLHttpRequest(); request.onreadystatechange=function(){ if(request.readyState==4 && request.status==200){ var d1=document.getElementById("d1"); if(navigator.userAgent.toLowerCase().indexOf("firefox")==true){ d1.textContent=request.responseText; } else { d1.innerHTML=request.responseText; } } }; request.open("GET",url,true); request.send(null); }
各文字列にマウスポインタがあった場合にその内容が表示されます。

ラベル、JavaScriptの記事一覧

ラベル、Firefoxの記事一覧

4.

今回はJSONPがまだよく理解できなかったので次回に再挑戦。とりあえずJSONPというのを利用すれば他のドメインからデータが取得でき、マッシュアップなどに便利みたい。(XMLHttpRequestではドメイン内のデータしか取得できない。)