修改了 HTML字元檢視小工具 ,練練手,學學JS

2021-04-15 06:20:38 字數 1440 閱讀 1873

前天難得工作上得空,就把以前的乙個 jscript 小東西改了改。

這是以前閒時寫的乙個html特殊字元檢視器(http://ling**m.googlepages.com/char.html),裡面的 js **比較傳統,是乙個個函式完成的。在看了一眼prototype ajax (http://www.prototypejs.org/) 的**後,也想嘗試著用類的方式來寫 js **。

這個 js 類庫,我沒有深入學習,具體的功能細節不清楚,甚至沒用過個這類庫,讓我感興趣的是乙個很無聊的原因,那就是之前我根本不知道,原來還可以用「:」來定義類成員,在這之前,我都是定義乙個函式,再參照 m$ 官方手冊上的說明,用 prototype 來為類追加方法函式。發現了這個語法元素後,我一直想用用,正巧有空,就開啟文字編輯器,將它改了一遍,順便用定時器來動態建立字元列表。

以前顯示字元表,是在乙個迴圈裡做的,當時也想做成動態顯示,因此都是 createelement,而不是用 innerhtml,然而結果是瀏覽器在方法執行過程中,沒有及時的重新整理頁面,效果根本出不來,而且顯示速度,比 innerhtml要低(這點已經有朋友在我上次的帖子裡提過了,當時我也未作解釋),乙個是後台多次渲染,乙個是完了一次渲染的緣故吧。

另外,發現乙個問題,就是引用類自身屬性給其它成員賦值,會引用不到。

var charview = ,

viewmode: this.viewmodetype.block,

.....

這裡,viewmode 要引用類中的 viewmodetype,由於類還沒有被例項化,因此 this 是引用不到的,在執行中,viewmode 並未被賦值。(以上的分析是未作驗證的,只是猜測)

在沒有更好的辦法前,於是在 charview 變數之前,定義了乙個 common 變數,最終的**是:

charview: null

};var charview = {   

cssclassattributename: (common.browser.ie ? "classname" : "class"),

viewmode: common.viewmode.block,

charsarray: null,

在載入過程中,為了提醒使用者,特意追加 loading,字型使用了 css 的 text-decoration: blink,不過在 ie 下沒有效果,只有在 firefox 中才會閃爍,有個提示就夠了,不是必須要閃爍,沒必要追加 js 控制閃爍。

當然了,這個 html 小頁面,沒有多大的實際使用價值,不過,拿來業餘練練手,讓自己保持學習狀態,還是有意義的。

最後:文字編輯器 notepad++ (http://notepad-plus.sourceforge.net/tw/site.htm) 真的比較強,雖然在公司裡用的是 editplus 和 ue,但 notepad++ 是免費的,功能也已經強大得完全足夠我用了,所以特別向大家推薦,美中不足的是,它的快捷方式圖示沒有 alpha 通道,顯示不平滑。

Image Watch檢視小工具

安裝imagewatch,雙擊imagewatch.vsix進行安裝即可 將影象儲存到指定的目錄 顯示影象大小 通道數 拖拽影象 可以檢視指定座標的畫素值 按照在記憶體中的順序顯示 link views 所有相同尺寸的影象共享乙個檢視 畫素值以十六進製制顯示還是十進位制顯示 在watch視窗可對影象...

wordpress 預設小工具修改表

wordpress 預設的邊欄小工具 寫在default widgets.php wp includes default widgets.php 此檔案中每個類對應乙個小工具,如修改 rss 樣式 來自任何 rss 或 atom feed 的條目 只要找到 wp widget rss 這一類修改即可...

動態修改日誌級別小工具

動態修改日誌級別 好處,主要是不用重啟線上的專案,調整列印日誌輸出級別 排查問題時,可以將日誌級別調低,方便快速定位,沒問題時,就級別調高,不列印。減少伺服器壓力 日誌五個級別是有順序的,debug info warn error fatal,分別用來指定這條日誌資訊的重要程度,明白這一點很重要,這...