概述​

如果你和我一样，每次写中文和英文混合的文案时，都会遇到中英文、全角和半角符号密密麻麻的排在一起导致各种混沌的问题，那么 Pangu 就是你的救星啦！

什么是 Pangu？​

Pangu（盘古）就是解决此问题的一个三方库，用于解决中英文混排时出现的对齐问题。它通过在中文和英文之间添加空格，来使文本在视觉上不显得那么混乱。

如何使用 Pangu.js？​

Pangu 分为好几个版本，像我们熟悉的 Golang、Python、JavaScript、Java 等等之类的语言都有支持。

以 JavaScript 为例：在你的网页引入 Pangu.js 文件（无论是 cdn 还是源文件都可以啦）：

<script src="./pangu.js"></script>

在 Script 标签里添加如下代码：

document.addEventListener('DOMContentLoaded', () => {
        pangu.autoSpacingPage();
});

这样就会自动给中文和英文之间添加一个半角空格来优化网页排版了。

当然，你也可以指定给页面元素的 ID 让 pangu 只优化你选择的那些标签：

document.addEventListener('DOMContentLoaded', () => {
        pangu.spacingElementByTagName('p');
        pangu.spacingElementByTagName('h1');
});

两者一起用也是没有问题的，并且由于已经获取到了要处理的元素还会提高排版速度：

document.addEventListener('DOMContentLoaded', () => {
        pangu.spacingElementByTagName('p');
        pangu.spacingElementByTagName('h1');
        pangu.autoSpacingPage();
});

结语​

当然，Pangu 及其他相似功能的第三方库只是解决中英文混排的一个临时方案，所以还请继续保持随手加空格的习惯。

相关链接​