格
千格
KiloCell
全部工具
指南
关于
联系
Unicode 转换器
首页
开发工具
Unicode 转换器
源内容 (左)
转换结果 (右)
目标格式
JavaScript (\\uXXXX)
HTML 实体 (十六进制 &#xXXXX;)
HTML 实体 (十进制 &#XXXX;)</option> <option value="css">CSS 编码 (\\XXXX)</option> </select> </div> <div class="btn-group"> <button class="primary" onclick="toUnicode()">文本 ➔ Unicode <i class="fas fa-arrow-right"></i></button> <button class="contrast" onclick="fromUnicode()"><i class="fas fa-arrow-left"></i> Unicode ➔ 文本</button> <button class="secondary" onclick="clearAll()">清空</button> </div> <button class="outline" style="margin-top: 1rem; width: 100%;" onclick="copyResult()">复制右侧结果</button> </main> <article class="article-content"> <h2>什么是 Unicode 转换？为什么它在开发中不可或缺？</h2> <p>在跨平台开发、多语言支持以及解决 Web 兼容性问题时，我们经常需要将普通文本转换为各种特定格式的 Unicode 编码。<strong>Unicode 转换器</strong>可以将人类可读的字符（如中文、表情符号）转换为机器更容易识别或在特定上下文中合法的转义序列。</p> <h2>本工具支持的格式详解</h2> <ul> <li><strong>JavaScript (<code>\uXXXX</code>)：</strong> 这是最常用的 Unicode 转义格式。在 JS 字符串中，如果您想确保中文字符不因为文件编码问题而乱码，可以将其转换为这种格式。</li> <li><strong>HTML 实体 (<code>&#xXXXX;</code>)：</strong> 用于 HTML 文档中，确保浏览器能够正确解析特殊字符，特别是在处理非法字符或需要展示源码时。</li> <li><strong>CSS 编码 (<code>\XXXX</code>)：</strong> 常用于 CSS 的 <code>content</code> 属性中，例如在伪元素（<code>::before</code>）中插入图标或特殊符号。</li> </ul> <h2>本工具解决的具体痛点</h2> <h3>1. 彻底解决网页乱码</h3> <p>如果您的项目由于历史原因必须使用 GBK 编码，但需要显示一些特殊的 UTF-8 字符，将其转换为 Unicode 实体是目前最稳妥的解决方案。转换后的内容可以在任何编码环境下被浏览器正确还原。</p> <h3>2. 编写健壮的正则表达式</h3> <p>在编写处理特定语言（如汉字范围 <code>\u4e00-\u9fa5</code>）的正则表达式时，直接使用 Unicode 码点比直接写汉字更规范且易于维护。本工具可以帮助您快速获取这些码点。</p> <h3>3. 在 CSS 中插入自定义图标</h3> <p>使用图标字体（如 FontAwesome）时，您需要通过 CSS 的 <code>content</code> 属性指定特定字符。本工具可以快速将图标的码点转换为 CSS 兼容的转义格式。</p> <h2>操作指南</h2> <p>1. <strong>文本转 Unicode：</strong> 在左侧框输入文字，选择目标格式，点击“文本 ➔ Unicode”。</p> <p>2. <strong>Unicode 转文本：</strong> 在左侧框粘贴编码后的内容（支持自动识别混合文本），点击“Unicode ➔ 文本”。</p> <p>3. <strong>隐私提示：</strong> 本工具完全在您的浏览器端运行，不会发送任何数据到云端，请放心转换敏感信息。</p> </article> </div> <script> const leftText = document.getElementById('leftText'); const rightText = document.getElementById('rightText'); const formatSelect = document.getElementById('format'); function toUnicode() { const input = leftText.value; const format = formatSelect.value; let result = ''; for (let i = 0; i < input.length; i++) { const charCode = input.charCodeAt(i); // 仅转换非 ASCII 字符或根据格式需要全转 if (charCode > 127 || format !== 'js') { const hex = charCode.toString(16).toUpperCase().padStart(4, '0'); switch (format) { case 'js': result += '\\u' + hex; break; case 'html-hex': result += '&#x' + hex + ';'; break; case 'html-dec': result += '&#' + charCode + ';'; break; case 'css': result += '\\' + hex; break; } } else { result += input[i]; } } rightText.value = result; } function fromUnicode() { let input = leftText.value; // 尝试匹配各种格式 // \uXXXX input = input.replace(/\\u([0-9a-fA-F]{4})/g, (match, grp) => String.fromCharCode(parseInt(grp, 16))); // &#xXXXX; input = input.replace(/&#x([0-9a-fA-F]{1,4});/g, (match, grp) => String.fromCharCode(parseInt(grp, 16))); // &#XXXX; input = input.replace(/&#(\d{1,5});/g, (match, grp) => String.fromCharCode(parseInt(grp, 10))); // \XXXX input = input.replace(/\\([0-9a-fA-F]{4})/g, (match, grp) => String.fromCharCode(parseInt(grp, 16))); rightText.value = input; } function clearAll() { leftText.value = ''; rightText.value = ''; } function copyResult() { rightText.select(); document.execCommand('copy'); const btn = event.target; const originalText = btn.innerText; btn.innerText = '已复制！'; setTimeout(() => btn.innerText = originalText, 2000); } function toggleTheme() { const html = document.documentElement; const btn = document.getElementById('themeBtn'); const isDark = html.getAttribute('data-theme') === 'dark'; html.setAttribute('data-theme', isDark ? 'light' : 'dark'); btn.innerText = isDark ? '🌙' : '☀️'; localStorage.setItem('theme', isDark ? 'light' : 'dark'); } // Init theme const savedTheme = localStorage.getItem('theme') || (window.matchMedia('(prefers-color-scheme: dark)').matches ? 'dark' : 'light'); document.documentElement.setAttribute('data-theme', savedTheme); document.getElementById('themeBtn').innerText = savedTheme === 'dark' ? '☀️' : '🌙'; </script> <!-- FAQ（GEO 优化）--> <!-- Internal links: outgoing link audit fix --> <nav class="related-links-section" aria-label="相关站内链接"> <h2>相关工具与导航</h2> <div class="related-links-list"> <a href="/zh/">千格首页</a> <a href="../../tools-directory.html">全部工具目录</a> <a href="../../tools-directory.html">dev 工具分类</a> <a href="easing-visualizer.html">缓动函数可视化</a> <a href="api-mock.html">API 响应模拟器</a> <a href="arrow-generator.html">箭头符号生成器</a> <a href="ascii-art.html">ASCII 艺术</a> </div> </nav> <style> /* related-links centered */ .related-links-section { width: min(960px, 92%); margin: 40px auto 0; padding: 24px 0 8px; border-top: 1px solid var(--border-subtle, var(--border-color, #e5e7eb)); text-align: center; } .related-links-section h2 { margin: 0 0 14px; font-size: 1.15rem; color: var(--text-primary, inherit); text-align: center; } .related-links-list { display: flex; flex-wrap: wrap; gap: 10px; justify-content: center; align-items: center; } .related-links-list a { display: inline-flex; align-items: center; justify-content: center; min-height: 36px; padding: 8px 14px; border: 1px solid var(--border-subtle, var(--border-color, rgb(184 255 120 / 16%))); border-radius: var(--radius-md, 8px); color: var(--accent-cyan, var(--accent-blue, var(--accent, #7fbf4a))); background: var(--bg-card, rgba(255, 255, 255, 0.04)); text-decoration: none; font-size: 0.92rem; line-height: 1.3; } .related-links-list a:hover { border-color: var(--border-strong, currentColor); text-decoration: underline; } </style> <footer class="site-footer"> <nav data-site-policy-links aria-label="网站政策" style="display:flex;flex-wrap:wrap;justify-content:center;gap:12px 20px;margin:16px auto;padding:0 16px;font-size:14px"> <a href="../../about.html">关于本站</a> <a href="../../contact.html">联系我们</a> <a href="../../terms.html">使用条款</a> <a href="../../privacy-policy.html">隐私政策</a> </nav> </footer> <!-- i18n-switch --> <div class="wu-lang-switch" data-wu-lang="zh" role="navigation" aria-label="Language"><a href="/zh/tools/dev/unicode-converter.html" data-wu-lang-link="en">English</a><span class="sep">|</span><a href="/zh/tools/dev/unicode-converter.html" data-wu-lang-link="zh" aria-current="page">中文</a></div> <!-- /i18n-switch --> </body> </html>
English
|
中文