私はすべてのプロジェクトで ASP.NET MVC を使用しており@Html.Partial("_header")、どのページにも共通の静的 html を含めたいと思っていた場所で使用しています。
しかし今、私は純粋な HTML CSS と JS Web アプリで作業しています。ここでは、サーバー側のテクノロジは一切使用せず、一連の静的コンテンツのみを使用しています。
ここのサイトには、次のレイアウトがあります
----- ヘッダー -----
----- 変更内容 ------
----- フッター ------
だから、ここに私が欲しいものがあります。以前達成したことを何とかしたいです@Html.Partial()
私が知っている 1 つの方法は、IFRAMES を使用することですが、他に良い方法はありますか?
WebアプリがサーバーサイドインクルードをサポートするWebサーバー（Apacheなど）でホストされる場合は、追加するだけです<!--#include virtual="/header.html" -->
。Webサーバーによっては、最初にSSIを有効にする必要があります（Options +Includesapacheの.htaccessで）
クロム拡張を作成しているときに、この状況に遭遇しました。
私がしたことは、ヘッダーフッターをjsファイルの変数に保存し、それをjquery.iを使用してボディに追加することでした.iは、ヘッダーとフッターが必要な場所でそのjsファイルを使用していました。 ...ブーム ページにヘッダー フッターを固定しました。
コード：
<!DOCTYPE html>
<html>
<head>
<script src="http://code.jquery.com/jquery-latest.min.js" type="text/javascript"> </script>
<script>
function appendheaderfooter(){
var header="<div style='position:fixed;top:0px;background-color:aqua;'>header html</div>";
var footer="<div style='position:fixed;bottom:0px;background-color:aqua;'>footer html</div>"
$("body").append(header+footer);
}
window.onload = appendheaderfooter;
</script>
<style>
div{width:100%;}
</style>
</head>
<body><br/>
<p>Content goes here</p>
</body>
</html>
フレームは以前は道のりでしたが、時間が経つにつれて、何らかの理由で開発者の支持を失いました。2006年のこの記事に注意してください。
幸いなことに、あなたはフレームを避けることに賛成しているようです:)
次に、サーバーサイドインクルード（SSI）またはその他のサーバーベースの「インクルード」がJavaScriptよりも好まれますが、これは必ずしも「純粋な」HTML / JS/CSSソリューションではないことを認めます。
SSIステートメントの形式は次のとおりです。
<!--#include virtual="../quote.txt" -->
http://www.htmlgoodies.com/beyond/webmaster/article.php/3473341/SSI-The-Include-Command.htm
SOに関するこの見解を反映する多くの答えがあります-たとえば、検索で表示された最初の3つは 、ここ、 ここ、および ここにあります...
その最後の答えとして受け入れられているのはJSソリューションを推奨していることですが、最後の段落ではサーバー側の好みを示していることに注意してください。
「純粋な」HTML/CSS / JS Webサイトを作成する必要があったのは久しぶりですが、そうするときは、コードをモジュール化して、展開前にHTMLを「コンパイル」することを好みます。
デプロイ前に少し追加の作業が必要ですが、デプロイされたコード内で使用される「最も純粋な」出力を生成します。通常どおりコードを記述し、少し魔法を使って何をどこに含めたいかを示してから、このコードをサイトにデプロイされる標準のHTML / CSS/JSファイルに「コンパイル」します。
これにより、テンプレート化されたヘッダー/フッター/メニューバー/サイドバーファイルを簡単かつシンプルに使用できますが、事前にHTMLコードをコンパイルする必要があります。
SASSはRubyonRailsを使用してこのコンパイルを実行します。残念ながら、そのHTMLに相当するものへの参照は、この特定の時点で私を逃れているので、私がそれを再配置するときに/私が答えを更新します。
HTML5 ではサポートされていませんが、Framesetを使用してもよろしいですか?