Résumé des méthodes JQuery pour obtenir des éléments

1. Description

Il existe deux façons d'obtenir des éléments : le sélecteur jQuery et la fonction de traversée jQuery. Dans cet article, nous partagerons avec vous un résumé de la méthode de jQuery. obtenir des éléments, j'espère que cela pourra aider tout le monde.

Faites une synthèse et consolidez vos connaissances.

2. Obtenir lui-même

1. Un seul sélecteur jQuery est nécessaire

选择器	实例	说明
#Id	$('#myId')	ID选择器： 可以获取到ID为“myId”的元素，区分大小写

Sélecteur

Instance

Description

#Id

$('#myId')

Sélecteur d'ID : vous pouvez obtenir l'ID en tant qu'élément de "myId" est sensible à la casse

2. Plusieurs combinaisons de sélecteurs jQuery 元素元素

选择器	实例	说明
.class	$('.myClass')	类选择器：可以获取到class为‘myClass’的所有元素
element	$('p')	获取所有的 元素
:header	$(':header')	获取所有的标题元素： ~
:animated	$(':animated')	获取所有的动画元素
:contains(text)	$('p:contains(Hello)')	获取所有包含文本为Hello的 元素，中间的文本区分大小写
:hidden	$(':hidden')	获取所有的隐藏元素：width和height为0、display:none、type=hidden、
[attribute]	$('[href]')	属性选择器：获取所有含有属性为href的元素
[attribute=value]	$('[href=a.html]')	=   获取所有带有属性href，并且值为a.html的元素 !=  获取所有带有属性href，并且值不等于为a.html的元素 $=  获取所有带有属性href，并且值以a.html结尾的元素 ^=  获取所有带有属性href，并且值以a.html开头的元素 ~=  获取所有带有属性href，并且值包含单词”a.html“的元素 *=  获取所有带有属性href，并且值包含文本”a.html“的元素
:input	$(':input')	获取所有input元素
:radio	$(':radio')	所有带有 type="radio" 的 input 元素 相似的有： :text、:chexbox、:password、:submit、:reset、:button、:file
:enabled	$(':enabled')	所有启用的input元素。 :disabled  则相反
:checked	$(':checked')	所有选中的input选择（单选框、复选框）
:gt(index)	$('p:gt(2)')	index从0开始，获取index大于（不包含）2的所有 元素
:lt(index)	$('p:lt(2)')	index从0开始，获取index小于（不包含）2的所有 元素
:even	$('tr:even')	所有偶数
:odd	$('tr:odd')	所有奇数

Divisé en deux parties : la première moitié obtient une collection d'éléments, et la seconde moitié peut être exactement un élément. En combinant les deux, vous pouvez obtenir les éléments souhaités.

1) Sélecteur de la première moitié

tr> impairs

Sélecteur	Instance	Description
. /td>	$('.myClass')	Sélecteur de classe : vous pouvez obtenir tous les éléments avec la classe 'myClass'
element td>	$('p')	Obtenir tous les éléments
:en-tête	$( ':header')	Obtenir tous les éléments d'en-tête : ~
:animated td>	$ (':animated')	Obtenir tous les éléments animés
:contains(text)	$('p:contains( Bonjour)')	Obtenir tous les éléments contenant le texte Bonjour, le texte du milieu est sensible à la casse
:hidden	$(':hidden')	Obtenir tous les éléments masqués : la largeur et la hauteur sont 0, display:none, type=hidden,
[attribut]	$('[href]')	Sélecteur d'attribut : obtenez tous les éléments avec l'attribut href
[attribut =value]	$('[href=a.html]')	= Récupère tous les attributs href , et l'élément dont la valeur est a.html != Récupère tous les éléments avec l'attribut href, et la valeur n'est pas égale à a.html $= Récupère tous les éléments avec l'attribut href, et les éléments dont la valeur se termine par a.html ^= Récupère tous les éléments avec l'attribut href et dont la valeur commence par a.html ~= Récupère tous les éléments avec l'attribut href et dont la valeur contient des éléments avec le mot "a.html" *= Récupère tous les éléments avec l'attribut href et la valeur contenant le texte "a.html"
:input	$ (':input')	Obtenir tous les éléments d'entrée
:radio	$(':radio')	Tous les éléments d'entrée avec type="radio" Les éléments similaires incluent : :text, :chexbox , :password, :submit, :reset, :button, :file
:enabled	$(':enabled') td>	Tous les éléments d'entrée activés. :disabled est l'opposé
:checked	$(':checked')	Toutes les sélections d'entrée sélectionnées (cases de boutons radio , case à cocher)
:gt(index)	$('p:gt(2)')	index Démarrage à partir de 0, récupère tous les éléments dont l'index est supérieur à (non compris) 2
:lt(index)	$('p : lt(2)')	L'index commence à 0 et obtient tous les éléments dont l'index est inférieur à (non compris) 2
: pair	$('tr:even')	Tous les éléments pairs
:impair	$('tr:odd')	Tous les éléments

🎜>

选择器	实例	说明
:first	$('p:first')	第一个 元素
:last	$('p:last')	最后一个 元素
:eq(index)	$("p:eq(1)")	第二个 元素，index从0开始

2) La seconde moitié du sélecteur : peut être précise à un certain élément Sélecteur Instance Description :first $('p:first') Le premier élément

:dernier$('p:last') Le dernier élément

element :eq( index) $("p:eq(1)") Le deuxième tbody>

3. Sélecteur jQuery + fonction de parcours

est également divisé en deux parties : la première moitié utilise le sélecteur pour obtenir un element Set, la seconde moitié utilise la fonction de parcours pour identifier avec précision un certain élément

1) La première moitié est la même que ci-dessus

2) La seconde moitié : la fonction de parcours

方法	描述
eq()	返回带有被选元素的指定索引号的元素
first()	返回被选元素的第一个元素
last()	返回被选元素的最后一个元素

3. Obtenez l'élément frère

Comme son nom l'indique : obtenez le . 🎜> frère de l' élément sélectionné élément. Tout d'abord, vous devez localiser l'élément (

a été résumé ci-dessus et ne sera pas répété

), puis obtenir ses éléments frères.

选择器	实例	说明
element + next	$('p + p')	每个p相邻的下一个 元素
element ~ siblings	$('p ~ p')	获取跟p同级的所有的 元素

1) Sélecteur

$( 'p ~ p')

Sélecteur

td>

Instance

Description

方法	描述
next()	返回被选元素的后一个同级元素
nextAll()	返回被选元素之后的所有同级元素
prev()	返回被选元素的前一个同级元素
prevAll()	返回被选元素之前的所有同级元素

élément + suivant

$( 'p + p')

L'élément

suivant adjacent à chaque p

élément ~ frères et sœurs

Obtenir tous les éléments

au même niveau que p

2) Fonction de traversée

tr>

Méthode td>	Description
next()	Renvoie l'élément frère suivant de l'élément sélectionné
nextAll()	Renvoie tous les éléments frères après l'élément sélectionné
prev( )	Renvoie l'élément frère précédent de l'élément sélectionné
prevAll()	Renvoie tous les éléments frères avant l'élément sélectionné Éléments de niveau

4. Obtenez l'élément parent

选择器	实例	说明
:parent	$('p:parent')	获取所有p元素的父级元素

Récupère l'élément

parent

de l'élément

sélectionné

1) Sélecteur

方法	描述
parent()	获取被选元素的父级元素
parents()	获取被选元素的所有祖先元素

Sélecteur

Instance

Description

:parent

$('p:parent')

Obtenir tous les éléments p L'élément parent de

2) Fonction de traversée

选择器	实例	说明
parent > child	$('p > p')	获取p直接子元素的所有 元素
parent descendant	$('p p')	获取p所有后代的 元素

5. Obtenez l'élément enfant

Obtenez le

de l'

élément sélectionné

方法	描述
children()	返回被选元素的所有直接子元素
contents()	返回被选元素的所有直接子元素(包含文本和注释节点)
find()	返回被选元素的后代元素

Enfant

élément

1) Sélecteur

Instance

appareil de sélection	Description
parent > 'p > p')	Récupère tous les éléments qui sont des éléments enfants directs de p
descendant parent	$('p p')	Récupère les éléments de tous les descendants de p

2) Fonction de traversée

Méthode	Description
children()	Renvoie tous les enfants directs éléments de l'élément sélectionné
contents()	Renvoie tous les éléments enfants directs de l'élément sélectionné (y compris les nœuds de texte et de commentaires)
find()	Renvoie les éléments descendants de l'élément sélectionné

Le contenu ci-dessus est un résumé de la méthode d'obtention d'éléments de JQuery. J'espère qu'il pourra aider tout le monde. Recommandations associées : Explication détaillée de l'instance de méthode jquery element index()utilisation de l'élément jquery, emballage de l'élément et insertion des attributs de l'élément Explication détailléeMéthode jquery pour obtenir la valeur de l'élément (éléments de formulaire courants)_jquery

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!