A lightweight Javascript code highlighting plugin, Rainbow.
本站之前介绍过一个代码高亮的 JS 库：[本站所用的代码高亮js代码库：Prism js](https://en.wpcio.com/the-code-highlight-script-used-buy-twpzhiku-site/)%EF%BC%8C%E4%BB%8A%E5%A4%A9%E5%9C%A8%E8%BF%99%E9%87%8C%E4%BB%8B%E7%BB%8D%E5%8F%A6%E5%A4%96%E4%B8%80%E4%B8%AA%E5%8A%9F%E8%83%BD%E7%B1%BB%E4%BC%BC%E7%9A%84 Rainbow，Rainbow 是一个小巧的代码语法高亮js库，压缩之后只有 1.4kb，代码高亮的样式可以通过 CSS 定义。
How to use Rainbow
The Rainbow implementation is very simple, first iterates through the code block, matches the code with regular expressions, then marks the code to be highlighted with a span tag, and then displays the code according to the code color and style defined by CSS. Here is a simple example.
First, using data-language, indicate the type of code to be highlighted, which in the example below is python code.
def openFile(path).
file = open(path, "r")
content = file.read()
file.close()
return contentThen, introduce the CSS styles
<link href="/assets/css/theme.css" rel="stylesheet" type="text/css">Then introduce rainbow.js, and the rule js for the language that needs to be highlighted. It is recommended to merge these files into a single file to minimize HTTP requests.
<!-- you can create a custom build with specific languages
this should go before the closing </body> -->
<script src="/assets/js/rainbow.min.js"></script>
<script src="/assets/js/language/generic.js"></script>
<script src="/assets/js/language/python.js"></script>Note that the rainbow css theme only highlights code contained in pre, if you need to highlight code contained in the code tag, please write CSS for the code tag separately.
