使用 JS 实现 HTML 最小化器插件

Implementing HTML-minifier Plugin with JS

本文关键字:插件 最小化 HTML JS 实现 使用      更新时间:2023-09-26

我正在寻找一种方法来缩小我的HTML代码,该代码是用Javascript检索到的,就像这样

document.getElementById("content").innerHTML;

HTML非常杂乱无章,缩进很差,但其w3c经过验证。我遇到了这个插件 https://github.com/kangax/html-minifier 但是需要帮助实现原始 JS/jQuery,因为它只提供 node.js 的说明,而且我的应用程序不是基于服务器的。

将目录中的文件包含在页面dist并使用minify函数。有关参考,请参阅选项及其提供的演示。

下面我将其实现到一个删除属性值引号的快速演示中:

$("#input").on("input", function() {
  $("#output").val(minify($(this).val(), {
    removeAttributeQuotes: true,
    collapseWhitespace: true
      // other options
  }));
});
<script src="https://rawgit.com/kangax/html-minifier/50fad6e3a7a77f37671afae6782f557bd686bc8b/dist/htmlminifier.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<h1>Input</h1>
<textarea id="input"></textarea>
<h1>Output</h1>
<textarea id="output"></textarea>