近来,很久没看阮大佬的周分享,在文章中看到一个开源库,神奇的一段代码,忍不住star了, 目前star数量为2038,项目名也是很响亮,TinyEditor, 最小的编辑器,屌,屌,屌
链接TinyEditor
<body oninput="i.srcdoc=h.value+'<style>'+c.value+
'</style><script>'+j.value+'<\/script>'">
<style>
textarea,
iframe {
width: 100%;
height: 50%
}
body {
margin: 0
}
textarea {
width: 33.33%;
font-size: 18
}
</style>
<textarea placeholder=HTML id=h></textarea>
<textarea placeholder=CSS id=c></textarea>
<textarea placeholder=JS id=j></textarea>
<iframe id=i>
项目就一个index.html 上面是全部代码
也可以直接复制git项目中代码(这里叫代码合适点)到浏览器地址栏
截图一波,这布局不就是codepen的雏形嘛,
srcdoc
srcdoc 属性规定页面的 HTML 内容显示在行内框架中
属性值是显示在框架中的 HTML 内容。必须是有效的 HTML 语法。