同じ種類の兄弟要素を展開する略記の記述方法
同じ種類の兄弟要素を展開する略記の記述方法です。略記のフォーマット
略記のフォーマットは以下のようになります。
要素*要素数
1-1.略記の入力
ここでは例として、以下のように入力します。
li*3
1-2.略記の展開
略記を展開すると、以下のように要素が展開されます。
2-1.略記の入力
下位要素を展開する略記と組み合わせてみます。ここでは例として、以下のように入力します。
ul>li*3
2-2.略記の展開
略記を展開すると、以下のように要素が展開されます。
3-1.略記の入力
以前紹介したclass属性や任意の属性を展開する略記と組み合わせてみます。ここでは例として、以下のように入力します。
ul>li.clsli[myAttr=myAttr]*3
3-2.略記の展開
略記を展開すると、以下のように要素が展開されます。
属性の値に連番を展開する略記の記述方法
属性の値に連番を展開する略記の記述方法です。id属性のように、ドキュメント内で一意の値を設定しなければならない属性の値などで利用すると良いでしょう。
番号は「1」から始まります。
略記のフォーマット
番号に置き換えたい箇所に「$」を記述します。「$」を連続で複数記述すると、0埋めを行います。
1-1.略記の入力
ここでは例として、以下のように入力します。
ul>li#li_$*3
1-2.略記の展開
略記を展開すると、以下のように要素が展開されます。id属性に番号が展開されています。
2-1.略記の入力
任意の属性を展開する略記と組み合わせてみます。ここでは例として、以下のように入力します。
ul>li#li_$[myattr=myAttr_$]*3
2-2.略記の展開
略記を展開すると、以下のように要素が展開されます。id属性とmyattr属性に番号が展開されています。
3-1.略記の入力
ここでは例として、0埋めで記述してみます。以下のように入力します。
div#i$-test.class$$$*3
3-2.略記の展開
略記を展開すると、以下のように要素が展開されます。class属性の値が、0埋めになっています。
