原生js能做到像jquery的$().load('./index1.html')吗？

Question

老问题，还是访问同一链接，根据参数不同显示不同主页
已试过的方案：
一、将内容写在如下script标签中，并设置id值，在获取到对应参数时，将对应的script值插入对应元素内
问题：只能如下例子只是更换图片或者少数的不同可使用，如果整个页面都不一样所有的都写在一个页面，这个文档会变大

<script type="text/x-template" id="bt1">
   <img id="bt1" src="./19034_en_1.jpg" v-show="bt1">bt1</img>
</script>
      function getQueryString(name) {
            var result = window.location.search.match(new RegExp("[\?\&]" + name + "=([^\&]+)", "i"));
            if (result == null || result.length < 1) {
                return "";
            }
            return result[1];
        }
        var params = parseInt(getQueryString('id'));
        switch (params) {
            case 5:
                document.getElementById('wrap').innerHTML = document.getElementById('bt1').innerHTML;
                break;
            case 3：
           ....
        }

二、使用jQuery的load方法
具体可看另一问题里的答案https://segmentfault.com/q/10...

现在我想问如果不用jQuery（因为该页面没有其他需要使用交互的只是一个指引中转页），原生js 该怎么实现像load这样的功能，或者还有其他更好的方案吗？【不要用框架~~】

Answer 1

jquery不过也是原生dom操作的封装而已，jquery能做到的原生肯定能做到
想知道怎么实现的可以去看源码，毕竟是开源的
https://github.com/jquery/jquery

Answer 2

(function () {
            function loadXMLDoc() {
                var xmlhttp;
                if (window.XMLHttpRequest) {
                    xmlhttp = new XMLHttpRequest(); //IE7+,firefox,Chrome,Opera,Safari
                } else {
                    xmlhttp = new ActiveXObject("Microsoft.XMLHTTP"); //IE6, IE5 浏览器执行代码
                }
                xmlhttp.onreadystatechange = function () {
                    if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
                        //把index.html内容赋给html
                        document.getElementById("html-wrap").innerHTML = xmlhttp.responseText;
                        //重要！！！index.html页面中的js不生效解决方案——必须在这里添加script，也可以引入
                        var sc = document.createElement("script");
                        sc.innerHTML = `
                         (function () {
                         var span = document.querySelector('#schl span');
                         span.addEventListener('touchend', function (e) {
                         document.querySelector('#notice-wrap').style.display = 'block';
                         console.log('点击事件');
                         });
                         var close = document.querySelector('#notice-wrap .close');
                         close.addEventListener('touchend', function (e) {
                         document.querySelector('#notice-wrap').style.display = 'none';
                         })

                         }());
                        `;
                        document.getElementsByTagName('body')[0].append(sc);
                    }
                }
                xmlhttp.open("GET", "./index.html", true);
                xmlhttp.send();
            }
            loadXMLDoc();
        }())