使用一个文件显示大量网页

Question

我正在构建一个简单的网页。但是有几十个子页面。这个人组织他的业务的方式意味着电话号码在任何一周都在负责接听电话的人之间不断变化。有没有办法可以更改单行文本（例如在 css 文件中），并根据谁负责接听电话，每周更改所有子页面上发布的电话号码？
从那时起，我已经学会了将模板从凌乱的 html/table 代码更改为使用 css 的更精简的代码外观。

Answer 1

如果这符合您的浏览器支持配置文件，您可以通过 ::after 伪元素执行此操作：http://caniuse.com/#feat=css-gencontent
请注意，IE8（唯一不支持::after 而不是:after 的“通用”浏览器）将于明年初停产（ 会非常高兴）。

虽然这是一种绝对糟糕的做法——你应该使用 CSS 来进行演示 而不是 信息，但我是如果这只是一个临时的技巧，在你实施一些不那么可怕的事情时让你头疼，我不会告诉你不这样做。

操作方法示例：http://dabblet.com/gist/b4bd30443cdbd810d8a8

Call <span class="data-onCallPhnNum"></span> for help.

.data-onCallPhnNum::after{
    content:"(555)-555-5555";
}

应该注意，这样做的主要缺点是 如果浏览器无法呈现 ::after 伪元素，则没有后备。

更好，您可以包含这样的 Javascript 文件：

        [....]
        <script type="text/javascript" src="phonenum.js"></script>
    </body>
</html>

在 phonenum.js 中的 js（及其预期的 HTML 用途）是：

(function(){
    var phnNum = "(555)-555-5555";
    var phnLnks = document.getElementsByClassName("data-onCallPhnNum");
    for(var i = phnLnks.length >>> 0; i--;){
        phnLnks[i].href = "tel:" + phnNum;
        phnLnks[i].innerHTML = phnNum;
    }
})();

Call <a href="page-with-phone-number.html" class="data-onCallPhnNum">the number listed on our contact page</a> for assistance.

这将完成同样的事情，只是不适用于关闭 js 的浏览器，具有自然后备功能，具有可供移动查看者点击的电话号码，并且不使用 CSS 获取信息。

您最终仍应将其移入数据库并在服务器端提取号码，但在真正的解决方案准备好之前，黑客可以省去头痛，要么就行。

编辑说明：请 CBroe 推荐 tel: 协议和后备的形式化。

Answer 2

还有其他两个选项，严格来说都不是 HTML 解决方案。

Server Side Includes 是一种选择，尽管它们正在失宠。

另一种选择是使用服务器端模板系统，例如 PHP。