在线免费 HTML 预览工具

在线体验

作用:可以直接预览 html 的页面效果。

https://houbb.github.io/tools/html-preview.html

创作背景

有时候用手机查阅资料时,获取到一段 html 代码,但是无法查看对应的实际效果。

特别是苹果系统,没啥简单的方法,于是就想着自己实现一个,直接预览页面的效果。

核心代码

js 复制代码
<textarea id="html-input" placeholder="请输入HTML代码..."></textarea>

<button οnclick="updatePreview()">预览</button>

<div class="preview-pane">
    <iframe id="preview-frame"></iframe>
</div>

function updatePreview() {
    const input = document.getElementById('html-input').value;
    const iframe = document.getElementById('preview-frame');
    iframe.srcdoc = input;
}

参考资料

https://houbb.github.io/2025/02/05/tools-html-prefix

相关推荐
烛影摇红透纱窗1 小时前
ForkJoinPool 与工作窃取
java
浩瀚地学1 小时前
【面试算法笔记】0302-哈希表-哈希表实现
java·经验分享·笔记·算法·面试
AC赳赳老秦1 小时前
时间开销自动统计:OpenClaw 记录工作任务时长、分析时间分配、给出优化建议
java·大数据·开发语言·python·自动化·deepseek·openclaw
名侦探7222 小时前
构建 Agent 的五大难点与解决方案
java·大数据·人工智能
Demons_kirit2 小时前
图库原理(以阿里云OSS为案例)
java·阿里云·云计算
SimonKing2 小时前
那个号称"对标 Spring"的国产框架 Solon,到底行不行?
java·后端·程序员
Lethehong2 小时前
飞算Java:从需求梳理到风险闭环,搭建云盾企业信息安全与权限管理平台
java·开发语言
霸道流氓气质2 小时前
SpringBoot中使用字典驱动的动态路由示例
java·spring boot·后端
学计算机的计算基2 小时前
操作系统八股文:进程与线程全面梳理(附调度算法+IPC+锁机制)
java·算法
wuqingshun3141593 小时前
请描述简单工厂模式的工作原理
java·简单工厂模式