Ersetzen innerhtml mit externer Seite

Habe ich eine Seite besteht aus einem header-div für die navigation, einen content-div für content-und einen footer-div ist nur, dass einige statische Informationen.

Die Idee ist, dass, wenn Sie auf etwas in der Kopfzeile, den Inhalt div ändert Ihren Inhalt entsprechend an. Ich möchte zum speichern jedes content-element in eine eigene Datei, für einfache Entwicklung. Wie kann ich mich über ausfüllen dieses magicLoad Funktion habe ich unten geschrieben?

Ich bin derzeit nicht mit jedem framework (jquery in den Sinn kommt), aber ich bin sicher nicht gegen die Verwendung. Wenn es die anderen best practices, ich bin verletzt, ich bin gespannt zu erfahren, wie gut, aber mein primäres Ziel ist das laden aus einer externen Seite. Wie kann ich dies tun?

Hier ist ein einfaches Skelett-mockup von meinem setup jetzt. (Es gibt mehr als nur diese 3 natürlich, aber das sind genug, um den Punkt über.)

<html>
    <script type="text/javascript">
    function show(which) {
        document.getElementById(which).innerHtml = magicLoad(which + ".html");
        return false;
    }       
    function showHome() { show('home'); return false;} //for onload

    </script>
    <body>
    <div id="header">
        <a href="javascript:void(0)" onclick="show('home')">HOME</a> |
        <a href="javascript:void(0)" onclick="show('training')">TRAINING</a> |
        <a href="javascript:void(0)" onclick="show('audits')">AUDITS</a>
    </div>
    <div id="content">

    </div>
    <div id="footer">

    </div>
    </body>
    <script> window.onload=showHome; </script>
</html>
Sie suchen für Ajax.
Nein, ajax wäre asynchron. Dies ist ganz synchron. Wenn ich wollte, dass jemand anderes die Inhalte kontrolliert, dann Ajax wäre eine gute Lösung.
Ajax kann sehr viel synchron.

InformationsquelleAutor corsiKa | 2012-06-20

  1. 4

    verwenden Sie die folgende, einfache und gerade

    $('#which').load('test.html');

    wenn die kommt als parameter

    $('#'+which).load('test.html');
    Durch das syntax-ich nehme an, dies ist JQuery?
    ja. es ist jquery
    Was ist, wenn die HTML-enthält eine vollständige <head> zu <body> - tags? Es ist nicht sinnvoll, innerhalb einer div
    Sie müssen vorsichtig sein mit, dass, dass Ihre Verantwortung mit den geltenden Spezifikationen. es muss partial page
    So dies war in der Tat sehr nahe an dem, was ich suchte. Grundsätzlich which bestimmt das html zu laden. Also, was ich Tat, war $('#content_div').load(which + '.html'); aber diese führte mich dorthin. Danke!

    InformationsquelleAutor Raab

  2. 3

    Wenn Sie einbetten möchten, auf einer anderen Webseite in einem, Sie sollten darüber nachdenken, mit <iframe>.
    So etwas wie:

    <script type="text/javascript">
function show(which) {
    document.getElementById(which).src=which+".html";
    return false;
}       
function showHome() { show('home'); return false;} //for onload

</script>
<iframe id="home"></iframe>

    InformationsquelleAutor Alvin Wong

Schreibe einen Kommentar