Как получить список id элементов, имея их общий класс?

Question

[ince]

Как получить список id элементов, имея их общий класс?

Answer 1

[0xD34F]

const className = 'класс элементов, чьи id вам надо получить';

Как получить элементы, зная их класс:

const elems = document.querySelectorAll(`.${className}`);
// или
const elems = document.getElementsByClassName(className);

Как извлечь из элемента его id:

const getId = el => el.id;
// или
const getId = el => el.getAttribute('id');
// или
const getId = el => el.attributes.id.value;

Как собрать массив id:

const ids = Array.from(elems, getId);

// или

const ids = Array.prototype.map.call(elems, getId);

// или

const ids = [];
for (const n of elems) {
  ids.push(getId(n));
}

// или

const ids = [];
for (let i = 0; i < elems.length; i++) {
  ids[i] = getId(elems[i]);
}

Answer 2

[hzzzzl]

const ids = [...document.querySelectorAll('.className')]
  .map(tag => tag.id)
  .filter(id => id)    // убираем пустые "без id" по желанию

Comments

[ince]

Спасибо, работает. Подскажите, пожалуйста, что означает троеточие?

[Stalker_RED]

ince, spread operator

[hzzzzl]

ince, просто querySelectorAll() возвращает не массив, а так называемый NodeList, и вот так [...nodelist] можно просто сделать обычный js массив