一行代碼將瀏覽器變記事本

時間 2019-11-15

原文原文鏈接

日常使用電腦的時候，常常要臨時記錄一些並不重要但一下子就要用到的內容，打開編輯器新建一個文件寫進去嗎？不，編輯器上都是我在寫的代碼，寫個臨時文件進去是挑戰個人潔癖啊。javascript

下面傳授你們一個將這些臨時文字記錄的瀏覽器裏的方法，只須要新建一個標籤頁，在地址欄輸入如下內容：css

data:text/html, <html contenteditable>

點擊瀏覽器的頁面，是否是能夠輸入內容了，一秒鐘瀏覽器變記事本。將這頁加入書籤，下次只要點擊書籤就能建立一個空白可編輯的標籤頁了。這個原理是咱們使用了瀏覽器的 Data URI 格式特性，跟在瀏覽器地址欄裏輸入 javascript:alert('hello world'); 的原理是同樣的。不過惟一的要求是瀏覽器必需要支持 HTML 5。html

除此之外，你還能夠定義更多的內容（好比：CSS、JS 等）:java

data:text/html, <style type="text/css">.e { height: 100%; background: #000; color: #396; }</style><div class="e" contenteditable></div><script>...</script>

自動聚焦到輸入框：git

data:text/html, <textarea style="font-size: 2em; width: 100%; height: 100%; border: none; outline: none" autofocus />

這裏還有個朋友作了個更高級的，須要引用到外部 JS：Ruby Notepad Bookmarkletgithub

歡迎在評論裏留下你的改進版。瀏覽器

相關標籤/搜索

每日一句

每一个你不满意的现在，都有一个你没有努力的曾经。