HTML DOM имеет данные, которые я не добавил через Javascript - PullRequest
Новая
       64

HTML DOM имеет данные, которые я не добавил через Javascript

0 голосов
/ 14 апреля 2020

Я сгенерировал свой заголовок из JavaScript данных.

Для генерации я перебираю объект.

Генерация HTML выглядит следующим образом: 

for (const topic in templateTopic) {
  if (Object.prototype.hasOwnProperty.call(templateTopic, topic)) {
    const element = templateTopic[topic]
    // console.log(element);
    template += '<div class="col col-topic-element" id="' + element + '" onClick="filterTopic(' + element + ')">'
    template += '<p>' + element + '</p>'
    template += '</div>'
  }
}
parent.innerHTML = '';
parent.insertAdjacentHTML('afterbegin', template);

Когда я проверяю элемент, он содержит следующие странные данные ( Chrome Выход инспектора ): 

<div id="topics" class="row">
  <div class="col col-topic-element" id="film" onclick="filterTopic(film)">
    <p>film</p>
  </div>
  <div class="col col-topic-element" id="photography" onclick="filterTopic(photography)">
    <p>photography</p>
  </div>
  <div class="col col-topic-element" id="visual design" onclick="filterTopic(visual design)" data-kwdiaostructure="&quot;0&quot;:&quot;input&quot;,&quot;1&quot;:&quot;submit@visual design@@col col-topic-element@@@@KwDiaoTagDIV&quot;,&quot;2&quot;:&quot;visual design&quot;"
    data-kwdiaohashid="input@submit@visual design@@col col-topic-element@@@@KwDiaoTagDIV@visual design">
    <p>visual design</p>
  </div>
</div>

Как мне избавиться от данных, потому что когда я нажимаю на последний элемент («визуальный дизайн»), консоль выдает ошибку, и я не могу добавить дальнейший код.

Вывод на консоль после нажатия на 3 сгенерированных элемента:

Console Output

Я интегрировал Bootstrap 4 CDN и fontawesome.

...