配列

こちらでは、配列についての説明をします。

変数と同様、パラメータ内で定義するか、テンプレート内で定義するかによって、扱いが変わってきます。そのため、ここでも2つに分けて説明していきます。

パラメータ内で定義した変数

パラメータ内で定義した配列は“[ ]”内の添字によって要素を指定しアクセスします。

簡単な例として、変換したい元のウェブサイトのHTMLコードが次のようになっているとします。

<html>
    <body>
        <img src="image1.jpg" />
        <img src="image2.jpg" />
        <img src="image3.jpg" />
    </body>
</html>

このとき、パラメータに次のような記述をすることでimg要素のsrc属性が配列としてimage_listに代入されます。

image_list: {
    xpath: '//img',
    get:   '@src',
    list:  true
}

テンプレート上で、次のような利用が考えられます。

<img src="<!--{= $.image_list[1]}-->" />

2番目の画像を示す“image2.jpg”という文字列が展開されます。

注釈

なお、配列の添字は、Javascriptと同様、0からはじまることに気をつけてください。

テンプレート内で定義した配列

テンプレート内で新たに配列を導入する方法はJavascriptの場合と同じです。したがって、flamingo構文の中でvar文により配列変数の宣言を行います。

arrayという変数に“flamingo”, “ZEBRA”, “SMARTCONVERT”という3つの文字列を代入し、2つ目の要素を表示しています。

<!--{var array = ["flamingo", "ZEBRA", "SMARTCONVERT"] }-->
<!--{= array[1] }-->