Запись текста со страницы в .txt файл для скачивания

Пример:

Ссылка этой заметки:	https://atuin.ru/blog/zapis-teksta-so-stranicy-v-fajl-dlya-skachivaniya
Наименование:	Чудо-юдо прибор
Модель:	35567
Артикул:	56742-567
Цвет:	Зеленый
Цена:	199 999 руб.

При создании файла учитываются все отступы и переносы строк в коде внутри тега copytext

Стили таблицы и кнопки используются только для примера.

HTML:

В первой строке добавлена скрытая информация только для копирования

<table id="copytext">
	<tr style="display: none">
		<td>Ссылка для приобретения:</td>
		<td>https://site.ru/tovar/chudo/</td>
	</tr>	
	<tr>
		<td>Наименование:</td>
		<td>Чудо-юдо прибор</td>
	</tr>	
	<tr>
		<td>Модель:</td>
		<td>35567</td>
	</tr>
	<tr>
		<td>Артикул:</td>
		<td>56742-567</td>
	</tr>
	<tr>
		<td>Цвет:</td>
		<td>Зеленый</td>
	</tr>	
	<tr>
		<td>Цена:</td>
		<td>199 999 руб.</td>
	</tr>	
</table>

<td>Ссылка для приобретения:</td>

<td>https://site.ru/tovar/chudo/</td>

</tr>

<tr>

<td>Наименование:</td>

<td>Чудо-юдо прибор</td>

</tr>

<tr>

<td>Модель:</td>

</tr>

<tr>

<td>Артикул:</td>

</tr>

<tr>

<td>Зеленый</td>

</tr>

<tr>

</tr>

</table>

JS:

Сохранение происходит по нажатию на элемент с ID download

document.addEventListener('DOMContentLoaded', () => {
	let download = document.querySelector('#download');
	download.addEventListener('click', downloadText);
	function downloadText() {
		let copytext = document.querySelector('#copytext').textContent;
		let el = document.createElement('a');
		el.setAttribute('href', `data:text/plain;charset=utf-8,${encodeURIComponent(copytext)}`);
		el.setAttribute('download', 'text.txt');
		el.style.display = 'none';
		document.body.appendChild(el);
		el.click();
		document.body.removeChild(el);
	}
});

document.addEventListener('DOMContentLoaded', () => {

let download = document.querySelector('#download');

download.addEventListener('click', downloadText);

function downloadText() {

let copytext = document.querySelector('#copytext').textContent;

let el = document.createElement('a');

el.setAttribute('href', `data:text/plain;charset=utf-8,${encodeURIComponent(copytext)}`);

el.setAttribute('download', 'text.txt');

el.style.display = 'none';

document.body.appendChild(el);

el.click();

document.body.removeChild(el);

}

});

Станислав: 25.06.2022 в 01:47

Круто было бы, если бы был пример бланка с онлайн заполнением и после этого можно было вывести заполненный бланк на печать или на сохранение в Microsoft Word. Спасибо за ваши труды. Очень познавательный сайт с крутыми темами!

Ответить
- Alexander: 29.06.2022 в 09:59
  
  Я делал похожие документы, например вот
  Также добавлял запоминание полей формы и редактирование прямо на листе.
  Но это все муторный процесс 🙂
  Про сохранение в ворд все собираюсь тему сделать, никак руки не дойдут.
  
  Ответить
Данил: 03.04.2022 в 19:05

А возможно, сделать что-бы сохраняло в кодировки windows 1251?

Ответить
Миша: 03.10.2021 в 23:09

Интересное решение. Спасибо.

Ответить
Александр: 24.09.2021 в 18:56

А возможно такое же сделать для pdf?

Ответить
- Alexander: 27.09.2021 в 08:32
  
  html2pdf.js (о нем позже напишу в отдельной теме)
  или jsPDF (оно более сложное, но PDF делает не из картинки)
  
  Ответить
  - Владимир: 11.11.2022 в 19:46
    
    Есть контент по ним?
    
    Ответить

Пример:

HTML:

JS:

Смотрите также:

Добавить комментарий:

Комментарии: