苹果CMS静态站点无需重建页面 利用jQuery局部修改内容广告教程

不少站长开启整站静态生成后，偶尔需要微调页面样式、新增广告位或是修改局部文字内容。常规操作是改完模板后全站重新生成静态页面，但如果站点资源数据量大，存在几万甚至十几万份静态HTML文件，整体文件体积可达数GB，全部重新生成不仅耗时久，还会给服务器带来很高负载。想要不重新生成静态文件就能更新页面局部内容，借助jQuery脚本即可实现，具体操作步骤如下。

1、网站页面提前引入jQuery基础脚本，多数模板的公共include文件内已经预先引入，无需重复添加。

<script type="text/JavaScript" src="/static/js/jquery.min.js"></script>

2、新建空白自定义JS文件，在全站生成静态页面之前，将该文件引入模板底部通用foot文件中，全站页面统一加载。

<script type="text/JavaScript" src="/static/js/mystyle.js?v=1.1.1"></script>

?v=1.1.1属于文件版本标记，每次修改JS内部代码后，把版本号数字上调，例如改为1.1.2，浏览器会判定文件已更新，自动忽略本地缓存、重新加载最新脚本，确保修改内容即时生效。

3、可在页面合适位置预留空白DIV容器，设置无宽高、隐藏样式（display:none）；也可以不提前预留容器，全部通过JS代码动态生成元素与样式。

{include file="block/head"}
...
<div id="mystyle"></div>
...
{include file="block/foot"}

4、打开mystyle.js文件写入需要新增、修改的内容代码，示例写法参考：

var ads=$("#mystyle");
ads.html("自定义文字内容");
ads.append('<div>广告配图与跳转链接代码</div>')

完成JS代码编辑并更新版本号后，刷新前台静态页面就能看到改动效果，不用批量重新生成全站静态文件，大幅降低服务器压力与操作耗时。