Как создать массив объектов?

Question

[Waksim]

Всем привет, имеется вот такой html код:

<a href="https://site.ru/number-1" class="btn27" title="Номер 1">Ex.1</a>
<a href="https://site.ru/number-2" class="btn27" title="Номер 2">Ex.2</a>
<a href="https://site.ru/number-3" class="btn27" title="Номер 3">Ex.3</a>
<a href="https://site.ru/number-4" class="btn27" title="Номер 4">Ex.4</a>
...

Ссылок btn27 на странице около 500, необходимо поместить их в массив объектов:

var links = []; 
 
links[0] = {
    html: "Ex.1",    /*Сюда записывается текст ссылки*/
    src: "https://site.ru/number-1",    /*Здесь адрес*/
    title: "Номер 1"    /*Тут описание*/
}
links[1] = {
    html: "Ex.2",
    src: "https://site.ru/number-2",
    title: "Номер 2"
}
...

Как сделать так, чтобы при загрузки страницы в массив links добавились все ссылки btn27?
В итоге, команда alert( links[54].title ) должна вывести значение title 55ой по счёту ссылки класса btn27, аналагично с links[54].scr и html .
В сети не нашёл нужной информации и решил обратиться сюда, заранее спасибо!

Answer 1

[warlordNazar]

Ну смотрите, для начала выберем эти ссылки. Пототм переберем и заполним массив.

const links = document.querySelectorAll('a.btn27');
const arr = [];
links.forEach(c => {
    arr.push({
        html: c.innerHTML,    /*Сюда записывается текст ссылки*/
        src: c.getAttribute('src'),    /*Здесь адрес*/
        title: c.getAttribute('title')    /*Тут описание*/
    })
});

Comments

[Даниил Попов]

Такая же петрушка сразу на ум пришла

[Waksim]

Большое спасибо, вы очень помогли))

[Данакт Фрост]

Атрибута «src» нет у ссылок

Answer 2

[Данакт Фрост]

const listOfBtn27 = [].slice.call(document.getElementsByClassName('btn27'))
const links = listOfBtn27.map(link => ({
    html:   link.textContent,
    src:    link.href,
    title:  link.title,
}))

console.log(links)

Comments

[Waksim]

Спасибо), всё работает!!!

Answer 3

[4mobile]

var links = [];
$('.btn27').each(function(index, el) {
  links[index] = {
     html: $(el).text(), 
     src: $(el).attr('href'),
     title: $(el).attr('title')
 };
});

Comments

[Waksim]

Спасибо, выручили)!