Как перезагрузить измененный файл с помощью программы чтения файлов, нажав кнопку?

#javascript #html #filereader

Вопрос:

У меня есть следующий код:

 function loadFile() {
  const content = document.getElementById("file").files[0];
  const reader = new FileReader();
  reader.onloadend = async ({ target }) => {
    const text = target.resu<
    document.getElementById("content").innerText = text;
  };
  reader.readAsText(content, "utf-8");
} 
 <!DOCTYPE html>
<html>
<body>
  <div>
    <input id="file" type="file" />
    <button onclick="loadFile()">Load</button>
  </div>
  <pre id="content" style="border: 1px solid black;"></pre>
</body>
</html> 

Я хочу, чтобы при нажатии кнопки «Загрузить» снова загружался один и тот же файл после его изменения на диске без необходимости прикасаться к <input> нему . Возможно ли это?


Подробное описание

Действия, которые необходимо предпринять

  1. Выберите текстовый файл с <input> элементом
  2. Нажмите «Загрузить», и появится содержимое файла
  3. Измените файл на диске. Например, откройте Блокнот, внесите изменения и сохраните его
  4. Снова нажмите «Загрузить».

Текущее поведение

Загруженный контент исчезает, <pre> становится пустым.

Ожидаемое поведение

Должно появиться новое содержимое после шага 3.

Окружающая среда

Microsoft Edge 91.0.864.67 / Google Chrome 91.0.4472.124 (не совсем отличается)