[JavaScript] 網頁渲染的過程 (rendering pipline)
前幾天在hahow上 動畫互動網頁程式入門 (HTML/CSS/JS)
這沒有要打廣告，不過老師真的教得不錯
看到講師上到實作購物車時候
其中某一個function利用多個(json)物件組出list清單
而新增、刪除都是對物件操作，再透過function把list清單清空再繪製
！！！！這看起來有問題，講師怎麼這樣做，這項目很多時，捲軸會有問題，這一定有bug
程式狂想筆記
[CSS] checkbox hack 模擬在網頁開視窗
http://jsbin.com/hapineqoca/edit?css,output
[CSS] margin 排版問題(Collapsing margins)
http://geekplux.com/2014/03/14/collapsing_margins.html
垂直
https://read01.com/gm0eN.html
css - Margin collapse on inline-block elements? - Stack Overflow
http://stackoverflow.com/questions/25455932/margin-collapse-on-inline-block-elements
collapsed margin
http://geekplux.com/2014/03/14/collapsing_margins.html
inline-block不會有影響
block只影響上下，左右不會
先記錄先
[CSS]width:auto不等於100%
最近在公司發現排版有問題，出現不該出現的捲軸
CSS原本以為是width:100%，應該調一下box-sizing :border-sizing
結果還是一樣有問題….
後來發現auto，就不會有問題
不過當然要思考這兩個屬性差異
之後我認為width 沒設就是100%
但後來Google一下，發現我錯了，預設是auto (我也以為auto也是100%)
‘margin-left’ + ‘border-left-width’ + ‘padding-left’ + ‘width’ + ‘padding-right’ + ‘border-right-width’ + ‘margin-right’ = width of containing block
http://www.456bereastreet.com/archive/201112/the_difference_between_widthauto_and_width100/
身為英文苦手不知道寫什麼意思，後來有爬到中文文章
内容的寬度=‘margin-left’ + ‘border-left-width’ + ‘padding-left’ + ‘width’ + ‘padding-right’ + ‘border-right-width’ + ‘margin-right’
如果’margin-left’ + ‘border-left-width’ + ‘padding-left’ + ‘padding-right’ + ‘border-right-width’ + ‘margin-right’比較大，就減小width的值，如果比較小呢，就增大width的值，使其滿足上面的表達式。
http://m.studyofnet.com/news/965.html
總結一下，上面意思就是width:auto後，寬度算法會'margin-left' + 'border-left-width' + 'padding-left' + 'padding-right' + 'border-right-width' + 'margin-right' >width，就會自動縮減width寬度；'margin-left' + 'border-left-width' + 'padding-left' + 'padding-right' + 'border-right-width' + 'margin-right' <width，就會自動增加width寬度
[JavaScript] IE/W3C Event用法大不同
整個就悲劇。
[HTML]dd 裡面不能故放入dd標籤
dd裡面不能放入dd標籤
用了一整天的畫面問題
在找漏掉結尾的html tag
結果…採到這個雷 囧
[JavaScript]JSONP為什麼不能用POST
為什麼JSONP不能使用POST?
因為JSONP透過script標籤實作
所以才沒辦法做
[JavaScript] JSONP 小實作
很久之前，有看過JSONP文章，雖然有看一下實作原理都懂，但沒有動手做實作
前幾天看到有人討論JSONP不能用POST方法去做
這就讓我非常好奇是怎麼一回事
用Qunit驗證身份證
最近copy到公司身份證驗證程式有問題
好險是上線前發現
今天就簡單用測試程式寫了QUNIT測試程式
不用程式寫爬蟲記錄(Kimono Desktop)
前幾天看到無痛爬梳自己來，用 Google Spreadsheet 爬取網頁資料
就想之前的Kimono
但現在官網要收掉這個服務
不過有官網友留下kimono desktop edition 離線版程式使用(只有MAC和Windows)
目前不知道有沒有辦法移植到Linux上面玩
| kimonolabs.com | kimono for desktop | |
|---|---|---|
| Create APIs with Chrome Ext | v | |
| Create APIs with Bookmarklet | v | v |
| Manage and configure APIs | v | v |
| Run APIs manually | v | |
| Run APIs on a schedule | v | |
| Cloud hosted API endpoints | v (w/ Firebase) | |
| Crawling & Pagination | v | v |
| Get data behind a login | v | v |
| Kimono Apps / Blocks | v | |
| Google sheets integration | v | |
| Webhooks & Email alerts | v | |
| Save scraped data to file | v | v |
| CSV & RSS output | v | v |
當然離線版沒有這麼多功能，可惜沒有排程可以用
但發現他程式透過NodeJS去寫，好像可以透過API方式去實作
在此先記錄一下筆記