Rumah > Soal Jawab > teks badan
P粉4666433182023-08-15 14:26:12
Tidak benar..
Ia adalah pemilih kendiri, tidak digabungkan dengan kelas. Dalam peraturan anda, ia hanya perlu memenuhi kedua-dua pemilih, jadi jika :nth-child(even)
表格行也有.row
kelas, ia akan ditunjukkan.
P粉5634465792023-08-15 11:04:17
Ini adalah soalan yang sangat biasa yang timbul daripada salah faham tentang cara :nth-child(An+B)
和:nth-of-type()
berfungsi.
Dalam tahap pemilih 3, :nth-child()
kelas palsu mengira kedudukan antara semua adik-beradik di bawah elemen induk yang sama, bukan hanya yang sepadan dengan pemilih yang lain.
Begitu juga, :nth-of-type()
pseudo-classmengira adik beradik yang ia berkongsi jenis elemen yang sama, yang dalam HTML ialah tandatangan penunjuk, bukan pemilih yang lain.
Ini juga bermakna jika semua elemen anak daripada elemen induk yang sama adalah daripada jenis elemen yang sama, contohnya badan jadual dengan elemen tr
元素或列表元素只有li
元素,那么:nth-child()
和:nth-of-type()
的行为将是相同的,即对于每个An+B的值,:nth-child(An+B)
和:nth-of-type(An+B)
sahaja atau elemen senarai dengan elemen li
sahaja, maka tingkah laku
akan menjadi sama , iaitu, untuk setiap nilai An+B, :nth-child(An+B)
dan :nth-of-type(An+B)
akan sepadan dengan set elemen yang sama. :nth-child()
和:not()
Malah, semua pemilih mudah dalam pemilih kompaun tertentu, termasuk dan kelas pseudo seperti :not()
, berfungsi secara bebas dan bukannya dilihat oleh pemilih Selebihnya padanan
elemen. Ini juga bermakna bahawa dalam setiap pemilih kompaun individu tidak ada konsep susunan antara pemilih mudah
1, yang bermaksud contohnya dua pemilih berikut adalah setara:
table.myClass tr.row:nth-child(odd) table.myClass tr:nth-child(odd).row
Diterjemah ke dalam bahasa Inggeris, semuanya bermaksud:
(Anda akan perasan saya menggunakan senarai tidak tersusun di sini, hanya untuk menekankan perkara itu)
:nth-child(An+B of S)
Pemilih tahap 4 cuba membetulkan pengehadan ini dengan membenarkan
menerima hujah pemilih sewenang-wenangnya S, disebabkan pemilih yang beroperasi secara bebas dalam pemilih kompaun, seperti yang ditentukan oleh sintaks pemilih sedia ada. Jadi dalam kes anda ia akan kelihatan seperti ini:
table.myClass tr:nth-child(odd of .row)
Sudah tentu, sebagai cadangan yang sama sekali baru dalam spesifikasi yang sama sekali baru, ini mungkin tidak akan dilaksanakan sehingga
. tr
):
$('table.myClass').each(function() { // 注意,令人困惑的是,jQuery的过滤伪类是从0开始索引的,而CSS的:nth-child()是从1开始索引的 $('tr.row:even').addClass('odd'); });CSS yang sepadan untuk
ialah:
table.myClass tr.row.odd { ... }
Jika anda menggunakan alat ujian automatik seperti Selenium, atau menggunakan alat seperti BeautifulSoup untuk menghuraikan HTML, kebanyakan alatan ini membenarkan penggunaan XPath sebagai alternatif:
//table[contains(concat(' ', @class, ' '), ' myClass ')]//tr[contains(concat(' ', @class, ' '), ' row ')][position() mod 2)=1]
🎜Penyelesaian lain menggunakan teknik yang berbeza dibiarkan sebagai latihan kepada pembaca; ini hanyalah contoh ringkas dan disengajakan. 🎜1 Jika jenis atau pemilih universal ditentukan, ia mesti didahulukan. Walau bagaimanapun, ini tidak mengubah kerja asas pemilih;
2 pada asalnya dicadangkan sebagai lanjutan daripada :nth-match()
,然而,因为它仍然只计算相对于其同级元素,而不是与满足给定选择器的每个其他元素,所以自2014年以来,它已被重新用作现有的:nth-child()
.