「アプリ開発３」(2010/06/04 (金) 19:12:03) の最新版変更点
追加された行は緑色になります。
削除された行は赤色になります。
*&this_page() ～JavaScriptライブラリ～
**prototype.js
参考：[[prototype.jsを読み解く｜gihyo.jp … 技術評論社>>http://gihyo.jp/dev/feature/01/prototype/0001]]
**jQuery
参考：[[jQueryの魔法 -［JavaScript］All About>>http://allabout.co.jp/internet/javascript/closeup/CU20071020A/]]
**参考になるページ
[[2008年に注目を集めた使えるJavaScriptライブラリ集:phpspot開発日誌>>http://phpspot.org/blog/archives/2009/01/2008javascript.html]]
[[JavaScript Library Archive>>http://javascript.webcreativepark.net/]]
[[Ajax (JavaScript) Library List (Ajaxライブラリ一覧)>>http://www.openspc2.org/JavaScript/Ajax/Library/index.html]]
**Ajax
[[Ajaxはじめの一歩 XMLHttpRequest - ［JavaScript］All About>>http://allabout.co.jp/internet/javascript/closeup/CU20050515A/index.htm]]
var httpObj = XMLHttpRequest();
httpObj.open("GET","data.txt",true);
**JSON
[[JSON/簡単なテスト:基本>>http://jsgt.org/ajax/ref/test/json/test1.htm]]
JSON (JavaScript Object Notation) とは、テキスト形式の構造化データフォーマットです。
<script language = "JavaScript">
<!--
var myJSONObject3 =
{
"test1": "hello1",
"test2": "hello2",
"test3": "hello3"
}
//-->
</script>
<form>
myJSONObject3オブジェクトのtest2プロパティを取り出します
<input type = "button" onclick = "alert( myJSONObject3.test2 )" value = "click">
</form>
項目数をカウントする
var count = 0;
for (var k in json) {
count++;
alert(count + ":" + k + ":" + eval("myJSONObject3." + k));
}
**jQuery / Ajax
[[jQueryのAjax 1 - ［JavaScript］All About>>http://allabout.co.jp/internet/javascript/closeup/CU20090315A/]]
|Ajax Requests の種類 |機能|
|ajax( options ) |HTTP通信でページを読み込みます。jQuery Ajax機能の基本メソッド。|
|load( url, data, callback ) |HTMLを読み込みDOMへ挿入します。|
|get( url, data, callback, type ) |HTTP通信のGETでページを読み込みます。|
|getJSON( url, data, callback ) |JSON データをHTTP通信のGETで読み込みます。|
|getScript( url, callback ) |HTTP通信のGETで、ローカルのJavaScriptファイルを読み込み実行する。|
|post( url, data, callback, type ) |JSON データをHTTP通信のPOSTで読み込みます。 |
|Ajax Events(グローバル)のタイプ |機能|
|ajaxComplete |Ajaxリクエストが完了(completes)で実行される。|
|ajaxError |Ajaxリクエストが失敗(error)で実行される。|
|ajaxSend |Ajaxリクエストが送信(send)される前に実行される。|
|ajaxStart |Ajaxリクエストがはじまり、アクティブになる前に実行される。|
|ajaxStop |すべてのAjaxリクエストが終わると実行される。|
|ajaxSuccess |Ajaxリクエストが成功(success)で実行される。|
|Ajax Events(ローカル)のタイプ |機能|
|beforeSend |Ajaxリクエストが送信される前に実行される。|
|success |Ajaxリクエストが受信が成功した時に実行される。|
|error |Ajaxリクエストが受信が失敗した時に実行される。|
|complete |Ajaxリクエストが通信完了時に、リクエストの成功/失敗にかかわらず実行される。 |
**IE8 情報バーを消す方法
javascriptのテスト中は邪魔くさいので消してしまいましょう
「ツール」→「インターネットオプション」→「詳細設定」→「セキュリティ」
→「マイコンピュータのファイルでのアクティブコンテンツの実行を許可する」をチェック
**クロージャ
[[猿でもわかるクロージャ超入門 まとめ - DQNEO起業日記>>http://dqn.sakusakutto.jp/2009/01/javascript_5.html]]
関数を定義する方法その１ (普通のやり方)
<script>
function speak(){ alert("hello"); }
speak(); // "hello"と出力
</script>
関数を定義する方法その２ (無名関数を使う)
<script>
var speak = function (){ alert("hello"); }
speak(); // "hello"と出力
</script>
無名関数を定義してすぐさま実行する
<script>
( function(){ alert("hello"); } )(); // "hello"と出力
</script>
関数を返す関数
<script>
function outer(){
var inner = function (){ // 無名関数を定義してinnerに代入
alert("hello");
}
return inner; // inner関数を返す
}
var f = outer(); // outre関数は戻り値としてinner関数を返す。それがfに代入される。
f(); // "hello"と表示。inner() が実行されたのと同じ効果がある。
</script>
無名関数を定義してそのままreturnする
function outer(){
return function (){ // 無名関数を定義してすぐreturn
alert("hello");
};
}
var f = outer(); // onter内で定義した無名関数がfに代入される。
f(); // "hello"と表示。
</script>
↓
function outer(){
var x = "hello";
return function (){
alert(x);
};
}
var f = outer();
f(); // "hello"と表示。
</script>
状態を保持する関数「クロージャはオブジェクトに似ている」
<script>
function outer(){
var x = 1;
return function (){
alert(x);
x = x + 1;
};
}
var f = outer();
f(); // 1
f(); // 2
f(); // 3
</script>
----
// アクセス解析
#include_js(http://www.research-artisan.com/userjs/?h=2&user_id=20091024006000857)
*&this_page() ～JavaScriptライブラリ～
**prototype.js
参考：[[prototype.jsを読み解く｜gihyo.jp … 技術評論社>>http://gihyo.jp/dev/feature/01/prototype/0001]]
**jQuery
参考：[[jQueryの魔法 -［JavaScript］All About>>http://allabout.co.jp/internet/javascript/closeup/CU20071020A/]]
**参考になるページ
[[2008年に注目を集めた使えるJavaScriptライブラリ集:phpspot開発日誌>>http://phpspot.org/blog/archives/2009/01/2008javascript.html]]
[[JavaScript Library Archive>>http://javascript.webcreativepark.net/]]
[[Ajax (JavaScript) Library List (Ajaxライブラリ一覧)>>http://www.openspc2.org/JavaScript/Ajax/Library/index.html]]
**Ajax
[[Ajaxはじめの一歩 XMLHttpRequest - ［JavaScript］All About>>http://allabout.co.jp/internet/javascript/closeup/CU20050515A/index.htm]]
var httpObj = XMLHttpRequest();
httpObj.open("GET","data.txt",true);
**JSON
[[JSON/簡単なテスト:基本>>http://jsgt.org/ajax/ref/test/json/test1.htm]]
JSON (JavaScript Object Notation) とは、テキスト形式の構造化データフォーマットです。
<script language = "JavaScript">
<!--
var myJSONObject3 =
{
"test1": "hello1",
"test2": "hello2",
"test3": "hello3"
}
//-->
</script>
<form>
myJSONObject3オブジェクトのtest2プロパティを取り出します
<input type = "button" onclick = "alert( myJSONObject3.test2 )" value = "click">
</form>
項目数のカウント・中身の表示
var count = 0;
for (var k in myJSONObject3) {
count++;
alert(count + ":" + k + ":" + eval("myJSONObject3." + k));
}
**jQuery / Ajax
[[jQueryのAjax 1 - ［JavaScript］All About>>http://allabout.co.jp/internet/javascript/closeup/CU20090315A/]]
|Ajax Requests の種類 |機能|
|ajax( options ) |HTTP通信でページを読み込みます。jQuery Ajax機能の基本メソッド。|
|load( url, data, callback ) |HTMLを読み込みDOMへ挿入します。|
|get( url, data, callback, type ) |HTTP通信のGETでページを読み込みます。|
|getJSON( url, data, callback ) |JSON データをHTTP通信のGETで読み込みます。|
|getScript( url, callback ) |HTTP通信のGETで、ローカルのJavaScriptファイルを読み込み実行する。|
|post( url, data, callback, type ) |JSON データをHTTP通信のPOSTで読み込みます。 |
|Ajax Events(グローバル)のタイプ |機能|
|ajaxComplete |Ajaxリクエストが完了(completes)で実行される。|
|ajaxError |Ajaxリクエストが失敗(error)で実行される。|
|ajaxSend |Ajaxリクエストが送信(send)される前に実行される。|
|ajaxStart |Ajaxリクエストがはじまり、アクティブになる前に実行される。|
|ajaxStop |すべてのAjaxリクエストが終わると実行される。|
|ajaxSuccess |Ajaxリクエストが成功(success)で実行される。|
|Ajax Events(ローカル)のタイプ |機能|
|beforeSend |Ajaxリクエストが送信される前に実行される。|
|success |Ajaxリクエストが受信が成功した時に実行される。|
|error |Ajaxリクエストが受信が失敗した時に実行される。|
|complete |Ajaxリクエストが通信完了時に、リクエストの成功/失敗にかかわらず実行される。 |
**IE8 情報バーを消す方法
javascriptのテスト中は邪魔くさいので消してしまいましょう
「ツール」→「インターネットオプション」→「詳細設定」→「セキュリティ」
→「マイコンピュータのファイルでのアクティブコンテンツの実行を許可する」をチェック
**クロージャ
[[猿でもわかるクロージャ超入門 まとめ - DQNEO起業日記>>http://dqn.sakusakutto.jp/2009/01/javascript_5.html]]
関数を定義する方法その１ (普通のやり方)
<script>
function speak(){ alert("hello"); }
speak(); // "hello"と出力
</script>
関数を定義する方法その２ (無名関数を使う)
<script>
var speak = function (){ alert("hello"); }
speak(); // "hello"と出力
</script>
無名関数を定義してすぐさま実行する
<script>
( function(){ alert("hello"); } )(); // "hello"と出力
</script>
関数を返す関数
<script>
function outer(){
var inner = function (){ // 無名関数を定義してinnerに代入
alert("hello");
}
return inner; // inner関数を返す
}
var f = outer(); // outre関数は戻り値としてinner関数を返す。それがfに代入される。
f(); // "hello"と表示。inner() が実行されたのと同じ効果がある。
</script>
無名関数を定義してそのままreturnする
function outer(){
return function (){ // 無名関数を定義してすぐreturn
alert("hello");
};
}
var f = outer(); // onter内で定義した無名関数がfに代入される。
f(); // "hello"と表示。
</script>
↓
function outer(){
var x = "hello";
return function (){
alert(x);
};
}
var f = outer();
f(); // "hello"と表示。
</script>
状態を保持する関数「クロージャはオブジェクトに似ている」
<script>
function outer(){
var x = 1;
return function (){
alert(x);
x = x + 1;
};
}
var f = outer();
f(); // 1
f(); // 2
f(); // 3
</script>
----
// アクセス解析
#include_js(http://www.research-artisan.com/userjs/?h=2&user_id=20091024006000857)
表示オプション
横に並べて表示：
変化行の前後のみ表示：
