Разница между селекторами «nth-child()» и «nth-of-type()» в jQuery

В этой статье мы обсудим все различия между селекторами nth-child() и nth-of-type() в jQuery.

Селектор nth-child(): этот селектор используется для сопоставления элементов на основе их положения в группе братьев и сестер. Он соответствует каждому элементу, который является n-м дочерним элементом, независимо от типа его родителя.

Синтаксис:

:nth-child(number) {
    // CSS Property
}

Пример: В этом примере описывается использование селектора nth-child().

Выход:

Селектор nth-of-type(): этот селектор используется для стилизации только тех элементов, которые являются n-м числом дочерних элементов его родительского элемента. Любое n может быть числом, ключевым словом или формулой.

Синтаксис:

:nth-of-type(number) {
    // CSS Property;
}

Пример: В этом примере описывается использование селектора nth-of-type().

Выход:

Разница между селекторами nth-child() и nth-of-type():