HTML压缩

压缩HTML代码,移除注释、多余空白字符和可选标签,减小文件体积

📝 输入HTML代码
✅ 压缩结果

欢迎访问

这是一个示例页面,用于演示HTML压缩功能。

console.log('Hello World'); <\/script> `; } function minifyHTML() { const input = document.getElementById('input').value; if (!input.trim()) { alert('请输入HTML代码'); return; } const removeComments = document.getElementById('optComments').checked; const compressWhitespace = document.getElementById('optWhitespace').checked; const removeOptionalTags = document.getElementById('optOptionalTags').checked; const simplifyBoolAttr = document.getElementById('optBoolAttr').checked; const removeEmptyAttr = document.getElementById('optRemoveEmpty').checked; let result = input; if (removeComments) { result = result.replace(//g, ''); result = result.replace(//g, ''); } if (removeOptionalTags) { result = result.replace(/<\/html>/gi, ''); result = result.replace(/<\/head>/gi, ''); result = result.replace(/<\/body>/gi, ''); result = result.replace(/]*>/gi, function(m) { return m.replace(/\s*lang\s*=\s*["'][^"']*["']/gi, ''); }); } if (simplifyBoolAttr) { result = result.replace(/\s+(checked|selected|disabled|readonly|required|multiple|autofocus|autoplay|controls|loop|muted|default|reversed)=["'](?:\1|true|)["']/gi, ' $1'); result = result.replace(/\s+(checked|selected|disabled|readonly|required|multiple|autofocus|autoplay|controls|loop|muted|default|reversed)=["']\1["']/gi, ' $1'); } if (removeEmptyAttr) { result = result.replace(/\s+([a-zA-Z-]+)=["']{2}/g, ''); result = result.replace(/\s+([a-zA-Z-]+)=["']["']/g, ''); } if (compressWhitespace) { result = result.replace(/\n/g, ' '); result = result.replace(/\r/g, ''); result = result.replace(/\t/g, ' '); result = result.replace(/\s{2,}/g, ' '); result = result.replace(/>\s+<'); result = result.replace(/\s+>/g, '>'); result = result.replace(/\s+\/>/g, '/>'); result = result.trim(); } document.getElementById('output').value = result; const origSize = new Blob([input]).size; const newSize = new Blob([result]).size; const saved = origSize > 0 ? ((1 - newSize / origSize) * 100).toFixed(1) : 0; document.getElementById('stats').innerHTML = `
原始大小: ${formatSize(origSize)}
` + `
压缩后: ${formatSize(newSize)}
` + `
节省: ${saved}%
`; } function formatSize(bytes) { if (bytes < 1024) return bytes + ' B'; return (bytes / 1024).toFixed(1) + ' KB'; } function copyResult() { const output = document.getElementById('output'); if (!output.value) return; navigator.clipboard.writeText(output.value).then(() => { const btn = document.querySelector('.copy-btn'); btn.textContent = '已复制'; setTimeout(() => btn.textContent = '复制', 1500); }); } function clearAll() { document.getElementById('input').value = ''; document.getElementById('output').value = ''; document.getElementById('stats').innerHTML = ''; }