в настоящее время есть это в моем html, где тип ввода = текст, и я ввожу изображение через URL, но я хочу иметь возможность изменить это на файл или изображение и загрузить изображение и отобразить это изображение в сети приложение в настоящее время моя функция не поддерживает это кто-нибудь знает, как я мог выполнить sh это? (я довольно плохо знаком с javascript btw) obvs: я не хочу хранить что-либо на сервере, я просто хочу загрузить изображение и предварительно просмотреть его в моем веб-приложении
HTML
<body>
<div id="backdrop"></div>
<div class="modal" id="add-modal">
<div class="modal__content">
<label for="title">Tooling ID</label>
<input type="text" name="title" id="title" />
<label for="image-upload">Image Upload</label>
<input type="text" id="image-upload" name="image-upload"/>
<label for="severity">Severity Rating</label>
<input
type="number"
step="1"
max="10"
min="1"
name="severity"
id="severity"
/>
</div>
**Javascript**
const renderNewIssueElement = (id, title, imageUpload, severity) => {
const newIssueElement = document.createElement('li');
newIssueElement.className = 'issue-element';
newIssueElement.innerHTML = `
<div class="issue-element__image">
<img src="${imageUpload}" alt="${title}">
</div>
<div class="issue-element__info">
<h2>${title}</h2>
<p>${severity}/10 severity</p>
</div>
`;
newIssueElement.addEventListener(
'click',
startDeleteIssueHandler.bind(null, id)
);
const listRoot = document.getElementById('issue-list');
listRoot.append(newIssueElement);
};
так выглядит приложение в настоящее время с вложенным изображением URL