JavaScript - Prototype をテスト
JavaScript フレームワークライブラリのテスト - Prototype
Prototype を参照
JavaScript ライブラリをテストするには、Web ページでそれを参照する必要があります。
ライブラリを参照するには、<script> タグを使用し、src 属性にライブラリの URL を設定します：
Prototype を参照
<!DOCTYPE html>
<html>
<head>
<script
src="https://cdn.staticfile.org/prototype/1.7.3/prototype.min.js">
</script>
</head>
<body>
</body>
</html>
Prototype の説明
Prototype が提供する関数により、HTML DOM プログラミングがより簡単になります。
jQuery と同様に、Prototype にも独自の $() 関数があります。
$() 関数は HTML DOM 要素の id 値（または DOM 要素）を受け取り、DOM オブジェクトに新しい機能を追加します。
jQuery とは異なり、Prototype には window.onload() を置き換える ready() メソッドはありません。その代わりに、Prototype はブラウザと HTML DOM に拡張機能を追加します。
JavaScript では、ウィンドウの読み込みイベントを処理する関数を割り当てることができます：
JavaScript 方式：
function myFunction()
{
var obj=document.getElementById("h01");
obj.innerHTML="Hello Prototype";
}
onload=myFunction;
同等の Prototype コードは異なります：
Prototype 方式：
function myFunction()
{
$("h01").insert("Hello Prototype!");
}
Event.observe(window,"load",myFunction);
Event.observe() は 3 つのパラメータを受け取ります：
- 処理したい HTML DOM または BOM（ブラウザオブジェクトモデル）オブジェクト
- 処理したいイベント
- 呼び出したい関数
Prototype をテスト
次の例を試してください：
Example
<!DOCTYPE html>
<html>
<script src="https://cdn.staticfile.org/prototype/1.7.3/prototype.min.js">
</script>
<script>
function myFunction()
{
$("h01").insert("Hello Prototype!");
}
Event.observe(window,"load",myFunction);
</script>
</head>
<body>
<h1 id="h01"></h1>
</body>
</html>
試してみる »
もう一度この例を試してください：
Example
<!DOCTYPE html>
<html>
<script src="https://cdn.staticfile.org/prototype/1.7.3/prototype.min.js">
</script>
<script>
function myFunction()
{
$("h01").writeAttribute("style","color:red").insert("Hello Prototype!");
}
Event.observe(window,"load",myFunction);
</script>
</head>
<body>
<h1 id="h01"></h1>
</body>
</html>
テストする »
上の例で見たように、jQuery と同じく、Prototype はチェーン構文を許可します。
チェーン（Chaining）は、同じオブジェクトに対して複数のタスクを実行するための便利な方法です。
その他の拡張機能