Вставить из файла текст в html

Question

У меня имеется файл, скажем data.txt, в котором находится таблица, разделенная символами "/", и выглядит она как-то так:

Фамилия1/Имя1/Логин1/Пароль1/
Фамилия2/Имя2/Логин2/Пароль2/

И также имеется документ html, в котором находится множество div classов, в которых уже и отображаются эти Фамилии, имена, логины и пароли. Выглядит он так:

<div class="post-masonry col-md-4 col-sm-6">
<div class="post-thumb">
    <img src="картинка.png" alt="">
    <div class="title-over">
        <h4>Фамилия1</h4>
    </div>
    <div class="post-hover text-center">
        <div class="inside">
            <a href="bd/index.html">
                <h3>Фамилия1</h3>
                <p>Имя1</p>
                <p>Логин1</p>
                <p>Пароль1</p>
            </a>
        </div>
    </div>
</div>

Вопрос заключается в следующем: Можно ли каким-то скриптом JS или кодом на Python получить таблицу, которая будет автоматически вставить в html в эти div классы данные из .txt файла, чтобы вручную не копировать/вставлять div class, и не заменять там нужные мне элементы от руки? Заранее спасибо.

Answer 1

Если на Node.js, то можно, например, так (скрипт и текстовый файл должны лежать в одной папке, там же появится файл с HTML).

Если разделители строк в файле у вас под Windows, замените .split('\n') на .split('\r\n').

const { readFileSync, writeFileSync } = require('fs');

const data = readFileSync('./data.txt', 'utf8')
  .split('\n')
  .map(str => str.split('/'));

const html = data.map(([surname, name, login, password]) => `
  <div class="post-masonry col-md-4 col-sm-6">
  <div class="post-thumb">
      <img src="картинка.png" alt="">
      <div class="title-over">
          <h4>${surname}</h4>
      </div>
      <div class="post-hover text-center">
          <div class="inside">
              <a href="bd/index.html">
                  <h3>${surname}</h3>
                  <p>${name}</p>
                  <p>${login}</p>
                  <p>${password}</p>
              </a>
          </div>
      </div>
  </div>
`).join('\n');

writeFileSync('./data.html', html);

БЛОГ НА HUSL

Вставить из файла текст в html

Ответы (1 шт):