私は静的HTMLファイルを持っていますが、それぞれ次のようになります。HTML内から外部ファイルを読み込む方法は？

<!DOCTYPE html> 
<html> 
<head> 
    <title></title> 
    <meta charset="utf-8" /> 
    <style type="text/css"> 
    p { 
     width: 100px; 
    } 
    </style> 
    <link rel="stylesheet" href="//code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css"> 
    <script src="https://code.jquery.com/jquery-1.12.4.js"></script> 
    <script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script> 
    <script> 
     $(function() { 
      $("#accordion").accordion(); 
     }); 
    </script> 
</head> 
<body> 
    <div id="accordion"> 
     <h1>Chapter 1</h1> 
     <p>dul tank ksk sk skek kejk jk sk sksjk sdsfkdsfs ai nvnei kdsfue v sjksfspas ksdsjkfs fsakd;afksajf;akd fa</p> 
     <h1>Chapter 2</h1> 
     <p>dul tank ksk sk skek kejk jk sk sksjk sdsfkdsfs ai nvnei kdsfue v sjksfspas ksdsjkfs fsakd;afksajf;akd fa</p> 
    </div> 
</body> 
</html>

<meta charset="utf-8" /> 
    <style type="text/css"> 
    p { 
     width: 100px; 
    } 
    </style> 
    <link rel="stylesheet" href="//code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css"> 
    <script src="https://code.jquery.com/jquery-1.12.4.js"></script> 
    <script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script> 
    <script> 
     $(function() { 
      $("#accordion").accordion(); 
     }); 
    </script>

は、共通のコードですので、私はそれを抽出し、common.htmlという名前の新しいファイルに入れたいです。

質問

私はlinkタグで負荷common.htmlを試してみたが、それは奇妙な出力を生成します。

<!DOCTYPE html> 
<html> 
<head> 
    <title></title> 
    <meta charset="utf-8" /> 
    <link rel="import" href="common.html"/> 
</head> 
<body> 
    <div id="accordion"> 
     <h1>Chapter 1</h1> 
     <p>dul tank ksk sk skek kejk jk sk sksjk sdsfkdsfs ai nvnei kdsfue v sjksfspas ksdsjkfs fsakd;afksajf;akd fa</p> 
     <h1>Chapter 2</h1> 
     <p>dul tank ksk sk skek kejk jk sk sksjk sdsfkdsfs ai nvnei kdsfue v sjksfspas ksdsjkfs fsakd;afksajf;akd fa</p> 
    </div> 
</body> 
</html>

適切な読み込み方法は何ですか？

出典

2017-02-13 Artificial Stupidity