awfice:基於瀏覽器的最小的office套件

分享和讨论Javascript相关的话题
回复
头像
ejsoon
圈圈精英
圈圈精英
帖子: 2254
注册时间: 2022年 11月 18日 17:36
为圈友点赞: 99 次
被赞次数: 99 次
联系:

awfice:基於瀏覽器的最小的office套件

帖子 ejsoon »

https://ejsoon.win/
天蒼人頡:發掘好玩事物
头像
ejsoon
圈圈精英
圈圈精英
帖子: 2254
注册时间: 2022年 11月 18日 17:36
为圈友点赞: 99 次
被赞次数: 99 次
联系:

富文本編輯器

帖子 ejsoon »

代码: 全选

data:text/html,<body><script>d=document;for(i=0;i<50;i++)d.body.innerHTML+='<div style="position:relative;width:90%;padding-top:60%;margin:5%;border:1px solid silver;page-break-after:always"><div contenteditable style=outline:none;position:absolute;right:10%;bottom:10%;left:10%;top:10%;font-size:5vmin>';d.querySelectorAll("div>div").forEach(e=>e.onkeydown=e=>{n=e.ctrlKey&&e.altKey&&e.keyCode-49,f="formatBlock",j="justify",x=[f,f,j+"Left",j+"Center",j+"Right","outdent","indent","insertUnorderedList"][n],y=["<h1>","<div>"][n],x&&d.execCommand(x,!1,y)})</script><style>@page{size:6in 8in landscape}@media print{*{border:0 !important}}
上次由 ejsoon 在 2023年 8月 4日 11:52,总共编辑 1 次。
https://ejsoon.win/
天蒼人頡:發掘好玩事物
头像
ejsoon
圈圈精英
圈圈精英
帖子: 2254
注册时间: 2022年 11月 18日 17:36
为圈友点赞: 99 次
被赞次数: 99 次
联系:

純文本編輯器

帖子 ejsoon »

代码: 全选

data:text/html,<body contenteditable style=line-height:1.5;font-size:20px>
上次由 ejsoon 在 2023年 8月 4日 11:53,总共编辑 1 次。
https://ejsoon.win/
天蒼人頡:發掘好玩事物
头像
ejsoon
圈圈精英
圈圈精英
帖子: 2254
注册时间: 2022年 11月 18日 17:36
为圈友点赞: 99 次
被赞次数: 99 次
联系:

表格

帖子 ejsoon »

代码: 全选

data:text/html,<table id=t><script>z=Object.defineProperty,p=parseFloat;for(I=[],D={},C={},q=_=>I.forEach(e=>{try{e.value=D[e.id]}catch(e){}}),i=0;i<101;i++)for(r=t.insertRow(-1),j=0;j<27;j++)c=String.fromCharCode(65+j-1),d=r.insertCell(-1),d.innerHTML=i?j?"":i:c,i*j&&I.push(d.appendChild((f=>(f.id=c+i,f.onfocus=e=>f.value=C[f.id]||"",f.onblur=e=>{C[f.id]=f.value,q()},get=_=>{v=C[f.id]||"";if("="!=v.charAt(0))return isNaN(p(v))?v:p(v);with(D)return eval(v.slice(1))},a={get},z(D,f.id,a),z(D,f.id.toLowerCase(),a),f))(document.createElement`input`)))</script><style>#t{border-collapse:collapse}td{border:1px solid gray;text-align:right}input{border:none;width:4rem;text-align:center}</style>
https://ejsoon.win/
天蒼人頡:發掘好玩事物
头像
ejsoon
圈圈精英
圈圈精英
帖子: 2254
注册时间: 2022年 11月 18日 17:36
为圈友点赞: 99 次
被赞次数: 99 次
联系:

畫板

帖子 ejsoon »

代码: 全选

data:text/html,<canvas id=v><script>d=document,d.body.style.margin=0,P="onpointer",c=v.getContext`2d`,v.width=innerWidth,v.height=innerHeight,c.lineWidth=2,f=0,d[P+"down"]=e=>{f=e.pointerId+1;e.preventDefault();c.beginPath();c.moveTo(e.x,e.y)};d[P+"move"]=e=>{f==e.pointerId+1&&c.lineTo(e.x,e.y);c.stroke()},d[P+"up"]=_=>f=0</script></canvas>
https://ejsoon.win/
天蒼人頡:發掘好玩事物
头像
ejsoon
圈圈精英
圈圈精英
帖子: 2254
注册时间: 2022年 11月 18日 17:36
为圈友点赞: 99 次
被赞次数: 99 次
联系:

html+css+js代碼編輯器

帖子 ejsoon »

代码: 全选

data:text/html,<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:18px;padding:0.5em}</style><textarea placeholder="HTML" id="h"></textarea><textarea placeholder="CSS" id="c"></textarea><textarea placeholder="JS" id="j"></textarea><iframe id="i"></iframe><script>document.querySelectorAll("textarea").forEach((t)=>t.addEventListener("keydown",function(t){var e,s;"Tab"==t.key&&(t.preventDefault(),e=this.selectionStart,s=this.selectionEnd,this.value=this.value.substring(0,e)+"  "+this.value.substring(s),this.selectionStart=this.selectionEnd=e+1)}))</script></body>
https://ejsoon.win/
天蒼人頡:發掘好玩事物
头像
ejsoon
圈圈精英
圈圈精英
帖子: 2254
注册时间: 2022年 11月 18日 17:36
为圈友点赞: 99 次
被赞次数: 99 次
联系:

計算器

帖子 ejsoon »

代码: 全选

data:text/html,<table style="text-align: center;width:80vw;margin: 0 auto;"><tbody><tr><td colspan="4"><textarea></textarea></td></tr></tbody><script>let d=document;let tbl=d.querySelector('tbody');let z=d.querySelector('textarea');let oc=(x)=>z.value+=x;let cl=()=>z.value='';let re=()=>{try{z.value=eval(z.value);}catch(error){cl();}};[[1,2,3,'+'],[4,5,6,'-'],[7,8,9,'*'],['C',0,'=','/']].forEach((a)=>{let r=d.createElement('tr');r.style.lineHeight='64px';tbl.appendChild(r);a.forEach((b)=>{let tb=d.createElement('tb');tb.innerText=b;tb.style.padding='16px';tb.style.border='1px solid';r.appendChild(tb);tb.onclick=b==='='?re:b==='C'?cl:()=>oc(b);})})</script></table>
https://ejsoon.win/
天蒼人頡:發掘好玩事物
回复

在线用户

正浏览此版面之用户: 没有注册用户 和 8 访客