javascript - 一个脚本加载多个 html 文件

Question

我有一个用于将 html 文件加载到我的页面的脚本。一切正常，但我想要一个类似“循环”的东西来加载我列表中的每个位置。

所以我有一个脚本

<script>
    $(document).ready(function(){
      $("#introduction").click(function(){
        $("#main_info").load("introduction.html");
      });
    });
    </script>

我从菜单“介绍”中加载了一个位置。

  <ul>
            <li><a href="#" id="home"><i class="home"></i>home</a></li>
            <li><a href="#" id="introduction"><i class="introduction"></i>introduction</a></li>
            <li><a href="#" id="structure"><i class="structure"></i>structure</a></li>
        </ul>

但是如何更改此脚本以尝试使用我的 UL LI A 中的每个位置？

就像当我单击带有 home 的 li 时，我将加载 home.html，introduction = Introduction.html 和 structure = structure.html??

标签： javascripthtml

Answer 1

尝试：

$("a").click(function (){
 $(this).find("i").load($(this).attr("id")+".html");
});