Как управлять DOM на чистом JavaScript?
Управление DOM с помощью JavaScript в современных браузерах и IE 11+
1. Используйте атрибут download
Добавление атрибута download к ссылке заставит браузер загрузить файл вместо перехода по ссылке. Обратите внимание, что атрибут download не поддерживается в IE 11.
<a href="/path/to/file" download>Download</a>
2. Запустите событие нажатия
Идея исходит из создания ссылки и запуска ее события click.
// Create a new link
const link = document.createElement('a');
link.download = 'file name';
link.href = '/path/to/file';
// Append to the document
document.body.appendChild(link);
// Trigger the click event
link.click();
// Remove the element
document.body.removeChild(link);
3. Скачать файл с сгенерированными данными
Обычно загружают файл с динамическими данными, такими как
- JSON
- текст
- картинка
Исходя из данных, мы можем превратить его в BLOB-объект, а затем вызвать событие click, как описано в предыдущем разделе. Следующий пример кода создает BLOB-объект JSON и загружает его:
const data = JSON.stringify({ 'message': 'Hello Word' });
const blob = new Blob([data], { type: 'application/json' });
// Create new URL
const url = window.URL.createObjectURL(blob);
// Create a link and trigger the download
...
// Free the URL created above
window.URL.revokeObjectURL(url);
Комментарии
Чтобы оставить комментарий, необходимо авторизоваться