Javascript 我可以避免jquery中的代码重复吗？

我确实需要在我的站点上的每个页面底部显示一个固定位置的内容，如下所示

<div class="footer-fix">
    <p>This is its contents......</p>
</div>

.footer-fix {
    background:#fff;
    position: fixed;
    bottom: 0;
    z-index: 999;
    width: 100%;
}

这就是它的内容

.页脚修复{
背景：#fff；
位置：固定；
底部：0；
z指数：999；
宽度：100%；
}

我的问题是，我的站点中是否有很多页面。那么，我是否需要在几乎每个网页中添加此代码，或者是否有其他方法不在每个网页中添加此代码

希望有人能帮助我

---

多谢各位

使用PHP可以很容易地做到这一点，只需创建footer.PHP文件并在中插入上面的代码即可。 然后只需调用include（“/path/to/footer.php”）；在每个页面的底部，它是。

您可以使用html标记 例：

//这是我的头球
//这是我的身体
//这是我的页脚

演示：

首先，是的，您可以在jQuery中完成。但不推荐

下面是一个函数，它可以将html和css样式动态插入元素：

function appendHtmlTo(where, htmlText, cssText) {
  $(where).append(htmlText).append('<style text="text/css">'+cssText+'</style>');
}

哪些变量

html

和

css

定义如下（每行末尾有一个反斜杠）：

var-html=\
\
这是它的内容……
\
\
';
var css=\
.页脚修复{\
背景：粉红色\
位置：固定\
底部：0\
z指数：999\
宽度：100%\
}\
';

---

确保在文档准备就绪时调用此函数

jquery帮不了你，那是为了sure@JaromandaX：当然可以，通过动态生成这些元素并将它们插入到文档中，在脚本嵌入的每个页面上。关于可访问性或搜索引擎，这是否是一个好方法将是另一个问题。@CBroe，你能给我一个例子说明如何做到这一点吗？谢谢这是一个单页的应用程序/网站。简而言之，您可以在需要时使用jquery.ajax异步加载页面上的内容作为外部视图。。。我可以用php来解决这个问题。但我一直在寻找解决办法jquery@user3733831哦，对不起，我的不好，那么我必须同意CBroe，你可以这样做，但不是很好的解决方案。谢谢你的回答。您能告诉我不推荐此解决方案的原因吗。再次感谢。。

function appendHtmlTo(where, htmlText, cssText) {
  $(where).append(htmlText).append('<style text="text/css">'+cssText+'</style>');
}

appendHtmlTo('body', html, css);

var html = '\
<div class="footer-fix">\
    <p>This is its contents......</p>\
</div>\
';

var css = '\
.footer-fix {\
    background:pink;\
    position: fixed;\
    bottom: 0;\
    z-index: 999;\
    width: 100%;\
}\
';