SDKの導入
第1回の最後にSilverlightの開発にはSilverlight.jsを使うと説明しましたが，今回はそのSilverlight.jsを使ったSilverlightの表示を解説していきます。
まずは，以下のリンクよりSilverlightのSDKをダウンロードしてください。
このSDKはSilverlight 1.0用のSDKです。
ダウンロードが完了したら，ファイルを実行してインストールを行います。途中にVisual Studio 2005用のテンプレートをインストールするか確認されますが，連載では使用しませんので飛ばしても問題ありません。
SDKの中にはドキュメントやクイックスタート，ツールなどが含まれています。それではさっそくこのSDKに含まれているSilverlight.jsをつかってSilverlightを表示してましょう。Silverlight.jsはTools/Silverlight.jsフォルダにありますので，コピーして取り出しておいてください。
Silverlight.jsを使って表示する
前回の文字を表示するサンプルを，Silverlight.jsを使って表示するのと，htmlファイル中に書いていたXAMLを外部ファイルに変更していきます。
以下が前回のサンプルのソースコードです。ファイル名はindex.htmで保存されているものとして，解説していきます。
<html>
<head>
<title>Hello Silverlight</title>
<script type="text/xaml" id="xaml">
<?xml version="1.0"?>
<Canvas xmlns="http://schemas.microsoft.com/client/2007">
<TextBlock Text="Hello World" FontSize="25" />
</Canvas>
</script>
</head>
<body>
<object type="application/x-silverlight" width="200" height="200">
<param name="background" value="#FF0000" />
<param name="source" value="#xaml" />
</object>
</body>
</html>
まずは，さきほど取り出したSilverlight.jsをindex.htmと同じフォルダにコピーしてください。index.htmファイルのheader要素内にSilverliight.jsを読み込むためscriptタグを記述します。
<script type="text/javascript" src="Silverlight.js"></script>
次に，body要素以下のobject要素を削除して，変わりにdiv要素をagControlというid属性をつけて記述します。さらに今回のポイントであるSilverlight.jsに定義されているSilverlight.createObjectEx関数を使用して，Silverlightを表示するJavaScriptコードを記述します。ソースコードは以下のようになります。
<body>
<div id="agContainer"></div>
<script type="text/javascript">
Silverlight.createObjectEx({
source : "#xaml",
parentElement : document.getElementById("agContainer"),
id : "agControl",
properties : {
version : "1.0",
width : "200px",
height : "200px",
background : "#FF0000"
},
events : {
onLoad : null,
onError : null
}
});
</script>
</body>
では，ここでindex.htmファイルをブラウザで表示してみましょう。前回と同じように，赤い四角の中に「Hello World」という文字が表示されています。
Silverlight.createObjectEx関数はparentElementで指定された要素の下に，ブラウザに対応したSilverlightプラグインを書きだすための要素（object要素やembed要素）を出力します。この出力された要素はIEであればIE Developer ToolbarやFirefoxであればFirebugなどを使用して確認することができます。
