Question

由于我在整个网页中重复了页脚，因此我将页脚移动到一个名为footer.html的单独文件中。在我的页脚中，版权年份使用javascript动态更新。我已经设法将footer.html文件加载到我的页面中，但是从那年起一直在重新加载。如何加载footer.html文件并在同一脚本文件中更新年份。我在jsfiddle中添加了我的代码：https://jsfiddle.net/wpbmn0z2/

footer.html

<footer class="footer">
    <div class="container">
        <p class="text-muted"><a href="contactus.html">Contact Us</a></p>
        <p class="text-muted"> Copyright &copy; abc <span id="yearfooter"></span>.</p>
    </div>
</footer>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script src="scripts/bootstrap.min.js"></script>

CSS

.footer {
     bottom: 0;
     height: 60px;
     position: absolute;
     width: 100%;
     text-align:center;
     background-color:#FFFFFF;
 }

.footer > .container {
    padding-left: 15px;
    padding-right: 15px;
}

的javascript

$(function(){
 $("#footer").load("footer.html");
});

$(document).ready(function(){
 $('#yearfooter').text(new Date().getFullYear());
});

Answer 1

这可以解决您的问题吗？加载页脚并在文档准备好后更新年份。

$(document).ready(function(){
     $("#footer").load("footer.html");
     var year = new Date().getFullYear();
     $('#yearfooter').text(year);
});

Answer 2

我认为你的支架存在问题。

$(document).ready(function(){
     $('#yearfooter').text((new Date).getFullYear());
});

Answer 3

我设法让它以我想要的方式运作。以下是javascript代码

$(function(){
    $("#footer").load("footer.html", function () {
        $('#yearfooter').text(new Date().getFullYear());
    }); 
});

重用页脚html代码

3 个答案: