将 HTML 标记转换为 React JSX 语法，自动转换属性
格式转换
关于此工具
HTML 转 JSX 转换器可将标准 HTML 标记转换为有效的 React JSX 语法。它自动将 HTML 属性转换为 JSX 等价形式，如 class 转 className、for 转 htmlFor，处理内联样式字符串转样式对象、自闭合标签和事件处理器重命名，所有操作均在浏览器本地完成。
主要功能
- 自动属性转换（class、for、tabindex 等）
- 内联样式字符串转样式对象
- 空元素自闭合标签处理
- 事件处理器属性转换（onclick 转 onClick）
- 内置示例 HTML 便于快速测试
- 输入时实时转换
使用场景
- 将现有 HTML 模板迁移为 React 组件
- 将静态 HTML 设计转换为动态 JSX
- 将 Bootstrap 或 Tailwind HTML 片段转换为 React 代码
- 快速将 HTML 邮件模板移植到基于 React 的渲染器
- 通过对比 HTML 和 JSX 来学习 JSX 语法差异
html
jsx
react
converter
component
常见问题
什么是 HTML 转 JSX 转换器？
HTML 转 JSX 转换器可将标准 HTML 标记转换为有效的 React JSX 语法，自动将 HTML 属性转换为 JSX 等价形式，完全在浏览器中运行。
它执行哪些属性转换？
它将 class 转为 className、for 转为 htmlFor、tabindex 转为 tabIndex，内联样式字符串转为样式对象，onclick 等事件处理器转为 onClick，以及 br 等自闭合标签转为 br /。
它支持内联样式吗？
支持。内联样式字符串会自动转换为 JavaScript 样式对象，属性名使用驼峰命名法，可直接在 React 组件中使用。
我的代码会发送到服务器吗？
不会。所有转换都在浏览器本地完成，您的 HTML 代码不会上传或传输到任何服务器，确保您的工作完全私密。
可以在手机上使用吗？
可以，该工具完全响应式，支持所有设备，包括智能手机、平板和桌面电脑。