热门标签 | HotTags
当前位置:  开发笔记 > 编程语言 > 正文

仅一行代码,打造一个在线编辑器

在大部分人眼里,技术宅给人的印象是沉默寡言,总摸不透他心里想些什么,彼此都保持距离。作为半个程序员,我觉得真正的技术宅大部分时间都在找乐子,鼓捣各种想法,和大部分人的极客心理是一样

  在大部分人眼里,技术宅给人的印象是沉默寡言,总摸不透他心里想些什么,彼此都保持距离。作为半个程序员,我觉得真正的技术宅大部分时间都在找乐子,鼓捣各种想法,和大部分人的极客心理是一样的,程序员也还爱讲笑话,也喜欢烧菜做饭,虽然大多是为了减减压,这样看来和常人没什么不一样。

  不一样的地方,技术宅崇尚极致,喜欢极简,又希望简约不简单,背后就是技术宅满心思的不断的尝试,我正在看着一出好戏在上演:

仅一行代码,打造一个在线编辑器

"程序员 Jose Jesus Perez Aguinaga 在 CoderWall 分享了一个小技巧:在浏览器地址栏中输入一行代码:data:text/html, ,回车即可把浏览器变临时编辑器(需要浏览器支持 HTML5 属性 contenteditable)。不少程序员受 Jose 的启发,开始对这行代码加工改造,比如改成支持 Ruby 语法高亮的编辑器……"

  从引子中可以看到,本来只是简短的小段代码: data:text/html, ,经过程序员们不断改造,从一个简单的可编辑页面,逐步变成了包括支持 java、Ruby、Python 等多种 编程语言高亮的代码编辑器,截至不到 1 个小时的最后更新,我已经看到了一个和 notepad.cc 网站功能相近,使用了第三方网站数据库 API 服务存储内容的 在线编辑器 了:

 data:text/html,  

  将以上代码完整复制,粘贴到 Chrome 或者 Firefox,Safari 浏览器地址栏中(不支持低版本 IE 浏览器),回车打开,稍等片刻一个支持 CTRL + S 保存内容的在线编辑器呈现眼前。

  仅一行代码,实现功能相当于系统的记事本程序,感慨技术宅的艺术造诣吧?~

欢迎大家阅读《仅一行代码,打造一个在线编辑器》,跪求各位点评,若觉得好的话请收藏本文,by



推荐阅读
  • HTML前端开发:UINavigationController与页面间数据传递详解
    本文详细介绍了如何在HTML前端开发中利用UINavigationController进行页面管理和数据传递,适合初学者和有一定基础的开发者学习。 ... [详细]
  • Bootstrap Paginator 分页插件详解与应用
    本文深入探讨了Bootstrap Paginator这款流行的JavaScript分页插件,提供了详细的使用指南和示例代码,旨在帮助开发者更好地理解和利用该工具进行高效的数据展示。 ... [详细]
  • 在使用 Nginx 作为服务器时,发现 Chrome 能正确从缓存中读取 CSS 和 JS 文件,而 Firefox 却无法有效利用缓存,导致加载速度显著变慢。 ... [详细]
  • 本文探讨了如何通过优化 DOM 操作来提升 JavaScript 的性能,包括使用 `createElement` 函数、动画元素、理解重绘事件及处理鼠标滚动事件等关键主题。 ... [详细]
  • 我的读书清单(持续更新)201705311.《一千零一夜》2006(四五年级)2.《中华上下五千年》2008(初一)3.《鲁滨孙漂流记》2008(初二)4.《钢铁是怎样炼成的》20 ... [详细]
  • OBS Studio自动化实践:利用脚本批量生成录制场景
    本文探讨了如何利用OBS Studio进行高效录屏,并通过脚本实现场景的自动生成。适合对自动化办公感兴趣的读者。 ... [详细]
  • 解决JavaScript中法语字符排序问题
    在开发一个使用JavaScript、HTML和CSS的Web应用时,遇到从SQLite数据库中提取的法语词汇排序不正确的问题,特别是带重音符号的字母未按预期排序。 ... [详细]
  • Markdown 编辑技巧详解
    本文介绍如何使用 Typora 编辑器高效编写 Markdown 文档,包括代码块的插入方法等实用技巧。Typora 官方网站:https://www.typora.io/ 学习资源:https://www.markdown.xyz/ ... [详细]
  • 本文详细介绍了iOS应用的生命周期,包括各个状态及其转换过程中的关键方法调用。 ... [详细]
  • Jupyter Notebook多语言环境搭建指南
    本文详细介绍了如何在Linux环境下为Jupyter Notebook配置Python、Python3、R及Go四种编程语言的环境,包括必要的软件安装和配置步骤。 ... [详细]
  • 小编给大家分享一下Vue3中如何提高开发效率,相信大部分人都还不怎么了解,因此分享这篇文章给大家参考一下,希望大家阅读完这篇文章后大有收获, ... [详细]
  • protobuf 使用心得:解析与编码陷阱
    本文记录了一次在广告系统中使用protobuf进行数据交换时遇到的问题及其解决过程。通过这次经历,我们将探讨protobuf的特性和编码机制,帮助开发者避免类似的陷阱。 ... [详细]
  • 本文详细探讨了在Web开发中常见的UTF-8编码问题及其解决方案,包括HTML页面、PHP脚本、MySQL数据库以及JavaScript和Flash应用中的乱码问题。 ... [详细]
  • Web前端开发的职业前景与就业指南
    随着互联网行业的蓬勃发展,Web前端技术因其在用户界面和交互设计中的关键作用而备受企业重视。本文探讨了前端开发的职业前景,以及应届毕业生如何提高自己的竞争力。 ... [详细]
  • Windows环境下Python和pip命令无法识别的解决方案
    本文详细介绍了在Windows操作系统中遇到Python和pip命令无法识别的问题时的解决方法,帮助初学者快速配置Python开发环境。 ... [详细]
author-avatar
安彬2502936127
这个家伙很懒,什么也没留下!
PHP1.CN | 中国最专业的PHP中文社区 | DevBox开发工具箱 | json解析格式化 |PHP资讯 | PHP教程 | 数据库技术 | 服务器技术 | 前端开发技术 | PHP框架 | 开发工具 | 在线工具
Copyright © 1998 - 2020 PHP1.CN. All Rights Reserved | 京公网安备 11010802041100号 | 京ICP备19059560号-4 | PHP1.CN 第一PHP社区 版权所有