如果整站已经静态化之后我们需要在页面样式、内容上做一些小幅度修改或者增加一些广告样式的话,一般情况下做好页面数据修改之后重新生成所有数据即可,但是问题也随之而来,假如整站数据量非常大的情况下,动辄几万或者十几万个HTML页面文件,文件大小也可能是几个G,那么全部数据重新生成一遍的时间和服务器压力可想而知。那么如何在不需重新生成静态页面的情况下做到修改或更新页面某些内容呢,我们可以借助JQuery插件来实现,具体如下:
1、网站头部需要引入JQuery插件,一般情况下模版的include文件已经引入
1 | <script type= "text/JavaScript" src= "/static/js/jquery.min.js" ></script> |
2、先准备一个空白无内容的js文件,并在整站生成静态化之前引入到网站底部,一般来说引入模版的foot文件内即可。
1 | <script type= "text/JavaScript" src= "/static/js/mystyle.js?v=1.1.1" ></script> |
//?v=1.1.1一般含义为文件的版本号,更新了js文件内代码之后更改一个版本号会(如:1.1.2)会让浏览器识别为新的js文件,然后放弃缓存重新加载此js文件达到更新的效果
3、可以在适当的页面位置预设一个或几个无宽高,无样式或者属性为display:none的DIV容器,当然不预设也是可以的,后期完全通过js代码来追加容器和样式。
1 2 3 4 5 | { include file= "block/head" } ... <div id= "mystyle" ></div> ... { include file= "block/foot" } |
4、在引入mystyle.js文件内增加你需要的代码,例如:
1 2 3 4 | var ads=$( "#mystyle" ); //选择容器 ads.html( "我爱你" ); ads.append( '<div>广告图片和链接</div>' ) ...... |
这样就达到了在静态页面小幅度修改内容的效果了。