javascript - 使用 JS 实现 HTML-minifier 插件

Question

我正在寻找一种方法来缩小使用 Javascript 检索的 HTML 代码，如下所示

document.getElementById("content").innerHTML;

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

Answer 1

包含来自 dist directory 的文件在您的页面中并使用 minify 函数。供引用see the options和 demo they provide .

下面我将其实现为一个快速演示，删除了属性值引号:

$("#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>