在前端开发中，通常需要对 HTML 代码进行格式化和清理，以保证页面的优化和可读性。html-tidy 是一个用于 HTML 格式化和清理的 npm 包，本文将详细介绍它的使用。
安装
要使用 html-tidy，首先需要进行安装。可以通过 npm 进行安装：
npm install html-tidy
使用
格式化 HTML
使用 html-tidy，可以将 HTML 代码进行格式化，以便更好地阅读和处理。
const { tidy } = require('html-tidy');
const sourceHtml = '<html><head><title>Page title</title></head><body><p>Hello world!</p></body></html>';
console.log(tidy(sourceHtml));输出：
-- -------------------- ---- -------
--------- -----
------
------
----- ----------------
-------
---- -----
--------
-------
------
---
----- ------
----
-------
-------可以看到，tidy 函数将不规范的 HTML 代码转换成了带有合适缩进和换行符的正确格式化 HTML 代码。
清理 HTML
使用 html-tidy，也可以清理 HTML 代码。例如，可以将 HTML 代码中的无用元素和属性删除，以便更好地阅读和处理。
const { clean } = require('html-tidy');
const sourceHtml = '<html><head><title>Page title</title></head><body><p>Hello world!</p><script>alert("Hello world!");</script></body></html>';
console.log(clean(sourceHtml));输出：
<html><head><title>Page title</title></head><body><p>Hello world!</p></body></html>
可以看到，clean 函数将 HTML 代码中的无用元素和属性删除，只保留了核心内容。
配置选项
html-tidy 支持多种配置选项，可以根据实际需要进行配置。下面是一些常用的配置选项：
indent-spaces：设置缩进的空格数，取值为 0 至 8，默认为 4。preserve-entities：保留 HTML 实体，例如 ，取值为true或false，默认为true。char-encoding：设置字符编码，例如utf8或ascii，默认为utf8。wrap-attributes：设置是否将属性换行，取值为auto（自动），force（强制），或一个数字（换行的最大长度），默认为auto。
可以通过 tidy 和 clean 函数的第二个参数进行配置。例如，下面是一个设置缩进空格数为 2 的示例：
const { tidy } = require('html-tidy');
const sourceHtml = '<html><head><title>Page title</title></head><body><p>Hello world!</p></body></html>';
console.log(tidy(sourceHtml, {
'indent-spaces': 2
}));输出：
-- -------------------- ---- -------
--------- -----
------
------
----- ----------------
-------
---- -----
--------
-------
------
---
----- ------
----
-------
-------可以看到，输出的 HTML 代码缩进空格数为 2。
总结
html-tidy 是一款方便实用的 npm 包，可以用来格式化和清理 HTML 代码。本文介绍了 html-tidy 的安装和使用方法，并提供了示例代码和配置选项，希望能帮助前端开发者更好地进行 HTML 开发。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/600557ba81e8991b448d4c3b