利用 load() 方法引入重複代碼文件

爲了避免多頁面情形下的代碼重複,可以利用 load() 方法,將重複的部分(例如導航欄)放入單獨的文件,使用下列方法進行導入:
1、simple.html爲導入的文件;
2、避免同源策源,請在服務器端打開;

<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width,initial-scale=1.0,maximum-scale=1.0">
  <title>Document</title>
  <style>

  </style>
</head>

<body>
  <div class="include" file="./simple.html"></div>
  <script src="https://unpkg.com/vue/dist/vue.js"></script>
  <script type="text/javascript" src="https://code.jquery.com/jquery-3.2.1.min.js"></script>
  <script>
  $(".include").each(function() {
    if (!!$(this).attr("file")) {
      $(this).load($(this).attr("file"))
    }
  });
  </script>
</body>

</html>
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章