回答編集履歴
1
:nth-of-type()
test
CHANGED
@@ -124,4 +124,62 @@
|
|
124
124
|
|
125
125
|
|
126
126
|
|
127
|
+
### :nth-of-type()
|
128
|
+
|
129
|
+
|
130
|
+
|
131
|
+
> jQueryのセレクターで、INPUT要素を
|
132
|
+
|
133
|
+
> "[name=ipt]:nth-of-type(1)"
|
134
|
+
|
135
|
+
> などと指定したいです。
|
136
|
+
|
137
|
+
|
138
|
+
|
139
|
+
:nth-of-type() の機能を誤認しています。
|
140
|
+
|
141
|
+
|
142
|
+
|
143
|
+
- [:nth-of-type() - CSS: カスケーディングスタイルシート | MDN](https://developer.mozilla.org/ja/docs/Web/CSS/:nth-of-type)
|
144
|
+
|
145
|
+
|
146
|
+
|
147
|
+
> :nth-of-type() は CSS の擬似クラスで、**兄弟要素のグループの中で指定された型 (タグ名) の要素**を、位置に基づいて選択します。
|
148
|
+
|
149
|
+
|
150
|
+
|
151
|
+
この場合は、タグ名を指定しなかったので、下記結果が返ってきます。
|
152
|
+
|
153
|
+
|
154
|
+
|
155
|
+
- [name=ipt] を持つ全ての要素を兄弟要素ごとにグループ化する
|
156
|
+
|
157
|
+
- グループ化された同じ兄弟要素郡の中で0番目のインデックスを持つ要素を参照します。
|
158
|
+
|
159
|
+
|
160
|
+
|
161
|
+
このセレクタで期待値を得るには、下記条件を満たす必要があります。
|
162
|
+
|
163
|
+
|
164
|
+
|
165
|
+
- input要素以外の [name=ipt] を満たす要素が存在しない
|
166
|
+
|
167
|
+
- 全ての [name=ipt] が一つの兄弟要素郡に存在している
|
168
|
+
|
169
|
+
|
170
|
+
|
171
|
+
前述の繰り返しになりますが、`:nth-of-type()`はDOM上から検索する機能に特化しており、検索結果をフィルタする機能を備えていません。
|
172
|
+
|
173
|
+
フィルタする考え方の延長線には `jQuery#filter` がありますが、0番目のインデックスを持つ要素を得るには大仰で、
|
174
|
+
|
175
|
+
|
176
|
+
|
177
|
+
- [.filter() | jQuery API Documentation](https://api.jquery.com/filter/)
|
178
|
+
|
179
|
+
|
180
|
+
|
181
|
+
要素ノードを一つだけ得るなら、`jQuery#get()`, `jQuery#eq()`, `jQueryObject[0]` の三択になると思います。
|
182
|
+
|
183
|
+
|
184
|
+
|
127
185
|
Re: miu_ras さん
|