JS 运行器
关于代码运行器
在线代码编辑器集 HTML、CSS、JavaScript 三合一，让您可以快速编写、预览和调试前端代码。支持多项目管理、实时预览、代码格式化，内置 Monaco 编辑器提供专业级编码体验。
功能特点
- 三合一编辑：HTML、CSS、JavaScript 分栏编辑
- 实时预览：自动运行模式下代码修改即时生效
- 代码格式化：一键美化 HTML / CSS / JS 代码
- 多项目管理：最多 20 个项目互不干扰
- 代码自动保存到浏览器本地存储
- 支持 8 种编辑器主题
- Ctrl+Enter 运行、Ctrl+S 格式化
使用步骤
1
编写代码
在 HTML / CSS / JS 标签之间切换，分别编写对应的代码。
2
预览效果
开启自动运行后修改即时预览，也可点击运行按钮手动刷新。
3
格式化代码
点击格式化按钮或按 Ctrl+S 一键美化当前编辑器中的代码。
4
管理项目
点击 + 号新建项目，双击项目名可重命名，每个项目独立保存。
使用技巧
开启自动运行可实时预览，关闭则需手动点击运行
切换到控制台标签查看 console.log 输出和错误信息
双击项目名可以重命名，方便管理多个代码片段
可以从示例下拉菜单中加载预设模板快速上手
常见问题
可以使用 npm 包吗？
目前不支持直接导入 npm 包。这是一个纯浏览器环境，只能使用浏览器原生 API。可以通过 HTML 中引入 CDN 脚本的方式使用第三方库。
代码会被保存吗？
是的，所有项目代码自动保存到浏览器本地存储中，刷新页面后仍可恢复。清除浏览器数据会导致保存的代码丢失。
预览中可以使用 Fetch 等异步 API 吗？
可以。预览在 iframe 沙箱中运行，支持 Fetch、Promise、async/await 等异步操作。异步输出会实时显示在控制台中。
运行代码安全吗？
代码在 iframe 沙箱中运行，与主页面隔离。但请注意不要运行来源不明的代码。
相关工具推荐
隐私安全保障
您的文件完全在浏览器本地处理，不会上传到任何服务器。处理完成后，文件仅保存在您的设备中，我们无法访问您的任何数据。