идентификация первого экземпляра конкретного типа элемента во всем документе

obster:

, как можно использовать css или javaScript для целевого и стиля начального возникновения конкретного типа элемента по всему документу HTML, независимо от его размещения в структуре документа?

answer:

решения на основе CSS

, к сожалению, только CSS не обеспечивает функциональность, чтобы соответствовать первому появлению типа элемента по всему документу. The: Pseudo-Class первого типа, согласно спецификациям CSS, применяется только к первым сестрам его типа в его родительском элементе.

решений на основе JavaScript

1. : Emulation первого типа

] Используя JavaScript, мы можем достичь этой функциональности, введя пользовательский класс, «первый в своем типе» и используя метод QuerySelector () для извлечения первого соответствия Элемент желаемого типа. Затем мы присваиваем этот пользовательский класс полученному элементу:

document.querySelector('p').className  = ' first-of-type';

2. Пользовательская функция сопоставления

Мы также можем разработать пользовательскую функцию Javascript для идентификации и стиля первого появления конкретного типа элемента:

function nthIndexOfType(element, index) {
  var siblings = element.parentElement.children;
  var count = 1;
  for (var i = 0; i  
] Эта функция принимает два параметра: элемент, который мы хотим искать, и индекс вхождения, который мы хотим цель. Он итерации через все элементы брата и возвращает первый элемент указанного типа, применяя желаемый стиль. 
]