js – 這世上 沒有偶然 只有必然 https://wordpress.lokidea.com 幻幽的小小分享區 Wed, 17 Aug 2016 15:00:41 +0000 zh-TW hourly 1 網頁編輯器與語法高亮-研究篇【230/366】 https://wordpress.lokidea.com/1187/%e7%b6%b2%e9%a0%81%e7%b7%a8%e8%bc%af%e5%99%a8%e8%88%87%e8%aa%9e%e6%b3%95%e9%ab%98%e4%ba%ae-%e7%a0%94%e7%a9%b6%e7%af%87%e3%80%90230-366%e3%80%91/ https://wordpress.lokidea.com/1187/%e7%b6%b2%e9%a0%81%e7%b7%a8%e8%bc%af%e5%99%a8%e8%88%87%e8%aa%9e%e6%b3%95%e9%ab%98%e4%ba%ae-%e7%a0%94%e7%a9%b6%e7%af%87%e3%80%90230-366%e3%80%91/#respond Wed, 17 Aug 2016 15:00:41 +0000 https://wordpress.lokidea.com/?p=1187 閱讀全文 網頁編輯器與語法高亮-研究篇【230/366】]]> 10 Best jQuery and HTML5 WYSIWYG Plugins
參考這篇，列出10個即見即所得的編輯器
Wordpress內含的TinyMCE也在其中呢

  1. Froala
  2. ContentTools
  3. Raptor Editor
  4. Aloha Editor
  5. TinyMCE
  6. bootstrap3-wysiwyg
  7. Summernote
  8. CKEditor
  9. Trumbowyg
  10. Redactor

其他文章：
20 Awesome WYSIWYG and jQuery Text Editor Plugins – DesignHuntR
25+ jQuery Wysiwyg Editor Plugin with Example Demo

語法高亮有找到支援滿多語法跟樣式的js lib
highlight.js
Github上面應該是最多人star的repo了
支援顯示的程式語言166種
能選擇的樣式有77種

]]> https://wordpress.lokidea.com/1187/%e7%b6%b2%e9%a0%81%e7%b7%a8%e8%bc%af%e5%99%a8%e8%88%87%e8%aa%9e%e6%b3%95%e9%ab%98%e4%ba%ae-%e7%a0%94%e7%a9%b6%e7%af%87%e3%80%90230-366%e3%80%91/feed/ 0 Cocycles-查詢Javascript片段程式碼的服務【214/366】 https://wordpress.lokidea.com/1136/cocycles-%e6%9f%a5%e8%a9%a2javascript%e7%89%87%e6%ae%b5%e7%a8%8b%e5%bc%8f%e7%a2%bc%e7%9a%84%e6%9c%8d%e5%8b%99%e3%80%90214-366%e3%80%91/ https://wordpress.lokidea.com/1136/cocycles-%e6%9f%a5%e8%a9%a2javascript%e7%89%87%e6%ae%b5%e7%a8%8b%e5%bc%8f%e7%a2%bc%e7%9a%84%e6%9c%8d%e5%8b%99%e3%80%90214-366%e3%80%91/#respond Mon, 01 Aug 2016 13:42:57 +0000 https://wordpress.lokidea.com/?p=1136 閱讀全文 Cocycles-查詢Javascript片段程式碼的服務【214/366】]]> Find JavaScript Code Snippets by Functionality with Cocycles
這篇剛好寫到這個服務
現在只有提供JS的code片段搜尋

用function名稱的方式做搜尋
cocycles的首頁上面還有寫出未來會提供
Ruby, Java, PHP, Python 這四種語言的搜尋
內容目前只有github的專案
不過版面格式感覺比github好很多
畢竟搜尋的方式不太一樣
 

]]> https://wordpress.lokidea.com/1136/cocycles-%e6%9f%a5%e8%a9%a2javascript%e7%89%87%e6%ae%b5%e7%a8%8b%e5%bc%8f%e7%a2%bc%e7%9a%84%e6%9c%8d%e5%8b%99%e3%80%90214-366%e3%80%91/feed/ 0 JSFiddle-前端的實驗平台【190/366】 https://wordpress.lokidea.com/1067/jsfiddle-%e5%89%8d%e7%ab%af%e7%9a%84%e5%af%a6%e9%a9%97%e5%b9%b3%e5%8f%b0%e3%80%90190-366%e3%80%91/ https://wordpress.lokidea.com/1067/jsfiddle-%e5%89%8d%e7%ab%af%e7%9a%84%e5%af%a6%e9%a9%97%e5%b9%b3%e5%8f%b0%e3%80%90190-366%e3%80%91/#respond Fri, 08 Jul 2016 15:23:53 +0000 https://wordpress.lokidea.com/?p=1067 閱讀全文 JSFiddle-前端的實驗平台【190/366】]]> JSFiddle 跟昨天介紹的CodePen是類似的平台
都是使用HTML、CSS、JS
去寫相關的Code用來展示一些功能或是測試自己寫的功能使用的

JSFiddle 首頁進去就可以直接寫code，也支援群組對談
而 CodePen 則是首頁可以看到很多的範例，社交性比較強
有機會再來比較這類網站的功能差異吧

]]> https://wordpress.lokidea.com/1067/jsfiddle-%e5%89%8d%e7%ab%af%e7%9a%84%e5%af%a6%e9%a9%97%e5%b9%b3%e5%8f%b0%e3%80%90190-366%e3%80%91/feed/ 0 js相關的排名【188/366】 https://wordpress.lokidea.com/1061/js%e7%9b%b8%e9%97%9c%e7%9a%84%e6%8e%92%e5%90%8d%e3%80%90188-366%e3%80%91/ https://wordpress.lokidea.com/1061/js%e7%9b%b8%e9%97%9c%e7%9a%84%e6%8e%92%e5%90%8d%e3%80%90188-366%e3%80%91/#respond Wed, 06 Jul 2016 15:21:48 +0000 https://wordpress.lokidea.com/?p=1061 閱讀全文 js相關的排名【188/366】]]> https://stats.js.org/
這頁面列出了一萬個js相關的專案

js.org 這也是js相關的網站
大家可以連進去看看!~!
雖然內容也是只有英文

另外，JS現在真的是開枝散葉呢!!
之後也會針對 js 相關會有更多的文章
因為自己也想要往這塊去研究

]]> https://wordpress.lokidea.com/1061/js%e7%9b%b8%e9%97%9c%e7%9a%84%e6%8e%92%e5%90%8d%e3%80%90188-366%e3%80%91/feed/ 0 jQuery 3.0.0【187/366】 https://wordpress.lokidea.com/1058/jquery-3-0-0%e3%80%90187-366%e3%80%91/ https://wordpress.lokidea.com/1058/jquery-3-0-0%e3%80%90187-366%e3%80%91/#comments Tue, 05 Jul 2016 15:51:11 +0000 https://wordpress.lokidea.com/?p=1058 閱讀全文 jQuery 3.0.0【187/366】]]> 這次的版本更新
關注度真是非常低呢~!
2016/6/9號釋出以後，相關的文章非常的少
幾乎只有官方的文件

jQuery 3.0 Final Released!
jQuery Core 3.0 Upgrade Guide
 

]]> https://wordpress.lokidea.com/1058/jquery-3-0-0%e3%80%90187-366%e3%80%91/feed/ 1 Mithril-感覺很厲害的Js Framework【82/366】 https://wordpress.lokidea.com/672/mithril-%e7%9c%8b%e8%b5%b7%e4%be%86%e5%be%88%e5%8e%b2%e5%ae%b3%e7%9a%84js-framework%e3%80%9082-366%e3%80%91/ https://wordpress.lokidea.com/672/mithril-%e7%9c%8b%e8%b5%b7%e4%be%86%e5%be%88%e5%8e%b2%e5%ae%b3%e7%9a%84js-framework%e3%80%9082-366%e3%80%91/#respond Tue, 22 Mar 2016 15:50:38 +0000 https://wordpress.lokidea.com/?p=672 閱讀全文 Mithril-感覺很厲害的Js Framework【82/366】]]> 昨天看過Flarum的原始碼
發現了很厲害了js framework
看首頁介紹
Loading跟Rendering都比知名的js framework還要快

框架名稱：Mithril
官方網站：http://mithril.js.org/
Github：https://github.com/lhorie/mithril.js

大家可以去他的官方網站上面看介紹
我改天也來套用專案玩玩看
感覺很厲害的框架!!!

]]> https://wordpress.lokidea.com/672/mithril-%e7%9c%8b%e8%b5%b7%e4%be%86%e5%be%88%e5%8e%b2%e5%ae%b3%e7%9a%84js-framework%e3%80%9082-366%e3%80%91/feed/ 0 前端開發中文資源【42/366】 https://wordpress.lokidea.com/547/%e5%89%8d%e7%ab%af%e4%b8%ad%e6%96%87%e8%b3%87%e6%ba%90%e3%80%9042-366%e3%80%91/ https://wordpress.lokidea.com/547/%e5%89%8d%e7%ab%af%e4%b8%ad%e6%96%87%e8%b3%87%e6%ba%90%e3%80%9042-366%e3%80%91/#respond Thu, 11 Feb 2016 07:00:32 +0000 https://wordpress.lokidea.com/?p=547 閱讀全文 前端開發中文資源【42/366】]]> 昨天找Font Awesome相關資料的時候
剛好看到中文的資源站
版本還停在3.0.2
不過主站的前端開發資料滿齊全的

網站名稱：Bootstrap中文网
網址：http://www.bootcss.com/


主要都是bootstrap與前端開發的中文資源
以下列出此站首頁所有的連結資源

  1. Bootstrap 编码规范 by @mdo
  2. jQuery API 中文手册
  3. Open CDN 开放CDN服务
  4. 优站精选 Bootstrap网站实例
  5. gulp.js 基于流的自动化构建工具
  6. LESS 一种动态样式语言
  7. Lodash JavaScript 工具库
  8. Underscore.js JavaScript 工具库
  9. Buttons CSS按钮样式库
  10. stickUp 让页面元素“固定”位置
  11. Responsive Nav 响应式导航
  12. Unslider jQuery轮播插件
  13. Flat UI Metro风格的Bootstrap
  14. LayoutIt! Bootstrap可视化布局
  15. Bootstrap Switch Bootstrap开关组件
  16. Sco.js Bootstrap组件增强版
  17. iCheck 增强复选框和单选按钮
  18. bootstrap-wysiwyg 为Bootstrap定制的可视编辑器
  19. Chart.js 精巧的JS图表绘制工具库
  20. Preboot Bootstrap之前世
  21. jQuery.Pin 固定页面元素的jQuery插件
  22. Bsie Bootstrap IE6兼容方案
  23. Messenger 非常酷的弹框(Alert)组件
  24. DateTime Picker 日期时间选择器
  25. jQuery UI Bootstrap 用Bootstrap美化jQuery UI
  26. Google Bootstrap Google风格的Bootstrap
  27. Metro UI CSS Bootstrap与Metro融合
  28. Font Awesome Bootstrap专用图标字体
  29. Simple Icons Icon汇
  30. Bootstrap Form Builder 在线表单构造器
  31. HTML5 Boilerplate 专业的前端模版
  32. Web Safe Colors Web安全色
  33. Bootstrap Docs Bootstrap文档全集
  34. Git Guide Git简易指南
  35. Grumble.js 气泡形状的提示（Tooltip）控件
  36. CIKONSS 纯CSS实现的Icon
  37. Headroom.js 隐藏或展示页面元素
  38. Grunt 项目构建工具
  39. Zepto.js JavaScript 工具库

中文翻譯以後，不見得每個站都有持續維護
有機會再來更新更新這些專案的情況吧

]]> https://wordpress.lokidea.com/547/%e5%89%8d%e7%ab%af%e4%b8%ad%e6%96%87%e8%b3%87%e6%ba%90%e3%80%9042-366%e3%80%91/feed/ 0 當頁面載入完成… https://wordpress.lokidea.com/359/%e7%95%b6%e9%a0%81%e9%9d%a2%e8%bc%89%e5%85%a5%e5%ae%8c%e6%88%90/ https://wordpress.lokidea.com/359/%e7%95%b6%e9%a0%81%e9%9d%a2%e8%bc%89%e5%85%a5%e5%ae%8c%e6%88%90/#respond Tue, 11 Aug 2015 15:55:01 +0000 https://wordpress.lokidea.com/?p=359 閱讀全文 當頁面載入完成…]]> 前端用jQuery的話，

$(document).ready(function() {
  //do work
});

用純js的話，

document.addEventListener("DOMContentLoaded", function(event) {
  //do work
});


原始連結

]]> https://wordpress.lokidea.com/359/%e7%95%b6%e9%a0%81%e9%9d%a2%e8%bc%89%e5%85%a5%e5%ae%8c%e6%88%90/feed/ 0 [前端]中文urlencode,urldecode的問題-純js https://wordpress.lokidea.com/303/%e5%89%8d%e7%ab%af%e4%b8%ad%e6%96%87urlencodeurldecode%e7%9a%84%e5%95%8f%e9%a1%8c-%e7%b4%94js/ https://wordpress.lokidea.com/303/%e5%89%8d%e7%ab%af%e4%b8%ad%e6%96%87urlencodeurldecode%e7%9a%84%e5%95%8f%e9%a1%8c-%e7%b4%94js/#respond Fri, 03 Jul 2015 15:55:30 +0000 https://wordpress.lokidea.com/?p=303 閱讀全文 [前端]中文urlencode,urldecode的問題-純js]]> 這問題真的挺少見的
筆記一下

問題情況：
有某中文字串，經過urlencode過，需要使用urldecode，
但是原始字串編碼並非是UTF-8，所以不能直接使用js 的urldecode function
但是又不能使用後端解碼，只能用js處理

網路上搜尋過後，
最常見的解法
就是在JS裡面寫一段解碼表，把utf-8(en) -> big5(de)
找到一段轉換code 連結
網路上也有轉換的線上站 連結
但是不能用這麼多的js code
於是，另外找了其他作法
(造福中国前端界）纯前端Js完美解决各种汉字urlencode,urldecode，编码解码问题，不借助任何字库，内码表，轻松一行，兼容IE8+，chrome，firefox，safari等主流浏览器
範例網址
github source code link

以下為未整理的相關資料
http://fanli7.net/a/bianchengyuyan/C__/20130530/360927.html
http://blog.darkthread.net/post-2008-07-16-querystring-encoding.aspx

]]> https://wordpress.lokidea.com/303/%e5%89%8d%e7%ab%af%e4%b8%ad%e6%96%87urlencodeurldecode%e7%9a%84%e5%95%8f%e9%a1%8c-%e7%b4%94js/feed/ 0