The Power of Web Components(hacks.mozilla.org)

  <script>
    function handleLoad(e) {
      console.log('Loaded import: ' + e.target.href);
    }
    function handleError(e) {
      console.log('Error loading import: ' + e.target.href);
    }
  </script>
  <link
    rel="import"
    href="example1.html"
   
   
  />
  <link
    rel="import"
    href="example2.html"
   
   
  />
  <link
    rel="import"
    href="example3.html"
   
   
  />
  <script>
    function importHtml(selector) {
      var content = document.querySelector(selector).import;
      var el = content.querySelector('.warning');
      document.body.appendChild(el.cloneNode(true));
    }
    
    importHtml('link[href="example1.html"]');
    importHtml('link[href="example2.html"]');
    importHtml('link[href="example3.html"]');
  </script>

  export async function importHtml(url) {
    try {
      let res = await fetch(url);
      let html = await res.text();
      let template = document.createElement('template');
      template.innerHTML = html;
      let el = template.content.querySelector('.warning');
      document.body.appendChild(el.cloneNode(true));
    } catch (e) {
      console.log(`Error fetching html: ${url}`);
    }
  }

  <script type="module">
    import { importHtml } from './helper.js';
    importHtml('example1.html');
    importHtml('example2.html');
    importHtml('example3.html');
  </script>