2017-10-29 14 views
0

を使用して倍数のhtmlファイルから記事を追加し、私はindex.htmlにページを持っていると私は私のライブラリ私はいくつかのサイトを構築しようとしていますJavaScriptの

にローカル保存された別のページからそれをセクション(記事セクション)をロードしたいです私はこれまで持っていることはこれです:onload.jsで

<body> 
     </header> 
     <main> 
     <div class="container"> 
     <div id="demo"> 
     <div> 
     </div> 
    <script src="./scripts/onload.js" charset="utf-8"></script> 
    </header> 
    </body> 

私は次のようにコードを持っている:

function loadDoc() { 
    var xhttp = new XMLHttpRequest(); 
    xhttp.onreadystatechange = function() { 
    if (this.readyState == 4 && this.status == 200) { 
     document.getElementById("demo").innerHTML = 
     this.responseText; 
    } 
    }; 
    xhttp.open("GET", "./first/Prophet-Riddles-App-update.html", true); 
    xhttp.send(); 
} 
window.addEventListener("load",loadDoc); 

はこれまでのところ、それが働いているが、それは私の預言者-謎アプリ-update.htmlを読み込みますindex.htmlには必要ですが、I n eedは複数のファイルをロードすることです。もし私がこのように行こうとしているのであれば、setup関数を2回呼び出すと...うまくいきません。

誰でもお手伝いできますか?それを達成する最良の方法は何ですか?

答えて

0

あなたはそれを再利用することができるようになりますので、引数として指定されたファイルをロードするためにあなたのローダーをリファクタリングする必要があります。私はそれがLOADALL(で、私のために働くdowsntつ以上のHTMLページを追加した場合

function loadDoc(url, target) { 
    var xhttp = new XMLHttpRequest(); 
    xhttp.onreadystatechange = function() { 
    if (this.readyState == 4 && this.status == 200) { 
     document.getElementById(target).innerHTML = 
     this.responseText; 
    } 
    }; 
    xhttp.open("GET", url, true); 
    xhttp.send(); 
} 

function loadAll() { 
    loadDoc("./first/Prophet-Riddles-App-update.html", "demo"); 
    // ... repeat for other pages 
} 
window.addEventListener("load",loadAll); 
+0

を)別のページを追加しました:loadDoc( "./ first/Prophet-Riddles-App.html"、 "demo");私が間違っていることは何ですか? – gaidediz

+0

それは仕事です!私はちょうど "+"を追加する必要がありました:document.getElementById(target).innerHTML + = this.responseText – gaidediz

関連する問題