将一个html页面中嵌入另一个html页面步骤如下：

1、首先，要嵌入html并不一定要写js代码，如图使用iframe标签，设置其src属性即可。注意其scrolling="auto"以添加滚动条。另外，其width和height要单独设置。

2、其链接到的html页面内容如图所示。给其添加如图meta标签，增加自动刷新功能。

3、在Python编写的httpserver中（Tornado），这两个url的请求都要处理。以本程序为例，用户浏览器载入main以后，main页面中的iframe标签会自动载入todolist。

4、如图是通过浏览器访问main页面，可以看到下面的框框中显示的就是todolist页面的内容。

5、另外，其右侧自带滚动条，而且这个潜入的页面设置了自动刷新，会时刻保持更新。

6、如果关闭了httpserver，会看到如簇所示情况，嵌入的页面刷新失败。但是main页面没有自动刷新，无影响。

        <div id="page"></div>

        <script>

            $("#page").load("header.html")

        </script>

<!--第二种：引入include.js文件，然后用include标签加载想要的页面

            代码如下-->

        <script>

            (function(window, document, undefined) {

    var Include39485748323 = function() {}

    Include39485748323.prototype = {

        //倒序循环

        forEach: function(array, callback) {

            var size = array.length

            for(var i = size - 1 i >= 0 i--){

                callback.apply(array[i], [i])

            }

        },

        getFilePath: function() {

            var curWwwPath=window.document.location.href

            var pathName=window.document.location.pathname

            var localhostPaht=curWwwPath.substring(0,curWwwPath.indexOf(pathName))

            var projectName=pathName.substring(0,pathName.substr(1).lastIndexOf('/')+1)

            return localhostPaht+projectName

        },

        //获取文件内容

        getFileContent: function(url) {

            var ie = navigator.userAgent.indexOf('MSIE') > 0

            var o = ie ? new ActiveXObject('Microsoft.XMLHTTP') : new XMLHttpRequest()

            o.open('get', url, false)

            o.send(null)

            return o.responseText

        },

        parseNode: function(content) {

            var objE = document.createElement("div")

            objE.innerHTML = content

            return objE.childNodes

        },

        executeScript: function(content) {

            var mac = /<script>([\s\S]*?)<\/script>/g

            var r = ""

            while(r = mac.exec(content)) {

                eval(r[1])

            }

        },

        getHtml: function(content) {

            var mac = /<script>([\s\S]*?)<\/script>/g

            content.replace(mac, "")

            return content

        },

        getPrevCount: function(src) {

            var mac = /\.\.\//g

            var count = 0

            while(mac.exec(src)) {

                count++

            }

            return count

        },

        getRequestUrl: function(filePath, src) {

            if(/http:\/\//g.test(src)){ return src }

            var prevCount = this.getPrevCount(src)

            while(prevCount--) {

                filePath = filePath.substring(0,filePath.substr(1).lastIndexOf('/')+1)

            }

            return filePath + "/"+src.replace(/\.\.\//g, "")

        },

        replaceIncludeElements: function() {

            var $this = this

            var filePath = $this.getFilePath()

            var includeTals = document.getElementsByTagName("include")

            this.forEach(includeTals, function() {

                //拿到路径

                var src = this.getAttribute("src")

                //拿到文件内容

                var content = $this.getFileContent($this.getRequestUrl(filePath, src))

                //将文本转换成节点

                var parent = this.parentNode

                var includeNodes = $this.parseNode($this.getHtml(content))

                var size = includeNodes.length

                for(var i = 0 i < size i++) {

                    parent.insertBefore(includeNodes[0], this)

                }

                //执行文本中的额javascript

                $this.executeScript(content)

                parent.removeChild(this)

                //替换元素 this.parentNode.replaceChild(includeNodes[1], this)

            })

        }

    }

    window.onload = function() {

        new Include39485748323().replaceIncludeElements()

    }

})(window, document)

        </script>

        <!--下面引入文件-->

<include src="header.html"></include>

<!--第三种： 用inframe框架加载页面， 兼容性不好-->

<iframe src="xxx.html"></iframe>

html中引入调用另一个html的方法，尝试了好几种，都列出来： 

其中第一种是最好的，其他的方法，可以尝试看看，是不是适合你当前项目

一、div+$(“#page1”).load(“b.html”) 

参考代码：

二、iframe 

参考代码：

三、object引入 

参考代码：

四、import引入 

参考代码：

五、bootstrap的panel组件，或者easyui的window组件，有点类似这个效果；

整理了3个方法，一个是HTML的iframe标签，别两个是JS引用。比如要在arr.html文件里引用index.html文件，方法如下。

1、HTML引用方法：

<iframe name="toppage" width=100% height=100% marginwidth=0 marginheight=0 frameborder="no" border="0"  src="index.html" ></iframe>

2、JS引用方法：

<object style="border:0px" type="text/x-scriptlet" data="index.html" width=100% height=100%></object>

3、<script type="text/javascript" src="index.js"></script>

两个页面     technologies.html  head.html  在  technologies.html 中使用 include

使用chrome 打开 technolliges.html，页面没有任何显示。原因 html不支持 include，解决方案参考：csdn: html中include方法 。参考方法将.html改成 .aspx，在technologies.aspx中打开可以显示 head.html中的内容。有一个未解决问题  windows 2000 IIS 中的  default.aspx 页面不支持默认主页面，支持default.html，暂时无法使用该方案，但可以尝试另外一个iframe方案，iframe方案支持在html页面中包含其它页面。