1．部品の読み取り、書き換え

XULはXMLの形式で書かれるため、HTML(XML)を扱うためのjavascript命令が使えます。基本的にgetElementByIdでidから部品を取得し、プロパティの読み書きを行います。Extension Developer's Extensionの「ツール」-「Extension Developer」-「XUL Editor」に以下のコードを貼り付けて試してください。

<?xml version="1.0"?>
<?xml-stylesheet href="chrome://global/skin/" type="text/css"?>
<window id="yourwindow" xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul">
<script type="text/javascript">
<![CDATA[
function setText(){
    var tb1=document.getElementById("tb1");//テキストボックスの取得
    var label1=document.getElementById("label1");//ラベルの取得
    var text=tb1.value;//テキストボックスのvalueプロパティでテキストを取得
    label1.value=text;//ラベルのvalueプロパティにテキストをセット。
}
]]>
</script>
<vbox>
<hbox>
<textbox id="tb1" />
<button id="button1" label="テキストボックスの中身を表示" oncommand="setText();"/>
</hbox>
<label id="label1" />
</vbox>
</window>

プロパティ、そしてメソッドとして何を使えるかはリファレンス（例：テキストボックス）に書いてあります。リファレンスの「属性」に書かれてる項目はgetAttributeやsetAttribute命令で読み書きができます。

他にもcreateElementやappendChildなどでもHTMLと同じように扱えます（参考：XUL Tutorial:Modifying a XUL Interface）。

実際にアドオンを使うときはjavascript部分は別のファイルに移してインポートする形になります。

2．部品のレイアウト

部品の簡単なレイアウトはvbox,hboxで行えます。それぞれ内部の部品を垂直、水平方向に並べます（上記コード参照）。

レイアウトについての詳細な説明はXUL Tutorial:Using Spacers（空白をあけるのに使用）やXUL Tutorialの「ボックスモデル」〜「その他のレイアウト要素」の辺りを見てください。

3．ウィンドウの作成

window.open(chromeアドレス, ウインドウ名, features);で行います。詳細は XUL Tutorial:Creating a Windowを参照

4.その他

XULについてはここでは書ききれないので、公式のXUL、特にXUL Tutorialを見てください。