Есть ли способ, который позволяет мне загружать раздел, когда я нажимаю на около в панели навигации, используя ajax - PullRequest
0 голосов
/ 12 апреля 2020

Я пытаюсь загрузить раздел , когда я нажимаю на около в панели навигации, означает, что есть только домашний раздел, содержащий навигационную панель, и в панели навигации есть примерно, когда я нажимаю на него, появляется раздел о ,

вот код, который я написал.

если кто-то может написать код для меня, я буду благодарен.

<!DOCTYPE html>
    <html lang="en" dir="ltr">
    <head>
       <meta charset="utf-8">
      <title>Nitro</title>
      <link rel="stylesheet" href="css/main.css">
 </head>
<body>
    <header>
      <!-- start logo  -->
         <div class="header-logo">
         <p>Nitro</p>
     </div>
  <!-- end logo  -->

  <!-- start nav  -->
     <nav>
     <div class="nav-container">
   </div>
     <ul>
      <li><a href="#">home</a></li>
      <li><a href=""id="about">about us</a></li>
      <li><a href="#">products</a></li>
      <li><a href="#">services</a></li>
      <li><a href="#">blog</a></li>
      <li><a href="#">contact</a></li>
    </ul>
  </nav>

  <!-- end nav -->

  <div class="banner">
    <div class="banner-center">
      <!-- <img src="img/Walkerslogo.png" alt="img"> -->
      <h1>Welcome</h1>
      <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit,
        mollit anim id est laborum.</p>
        <button type="button" name="button" class="button">Touch</button>
    </div>
  </div>

</header>



  <div class="about-us">

  </div>

<!-- <section class="about-us" id="about"> -->
  <!-- <h2>About Me</h2>

  <div class="content">
    <img src="imgs/hero_1.jpg" alt="About Me">
    <p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Quo tempora cumque eligendi in 
    nostrum labore omnis quaerat. </p>
    <br><br>
    <div class="ulli">
    <ul>
                      <li>Officia quaerat eaque neque</li>
                      <li>Possimus aut consequuntur incidunt</li>
                      <li>Lorem ipsum dolor sit amet</li>
                      <li>Consectetur adipisicing elit</li>
      </ul>
      </div>
  </div> -->

<!-- </section> -->



<script type="text/javascript">
output = document.getElementsByClassName('about-us');
var linkClicked = document.getElementsById('about');
linkClicked.addEventListener('click',fuction()){
  loadData();
});
function loadData(){
      var request = new XMLHttpRequest();
      request.onreadtstatechange = function(){
        if (request.readystate == 4
            && request.status == 200) {
                output.innerHtml = request.responseText;
        }
      }
      request.open("GET","data.txt",true);
      request.send();
}

</script>


   </body>
</html>'''

последняя страница должно быть так

спасибо.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...