關於在html引入另一個html頁面的方法


1、最應該先想到的應該是iframe標簽吧。但是有時候用iframe時,會出現在iframe中的子頁面中的頁面跳轉的鏈接,顯示的時候會只顯示在iframe部分。所以想了下一個方法

2、用jquery提供的load()方法加載另一個頁面,$('要顯示在的標簽').load('另一個頁面的路徑');溫馨提示:會出現安全問題。解決方法一會說

3、用<object style="border:0px" type="text/x-scriptlet" data="目標html頁面l" width=100% height=100%></object>標簽也能實現

4、將下面代碼存為include.js文件中,然后在頁面上用<include src="目標頁面"></include>。這樣也會出現跟用jquery中的load方法一樣的問題

(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);  
                }  
                
                $this.executeScript(content);  
                parent.removeChild(this);  
               
            })  
        }  
    }  
    window.onload = function() {  
        new Include39485748323().replaceIncludeElements();  
    }  
})(window, document)

問題:

這個問題就是因為直接打開的話是用ftp協議訪問的,這兩種方法不支持,所以要改成http協議。

解決方法:在cmd中啟動一個服務,然后訪問就沒問題了。


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM