標籤: javascript

iframe 父頁與子頁互相呼叫的方法 (使用 frame 呼叫)

HTML iframe 很常使用，遇到內外(父頁與子頁)想要互相溝通的時候，要怎麼做呢？

此篇使用 HTML frames 的 呼叫方式來說明

閱讀全文〈iframe 父頁與子頁互相呼叫的方法 (使用 frame 呼叫)〉

JavaScript 預覽連結 要如何修改

在網頁滑鼠移到連結上，在最下方會出現預覽的網址，以前是修改 status 或 statusbar (已經忘記，現在也沒辦法實驗了)

ex: <a href="" onmouseover="window.status='https://blog.longwin.com.tw';">link</a>

要怎麼作到滑鼠移到連結上，下面出現想要出現的文字呢？

閱讀全文〈JavaScript 預覽連結 要如何修改〉

Facebook 推出 Prepack 給 JavaScript 壓縮、最佳化工具

Facebook 推出 Prepack 的工具，讓 JavaScript 開發出來的程式除了檔案更小外，更厲害的地方在於速度更快。

註：Prepack 跟 Google closure compiler 很類似，有哪些差異尚未比較

閱讀全文〈Facebook 推出 Prepack 給 JavaScript 壓縮、最佳化工具〉

查看網頁各階段載入速度的 Bookmarklet

網頁載入有多少 request、查多少 Domain，總共花費多少時間... 等等，此 JavaScript 可以接撈出一個頁面整合查看。

閱讀全文〈查看網頁各階段載入速度的 Bookmarklet〉

簡易的 jQuery CSS Selector 替代寫法

在 DK 的 Blog  看到此技巧：簡易的 jQuery CSS Selector 替代品

jQuery 的寫法 $(...) 簡短也好記，JavaScript 原生想要用類似的寫法，只需要一行即可達成。

const $ = document.querySelector.bind(document);

註：上述方式並非 fluent interface，無法像 jQuery 持續串接下去

範例

const $ = document.querySelector.bind(document);
$('ul').style.color = "red";

取自

好站: jQuery 對應 純JavaScript 的程式碼

IE9 後，JavaScript 在各個新版瀏覽器的語法差距越來越小，語法也簡化了不少，可以考慮慢慢移除 jQuery 的支持了，而且整個速度會快很多。

這個網站把 jQuery 的 function 列出來，並且跟 純JavaScript 程式碼做對照，直接複製貼上就可以轉換。

HTML5 寫的線上遊戲 - 終極動員令

以前在 Windows 玩的遊戲 - C&C 終極動員令，有人用 JavaScript 寫出來，現在在瀏覽器就可以玩囉~

Exploring ES6 - JavaScript 免費線上電子書

JavaScript 到底要怎麼開始學？標準是什麼？什麼是 ECMAScript 5？什麼是 ES6？

這本書的語法目前還無法在瀏覽器上使用，Node.js 新版的有支援到 ES6，要實作可以安裝 Node.js 來練習。

下面這本書也很棒：

 

Linux Bash 監控檔案修改 執行即時合併

JavaScript 常常會需要修改後，執行壓縮等動作，常見的會是用 grunt 做類似下述命令：

不過要做檔案合併、檢查、壓縮..  等等，應該不用這麼費工，Shell 就可以做到，於是簡單的寫了一套。

註：整個程式只有兩個檔案，全部內容只有5行，相信修改應該沒有難度。(程式語言：Linux 的 Bash Shell)

閱讀全文〈Linux Bash 監控檔案修改 執行即時合併〉