În această lecție, vom învăța cum să găsim elementele de pe pagină după atribut.
În jQuery, selecția elementelor după atribut este efectuată în conformitate cu specificația CSS.
Când utilizați atribute pentru a selecta elemente, considerați că unele atribute pot avea mai multe valori separate de un spațiu.
Valoarea atributului în expresia selector trebuie să fie cuprinsă în ghilimele. Acest lucru se face într-unul din următoarele moduri:
- citate în interiorul cotelor unice: $ ('a # 91; rel = "nofollow" # 93;').
- citate în citate duble: $ ("# 91; rel = 'nofollow' # 93;").
- Citezări unice în citate simple: $ ('a # 91; rel = \' nofollow \ '# 93;').
- Citate duble protejate în interiorul citatelor duble: $ ("a # 91; rel =" nofollow "# 93;").
În jQuery, puteți căuta elemente după atribute folosind selectori diferiți. În plus, puteți utiliza o combinație de mai mulți selectori de atribute pentru a selecta elemente. În acest caz vor fi selectate numai acele elemente care corespund fiecăruia dintre acești selectori.
jQuery - Selectori pentru a căuta elemente după atribut
# 91; nume | = "valoare" # 93; - selectează elemente care au atributul (nume) specificat cu o valoare egală cu șirul (valoarea) specificat sau începând cu acest șir (valoare), urmată de o cratimă.
De exemplu, selectați toate elementele div. care au un atribut de clasă cu o valoare egală cu alerta sau începând cu alertă.
# 91; nume * = "valoare" # 93; - - selectează elementele care au atributul (nume) specificat cu o valoare care conține substringul (valoarea) specificat.
De exemplu: selectați toate elementele care au atributul href care conține substringul YouTube ca valoare:
= "valoare" # 93; - selectează elementele care au numele de atribut specificat cu o valoare care conține valoarea specificată ca fiind una din valorile sale (adică separată de o altă valoare de un spațiu) sau egală cu această valoare.
De exemplu, selectați toate elementele unui. care au un atribut de clasă cu o valoare care conține btn ca una dintre valorile sale (adică separate de altă valoare de un spațiu) sau egală cu btn:
# 91; nume $ = "valoare" # 93; - selectează elementele care au atributul (nume) specificat cu o valoare care se termină cu valoarea specificată.
De exemplu, selectați toate elementele care au atributul href. terminând cu ".zip".
# 91; nume = "valoare" # 93; - selectează elementele ale căror atribut (nume) este specificat.
De exemplu, selectați toate elementele care atributul type cu valoarea butonului:
# 91; nume! = "Valoare" # 93; - selectează elementele care nu au atributul (nume) specificat sau au atributul (numele) specificat, dar nu conține o valoare specificată.
De exemplu, selectați elementele a. care nu au atributul rel sau nu, dar nu conține valoarea nofollow.
# 91; nume ^ = "valoare" # 93; - selectează elementele care au atributul (nume) specificat cu o valoare care începe cu o valoare specificată.
De exemplu, selectați toate elementele unui. având btn de clasă și atributul href cu o valoare care începe cu "http".
# 91; numele # 93; - selectează elementele care au atributul specificat (nume). Valoarea acestui atribut (nume) poate fi oricare.
De exemplu, selectați imagini (img) care au atributul alt:
# 91; name1 = "Valoare1" # 93; # 91; name2 = "Valoare2" # 93; - selectează elementele ale căror atribute specificate (nume1 și nume2) au valorile corespunzătoare (Valoare1 și Valoare2).
Dacă este necesar, puteți utiliza combinații de selectori de atribute pentru a selecta elemente. În acest caz, vor fi selectate numai elementele care se potrivesc tuturor selectorilor selectați:
De exemplu, selectați elementele a. având atributul id. atributul href pornind de la http și atributul de clasă cu o valoare care conține btn ca una dintre valorile sale sau egală cu btn: