How to parse html div text to json-CodePudding

I try to parse data from html to json structure, but I get empty strings. I do it first time.

Here example of repeatable div block:

// I try get data with this javascript in browser

var divs = document.querySelectorAll(".col-md-12"),
  i = 0,
  jData = [];
for (var div of divs) {
  var vuzTitles = div.getElementsByTagName(".itemVuzTitle"),
    obj = {};
  for (var d of vuzTitles) {
    obj.title = d.innerText;
    var as = div.getElementsByTagName(".tooltipq");
    obj.scores = a.innerText;
  }
  jData.push(obj);
}
jData = JSON.stringify(jData);
console.log(jData);

<div >
  <div >
    <div >
      <a href="/vuz/5309">
        <img  src="https://vuzopedia.ru/storage/app/uploads/public/686/aa4/ced/thumb__74_74_0_0_auto.jpeg" data-src="https://vuzopedia.ru/storage/app/uploads/public/686/aa4/ced/thumb__74_74_0_0_auto.jpeg" data-srcset="https://vuzopedia.ru/storage/app/uploads/public/686/aa4/ced/thumb__74_74_0_0_auto.jpeg"
          alt="Логотип Реавиз в Москве" style="float: left; padding: 0 10px 0 0;max-width: 100px;max-height: 100px;" srcset="https://vuzopedia.ru/storage/app/uploads/public/686/aa4/ced/thumb__74_74_0_0_auto.jpeg">
        <div >
          Медицинский университет Реавиз в Москве
        </div>
      </a>
      <h6 ><a href="/vuz/5309/programs/bakispec">Программы</a> &nbsp;&nbsp;&nbsp;&nbsp; <a href="/vuz/5309/otziv">Отзывы</a> &nbsp;&nbsp;&nbsp;&nbsp; <a href="/vuz/5309/podrazdeleniya">Факультеты</a> &nbsp;&nbsp;&nbsp;&nbsp; <a href="/vuz/5309/voprosy">Задать вопрос</a></h6>
      <div >
        Лечебное дело, Стоматология, Фармация
        <div style="margin-top: 10px;">
          <div  aatrfch="vuz" vuz="5309" id="favv5309">Хочу поступить</div>
          <div  id="compare5309" compid="5309">Сравнить</div>
          <div id="optcompare5309" style="display: none;">
            <a href="/region/city//services/comparevuz" id="cllicomq5309" style="color: #f2f2f2;">
              <div  style="width: 170px; background: #F44336;">Посмотреть сравнение</div>
            </a>
            <div  id="cllicom5309" compid="5309" style="width: 170px; color: #f2f2f2; background: #F44336;">Убрать из сравнения</div>
          </div>
          <div id="optcompareelseone5309" style="display: none;">
            <a href="/region/city//services/comparevuz" style="color: #f2f2f2;">
              <div  style="width: 170px; background: #F44336;">Нужно добавить еще 1 вуз</div>
            </a>
          </div>
        </div>
      </div>
    </div>
    <div >
      <div >
        <div >
          <center>Стоимость (руб/год)</center>
        </div>
        <center><a >от 286000 <font >⃏</font>  <span >минимальная стоимость по вузу (руб/год)</span></a> <span ><a >2022<span >информация о минимальной стоимости за 2021-2022 год</span></a>
          </span>
        </center>
      </div>
      <div >
        <div >
          <center>Бюджет</center>
        </div>
        нет
      </div>
      <div >
        <div >
          <center>Платное</center>
        </div>
        <center><a >от 125<span >минимальный суммарный проходной балл на платное по вузу</span></a> <span ><a >2022<span >информация о платных местах за 2022 и минимальном проходном балле на платное за 2021 год, так как баллы за 2022 становятся известны только после окончания приемной кампании 2022 года</span></a>
          </span>
        </center>
        <center><a  style="font-size: 11px; color: gray;">670 мест<span >количество платных мест по вузу</span></a></center>
      </div>
    </div>
  </div>
  <div ></div>
</div>

But I get this:

[{},{},{},...,{},{},{}]

How I can get json text from classes .itemVuzTitle and .tooltipq to json structure with fields name like title and scores? Please, help with this question. It helps save a lot of hours of my life.

CodePudding user response：

class .col-md-12 is too common and may not contain .itemVuzTitle, you need to select class .itemVuzPremium as parent container

var jData = []
document.querySelectorAll(".itemVuzPremium").forEach(function(el) {
  var title = el.querySelector(".itemVuzTitle").textContent.trim(),
      score = el.querySelector(".tooltipq").textContent.match(/\d /)[0]; // extract digit only
    jData.push({title: title, score: score})
})
console.log(JSON.stringify(jData, false, 2))

output

[
  {
    "title": "Университет Синергия",
    "score": "80000"
  },
  {
    "title": "Российский новый университет",
    "score": "52000"
  },
  {
    "title": "Московский технический университет связи и информатики",
    "score": "64000"
  }
]