web-dev-qa-db-ja.com

HTMLのマスターページ

ASP.NETのマスター/コンテンツページと同様のアイデアを純粋なHTMLで作成する方法はありますか?

HTMLで複数のページを作成したいのですが、すべてのページが同じように見え、一部のコンテンツが異なっている必要があります。互いに非常に似ているいくつかのページを作成せずにこれを行う方法はありますか?

24
mans
//wait until the dom is loaded
$(document).ready(function () {
    //adds menu.html content into any "#menu" element
    $('#menu').load('menu.html');
});

他の回答のいくつかを参照して、iframeは慎重に慎重に使用する必要があります。 http://rev.iew.me/help-moving-from-iframes

http://fsvieira.com/2013/06/11/iframes-bad-for-a-website/

ここで答えと重複する質問: HTMLを使用してマスターページを作成する方法?

8
apohl

それを行う簡単な方法は、 サーバー側インクルード またはSSIを使用することです。しかし、より簡単で、おそらく、はるかに良い解決策は、PHP with includes を使用することです。この方法では、常に追加のPHPしかし、これらのソリューションは両方とも、ページを前処理するサーバーを必要とします。たとえば、ローカルハードドライブ上のページのコレクションが必要な場合は、私が知っているソリューションのみが既に提案されています iframeタグ =。

4
Petr Abdulin

iframe を使用できます。それは純粋にhtmlになります。

0
bluefoot

サードパーティのc#フォームアプリケーションで解決しました。

他のすべてのページへのヘッダーとフッターの異なるページ挿入キー。 (### footer ###)ファイルの内容をフォームApplicationに置き換えます。

footer.html

<h2>this place is footer.</h2>

default.html

<h1>Default page</h1>
bla bla bla
###footer###

結果default.html

<h1>Default page</h1>
bla bla bla
<h2>this place is footer.</h2>

File Content Replacer

以下のソースコード

List list = new List();

private void sourceBtn_Click(object sender, EventArgs e)
{
    DialogResult result = openFileDialog1.ShowDialog(this);
    if (result == DialogResult.OK)
    {
        sourceTxt.Text = openFileDialog1.FileName;
    }
}

private void fileListSelect_Click(object sender, EventArgs e)
{
    var result = openFileDialog2.ShowDialog(this);
    if (result == DialogResult.OK)
    {
        fileList.Items.AddRange(openFileDialog2.FileNames);
    }
}

private void addSourceBtn_Click(object sender, EventArgs e)
{
    list.Add(new sourceKey() { filename = sourceTxt.Text, key = keyTxt.Text });
    sourceTxt.Clear();
    keyTxt.Clear();
    sourceTxt.Focus();
    sourceList.DataSource = null;
    sourceList.DataSource = list;
}


private void ConvertBtn_Click(object sender, EventArgs e)
{
    foreach (var filename in fileList.Items)
    {
        string text = File.ReadAllText(filename.ToString());
        foreach (var item in sourceList.DataSource as List)
        {
            text = text.Replace(item.key, File.ReadAllText(item.filename));
        }
        File.WriteAllText(filename.ToString(), text);
    }
    infoLabel.Text = "Done";
}

ソースコードダウンロードリンク

0