Как перезагрузить / обновить HTML-файл из другого HTML-файла, используя JavaScript, когда определенное условие выполняется?

Question

здесь я пытаюсь продемонстрировать свою проблему, у меня есть один основной html-файл и два sub html-файла, включенные в основной файл, второй sub HTML-страница изначально невидима. Если значение, введенное в поле ввода первой sub html-страницы, равно 5, то второй sub html-файл становитсявидимый и первый sub файл скрыт.

document.getElementById('button').addEventListener('click',function(){
    //console.log(document.getElementById('input-box').value);
    if(document.getElementById('input-box').value == 5){
        document.getElementById('sub1').classList.add('none');
        //here before showing the div#sub2 part ,i would like to reload the aboutus.php or one js file aboutus.js
        document.getElementById('sub2').classList.remove('none');
    
    }
});

.none{
  display:none;
}

#main{
  width:400px;
  height:200px;
  border:1px solid #000;
  display:flex;
  align-items:center;
  justify-content:center;
}

#main>div{
  width:200px;
  height:100px;
  border:1px solid #000;
}

<div id="main">
  <div id="sub1">
    <h7>page 1</h7>
    <input type="number" id="input-box"/>
    <button id="button">click</button>
  </div>
  <div id="sub2" class="none">
    <h7>page 2</h7>
    <?php include "aboutus.html"; ?>
  </div>
</div>

Я бы хотел добиться перезагрузки второй sub html-страницы один раз перед второй sub file is visible.because много изменений базы данных происходит во втором sub файле, и перезагрузка может решить эту проблему.

что я пробовал до сих пор, window.onload это будетне работает, потому что окно (второй вложенный файл) загружается изначально. window.location.reload() также не работает, потому что это можно использовать для перезагрузки того же файла. У кого-нибудь есть хитрости для решения этой проблемы?