HTML 母版页
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/5332751/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Master page in HTML
提问by mans
Is there any way to create a similar idea as master/content page in ASP.NET in pure HTML?
有没有办法在纯 HTML 中创建与 ASP.NET 中的母版/内容页面类似的想法?
I want to create several pages in HTML, but I want that all of them look the same with some contents different. Is there any way to do this without creating several pages which are very similar to each other?
我想用 HTML 创建几个页面,但我希望它们看起来都一样,但有些内容不同。有没有办法在不创建几个彼此非常相似的页面的情况下做到这一点?
回答by apohl
//wait until the dom is loaded
$(document).ready(function () {
//adds menu.html content into any "#menu" element
$('#menu').load('menu.html');
});
In reference to some of the other answers, iframes should be used carefully and sparingly. http://rev.iew.me/help-moving-from-iframes
参考其他一些答案,应该谨慎和谨慎地使用 iframe。 http://rev.iew.me/help-moving-from-iframes
http://fsvieira.com/2013/06/11/iframes-bad-for-a-website/
http://fsvieira.com/2013/06/11/iframes-bad-for-a-website/
Duplicate question here with answer: How to create a master page using HTML?
这里有重复的问题和答案:如何使用 HTML 创建母版页?
回答by Petr Abdulin
The simple way to do that is to use server side includesor SSI. However easier and, probably, much better solution would be usage of PHP with includes. This way you will always have additional PHP functionality then you need it. But both of this solutions require server that will preprocess the pages. If you want collection of pages, say, on a local hard drive, then only solution I know is already proposed iframe tag.
这样做的简单方法是使用服务器端包含或 SSI。然而更容易,而且可能更好的解决方案是使用 PHP 和includes。这样,您将始终拥有额外的 PHP 功能,然后您就需要它了。但是这两种解决方案都需要服务器来预处理页面。如果您想在本地硬盘驱动器上收集页面,那么我知道的唯一解决方案是已经提出了iframe tag。
回答by Metin SEV?ND?K
I resolved with a Third party c# form application.
我解决了第三方 c# 表单应用程序。
Header and footer different page insert key to all other page. (###footer###) Replace files contents with form Application.
页眉和页脚不同的页面插入键到所有其他页面。(###footer###) 用表单应用程序替换文件内容。
footer.html
页脚.html
<h2>this place is footer.</h2>
default.html
默认.html
<h1>Default page</h1>
bla bla bla
###footer###
Result default.html
结果 default.html
<h1>Default page</h1>
bla bla bla
<h2>this place is footer.</h2>
Source Code below
下面的源代码
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";
}
回答by Blender
Well, just as an ugly solution, try <iframe>
tags. They load remote pages into your website, so you could define a "master template" like this:
好吧,就像一个丑陋的解决方案,尝试<iframe>
标签。他们将远程页面加载到您的网站中,因此您可以像这样定义一个“主模板”:
...
<body>
<div id="content">
<iframe src="content1.html"></iframe>
...
Now, inside of content1.html
, you could just write the content without the main layout.
现在,在 内部content1.html
,您可以只编写没有主布局的内容。