網頁

第二篇:簡單介紹JavaScript內建物件

  1. String物件
  2. Array物件
  3. Date物件
  4. Math物件
  5. Error物件
  6. Common物件

建議使用右下方Popout按鍵來「全螢幕」觀看。


History

2010/5/7,整理為xmind;
2010/11/30,整理為Text。

String物件

HTML標籤的格式編排


Tag

說明

anchor()

傳回<a>string</a>標籤字串

big()

傳回<big>string</big>標籤字串

blink()

傳回<blink>string</blink>標籤字串(I.E不會閃)

bold()

傳回<b>string</b>標籤字串

fixed()

傳回<tt>string</tt>標籤字串

fontcolor(color)

傳回<font color="color">string</font>標籤字串

fontsize(size)

傳回<font size="size">string</font>標籤字串

italics()

傳回<i>string</i>標籤字串

link(url)

傳回<a href="url">string</a>標籤字串

small()

傳回<small>string</small>標籤字串

strike()

傳回<strike>string</strike>標籤字串

sub()

傳回<sub>string</sub>標籤字串

sup()

傳回<sup>string</sup>標籤字串

字串長度與大小寫


length

取得字串的長度

toLowerCase()

將字串的英文字母都轉換成小寫字母

toUpperCase()

將字串的英文字母都轉換成大寫字母

取得字串的指定字元


charAt(index)

取得參數index位置的字元,索引值是以0開始

charCodeAt(index)

取得參數index位置的Unicode統一字碼

子字串的搜尋


indexOf(string, index)

傳回第一次搜尋到字串的索引位置,如果沒有找到傳回-1,傳入的參數為搜尋的字串,index為開始搜尋的索引位置,如無index參數,則預設index=0

lastIndexOf(string)

如同indexOf()方法,不過是從尾搜尋到頭的反向搜尋

match(string)

如同indexOf()和lastIndexOf(),不過傳回的為找到的字串,如果沒有找到傳回null

search(string)

與indexOf()的功能相似

子字串的處理


replace(string1, string2)

將找到的string1子字串取代成為string2

split(string)

傳回Array物件,使用參數string作為分割的字串,將字串轉換成一個Array物件

substr(index, length)

從index開始取出length個字元

slice(index1,index2)

取出index1到index2間的子字串

substring(index1, index2)

取出index1到index2間的子字串

concat(string)

將string字串新增到String()物件的字串後
slice與substring差別在負數處理不同
slice將負數當成從字串尾往前計數

var sWord = "1234567890"
            document.write(slice(2,-3));
            //第一個index(2)會從3開始
            //第二個index(-3)會從從尾到數三個後的下一個開始取值
            //Ans: 34567
   
用白話來講就是:從index2開始取,取到數第三個為止


substring則直接忽略負數,當成0來處理


substring(2,-3) = substring(2,0) = substring(0,2)
            

字串轉換為數值


parseInt(str,進位數)

將字串轉換為整數,parseInt("010")會得到8, parseInt("010", 10)才會得到10,強烈建議進位數一定要設定

parseFloat()

將字串轉換為浮點數

Array物件

Array宣告


var team = new Array(9);

宣告一個0~9共10個的Array,team[0], team[1]…

var team = new Array();

宣告一個空Array,可任意新增值到Array中,例team[20] = 'Bruce';即會產生team[0~19]的空Array,team[20]為指定值

var team = new Array('Bruce', 'Sherry', 'Daniel');

直接帶值宣告team[0],team[1],team[2]三個Array

var team = ['Bruce','Sherry','Daniel'];

透過[]符號直接宣告Array及值

Array物件的屬性和方法


length

屬性,取得陣列的元素個數,也就是陣列的尺寸

join()

將陣列的元素使用字串方式顯示,每個陣列元素使用「,」符號分隔,可指定使用的分隔符號,a.join('-->')

reverse()

將陣列的元素反轉,本來是陣列的最後一個元素成為第一個元素

sort()

將陣列所有元素進行排序

concat(array)

將參數的陣列合併到目前的陣列中,
var a = [1,2,3,4,5], b = [6,7,8,9,0];
                    document.write(a.concat(b).join());
     

push()

由push()與pop()來寶現堆疊(stack),stack.push('a');將a字串放入stack陣列

pop()

先進後出,由最後一個Index來取出Array,例如,push()進去a,b,c三個值,那pop會由c,b,a順序取出

自訂陣列排序方式

排序行為可由比較函式(comparison function)來決定

function compare(x,y){
            return x-y;
            }
            a.sort(compare(x,y));
   

a.sort(function(x,y){x-y});
            
compare回傳值
  • <0,x排序於y前
  • 0,不排序
  • >0,y排序於x前

Date物件

ECMAScript把日期儲存離UTC時間1970年1月1日0點的毫秒數

取得日期和時間


getDate()

傳回日期值1~31

getDay()

傳回星期值0~6,也就是星期日到星期六

getMonth()

傳回月份值0~11,也就是一到十二月,一般都會取值再加1才是我們看的數字

getFullYear()

傳回完整的年份,例如:2012

getYear()

傳回年份,如果在1900~1999年間,傳回後兩碼,例如:1998年傳回98,否則傳回完整的年份

getHours()

傳回小時0~23

getMinutes()

傳回分鐘0~59

getSeconds()

傳回秒數0~59

getMilliseconds()

傳回千分之一秒為單位的秒數,0~999

getTime()

傳回自1/1/1970年開始的秒數,以千分之一秒為單位

設定日期和時間

這些設定的方法並不會修改電腦的時間和日期,只是設定Data物件記錄的時間和日期。

setDate()

設定Date物件的日期1~31

setMonth()

設定Date物件的月份0~11

setFullYear()

設定Date物件的完整年份

setYear()

設定Date物件的年份,在1900~1999間只需使用後兩位,否則需要使用完整的年份

setHours()

設定Date物件的小時0~23

setMinutes()

設定Date物件的分鐘0~59

setSeconds()

設定Date物件的秒數0~59

setMilliseconds()

設定Date物件的秒數,以千分之一秒為單位,0~999

setTime()

設定Date物件的時間,自1/1/1970年開始,以千分之一秒為單位

日期和時間的轉換


getTimezoneOffset()

傳回本地時間和GMT的時間差,以分為單位

toGMTString()

傳回轉換成GMT時間的字串

toLocalString()

傳回將GMT轉換成本地時間的字串

parse(Date)

傳回參數Date物件從1/1/1970到本地時間的毫秒數,以千分之一秒為單位

UTC(Date)

傳回參數Date物件從1/1/1970到GMT時間的毫秒數,以千分之一秒為單位

Math物件

屬性


E

自然數e=2.718281828459045

LN2

ln2=0.6931471805599453

LN10

ln10=2.302585092994046

LOG2E

log2e=1.4426950408889633

LOG10E

loge=0.4342944819032518

PI

圓周率=3.141592653589793

SQRT1_2

根號1/2=0.7071067811865476

SQRT2

根號2=1.4142135623730951

亂數、最大值、最小值


max(value1,value2)

傳回參數中的最大值,參數無限制

min(value1,value2)

傳回參數中的最小值,參數無限制

random()

傳回擬亂數值

round(value)

將參數值四捨五入後傳回

數學方法


abs()

傳回絕對值

acos()

反餘弦函數

asin()

反正弦函數

atan()

反正切函數

atan2(y,x)

反回原點和座標(x,y)的連線,與x正軸的夾角

ceil()

傳回大於或等於參數的最小整數

cos()

餘弦函數

exp()

自然數的指數ex

floor()

傳回大於或等於參數的最大整數

log()

自然對數

pow()

次方

sin()

正弦函數

sqrt()

傳回參數的平方根

tan()

正切函數

Error物件


number

錯誤碼,這是一個32-bit的值,其中後16-bit才是真正的錯誤碼(IE)

message

錯誤說明的字串

description

如同message屬性,這也是錯誤說明的字串(IE)
單層除錯

try{
         // javascript需要錯誤測試的程式碼
        }
        catch(e){
         //錯誤處理
        var errMessage = '';
        for (var i in e)
         errMessage += i + ":" + e[i] + "\n";
         console.log(errMessage);
        }
        finally{
         //不論錯誤是否產生,都會執行此區塊
        }
 
多層除錯

try {
         ...
         try { //第二層
          ...
   }
         catch(e){
          ...
         throw e; //丟出錯誤
    ...
         }
        }
        catch(e) {
         ... //第一層錯誤
        }
        finally {
         ...
        }
 

onerror事件

當頁面出現JavaScript錯誤,會觸發window.onerror事件

window.onerror = function(){
        //使用Firebug收集Log
        console.log("Error!");
        }
        
 
onerror事件提供三個參數

  1. 參數一:傳入錯誤訊息

  2. 參數二:傳入錯誤的URL

  3. 參數三:傳入錯誤的行號
window.onerror = function(message, url, line){
         //使用Firebug收集Log
         console.log("Error:\n %s \nURL: %s \n行號: %s", message, url, line);
         return true; //取消系統事件
        }
 
console.log為Firebug Console API用法。

共用屬性與方法

共用屬性


constructor

javascript物件的constructor屬性,可以取得建立物件副本使用的建構函數名稱(除Global和Math都支援)
檢查物件的建構函數是否為String()
var test = new String();
    if (test.constructor == String){
     ......
    }
    

toString()


toString()

傳回物件的內容,傳回值為字串,object.toString();

toString回傳值


Array

將陣列元素轉換成「,」符號分隔的字串

Boolean

true傳回字串"true",false傳回字串"false"

Date

傳回日期和時間的字串

Error

傳回錯誤息訊的字串

Function

傳回字串格式"function name() {...}",其中name為呼叫toString方法的函數名稱

Number

傳回數字字串。數值轉字串,同時進制轉換:


var a=15;


a.toString(8); //8代表8進制


a.toString(16); //16代表16進制



String

傳回String物件的內容

valueOf()

傳回物件值(Math,Error不支援);
object.valueOf();

valueOf()回傳值


Array

將陣列元素轉換成以「,」符號分隔的字串,如同Array.toString和Array.join方法

Boolean

傳回布林值

Date

傳回前晚到現在的秒數,以千分之一秒為單位

Function

傳回函數的本身

Number

傳回數字

Object

傳回物件本身

String

傳回字串

免費可在Windows Vsita / 7上使用的RamDisk -- Dataram RAMDisk

在記憶體不斷成長,價錢又不斷下降之下,在Windows XP或Linux等32 bit作業系統開始出現一個問題,當你安裝了4 GB以上的記憶體,最多也只能使用到3 GB,這是受限於32 bit作業系統本身,除非升級至64 bit作業系統,不然算是無解的問題。

後來人們發現,在平時的電腦裡,我們根本用不到那怎多的記憶體,或,我有沒有可能把那「不見的1 GB Ram」拿出來用?這時候就有Clever的人,想出了Ram Disk的概念,即我們那些用不到的Ram拿來建成Disk,因為這個Disk是由Ram所建立,所以速度上當然「快很多,非常多,超級多」。

Ram Disk 作用一

也由於是在Ram裡面運作,所以也可以有效減少HDD的讀寫動作,進而有效保護HDD,例如,我們使用P2P在下載資料,但P2P的下載動作是含「超大量」的讀寫動作,對HDD而言只能用一個字「操」來形容。所以我們就可以把P2P下載的Temp目錄設定到Ram Disk裡,完成目錄再設定到HDD中,讓HDD只單純做一次性讀寫。

Ram Disk 作用二

另外有人發現,Ram Disk很合適拿來放「暫時性」資料,因為Ram裡的資料,在關機時就會消失不見,完全不會佔到HDD任何一滴滴空間,例如:Browser的暫存資料。

Ram Disk 作用三

在文書作業上,Ram Disk也可以有很大的幫忙,如果你需要常開些大檔案來作業,例如,Word、PowerPoint…等都是圖檔的大型檔案,或影片檔,就合適先Copy到RamDisk再來開啟作業,原因我們上面說過了,HDD與RamDisk的速度,就跟龜兔賽跑的差別差不多,一個在天一個在地,所以透過Ram Disk的幫忙,讓我們進行大檔案文書工作時,可以更加流暢。但請記得,要把修改好的內容Copy回去HDD,這也是為什麼最後是「龜」贏而不是「兔」贏。

以上談了那怎多,那最重要的Ram Disk呢?說到RamDisk且免費的,在Vista之前,大概都是Gavotte RAMDisk的天下,但在Windows XP之後,Gavotte RAMDisk就沒再開發下去,所以在Vista或Vista之後的64 bit作業系統,除非你花錢,或找得到「快樂版」。

近來終於發現了一個新又免費的Ram Disk程式,Dataram RAMDisk, 此免費版本只有一個限制,就是最大只能建立4 GB的Ram Disk,就算是付費無限制版本,也才9.99美元。免費版對我們而言已經是非常足夠。

我下載的是「Dataram_RAMDisk_V3.5.130RC16」版本,

Dataram  RAMDisk Download

Dataram RAMDisk不只是Windows Vista、Windows 7,就連Server 2003、Server 2008都一樣支援,這會不會太佛心了!讓我們感謝作者一下。謝謝你。(如果你有找過或看過其他付費RadDisk,你就會知道為何要謝謝他了。)

安裝時,最好先按右鍵,使用「系統管理員」的權限來安裝( 我在Windows 7 32 bit並不需要,應該是64 bit的才需要)。

程式設定畫面

Disk Size是你要建立的Ram Disk大小,格式建議使用「FAT32 Partition」,Boot Sector Settings也建議使用「Windows boot sector」,確認好之後按下「Start RAMDisk」就會開始建立RamDisk及Format,依大小會待不一的時間。

工作管理員之記憶體使用情況

完成後,你會發現,你電腦的記憶體使用數量,馬上上升1 GB,這就是傳說中,把Windows作業系統不見的1 GB找回來的方法,或是說讓Windows 32bit作業系統可以使用4 GB以上的方法

RamDisk

如果你記憶體夠,建議可以建個2 GB的RamDisk,然後使用ReadyBoost,這會讓你的開機速度再加速提升。再來就可以把上述那些暫存資料放到Dataram RamDisk之中。


備份RamDisk中的資料

那你會說,如果我想要保存在RamDisk的資料,可不可以?
答案是:可以。

在Gavotte RAMDisk時,必須是「開機指令碼」及「關機指令碼」來將RamDisk的資料在關機時存回HDD,開機時由HDD讀回RamDisk之中。但使用Dataram RamDisk不用那麼麻煩,我們可以直接設定,它就會幫我們進行Ram Disk的資料備份及還原動作,是不是很棒呀!

Load and Save

這夠明顯了吧,Load是開機時進行,Save是關機時進行,而且Save還能定時備份,這樣就你不用怕如文書作業到一半確掛點的問題。另外,Dataram RamDisk是使用類似Ghost的image檔案方式來存放你的RamDisk資料,這點我覺得很棒!

Load Image Settings

重點只有一個,把「Load Disk Image at Startup」打勾!其他是要存Img的路徑,還有是否要建立一個目錄來放Image檔。

Save Image Settings

重點只有一個,把「Save Disk Image on Shutdown」打勾!其他是否要定時備份,或按一下「Save Disk Image Now」來立即儲存Image檔。

Load and Save Settings

Dataram RamDisk Image

注意最後的Image大小,你建立1 GB的RamDisk,就會是1 GB的Image,由此證明,Dataram Disk的Image不是單純copy檔案,而是真正進行Image動作的Image檔案。另外,根據Reference第二篇有網友反應,所修改IE到RamDisk後會有問題,我自己家中是使用XP + Gavotte RAMDisk,並無此問題。我是有碰過修改IE路徑後,電腦執行就不太正常,改回來後就一切正常的情況,建議修改前將IE暫存「原始」路徑寫下,如出現問題,再修改回去即可。

最後,如果你有使用Load and Save功能,那就是在開機或關機時,會有那麼一點點Delay,原因上面說過了,關機Dataram RamDisk要製作Image檔,開機要將Image檔讀入, 可是這一點點Delay可是能換來非常高的效能提升,是非常值得的。

Reference:

最後Reference,Google Chrome暫存檔的設定簡單:「Chrome執行路徑 + --user-data-dir=暫存目錄」,以我電腦為例,「"C:\Users\IPC\AppData\Local\Google\Chrome\Application\chrome.exe" --user-data-dir=H:\Chrome」,你可以建立「捷徑」的方式,或,直接修改快速啟動列裡Chrome程式路徑加上參數,程式路徑要包在雙引號之內("~")後面加參考,這樣你就能指定Google Chrome暫存路徑到RamDisk裡。

推薦一些讓你學好英文的書--專門替中國人寫的英文課本,幼福2043系列

不讀書的快樂童年--英文,我一輩子最錯誤的決定

幼福2034童書

我在之前提過,放棄學英文是我一生最錯誤的決定,但近來我又重生了,為什麼重生,首先感謝我們兩位寶貝,大寶貝能動能靜,靜時,最喜歡我們陪她一起看書,依據婆婆的說法,最高記錄是一天看了近三十本的童書。我們還怕她看太多,每三、五本,還會叫她去看一下天空,讓眼睛休息一下。

這些童書我絕大部份都是買幼福公司出版的「2034、2035」系列。

2034很合適與小朋友一起看,不論是中文或英文部份,就英文部份,我發現童書的好處是「用字簡單」,你能看完一個完整的故事文章,且因為要陪孩子看,所以又會不斷重覆看,所以就能慢慢接受英文,你能慢慢增加對英文的興趣及信心,原來英文是不那麼難。而且,2034、2035系列,是中、英文有聲書,我都會先放英文再放中文給寶貝們聽,英文約10~15分鐘,中文約30~45分鐘,可以一邊學英文,又可以一邊聽故事,真是一舉二得。

經過與大寶貝一起看英文童書的心得後,後來又去峇里島自由行,在峇里島時,不知是不是常聽童書故事CD的關係,發現,我聽力變好了,他們說的內容大概都還能聽得懂。

我個人分析過,因為讀資訊的關係,我讀的很認真,所以「專業英文」還可以,基本上看相關技術文件都還沒問題,但…日常英文就很…馬馬馬馬虎虎虎虎(就是比馬馬虎虎還低一些)。我了解自己英文那裡有問題,就重新分配時間,之前的小說,抱歉了,我還有更重要的事要先做。

我想學好英文。

專門替中國人寫的英文課本

後來無意中發現了一套英文教學書:「專門替中國人寫的英文課本」,這個標題讓我很好奇,一翻,原來是李家同教授所策劃的一套英文教學書,我看了一下books的書評,好吧,也才100出頭元,沒看沒事,看了出事,一整個醍醐灌頂。

我才看完「初級本 (上)(下)」兩本,說真話,我一真以來都留在背單字階段,用單字在看句子。我紮實的練習書中的內容,比起過起任何一本英文書還有用,我真的是他那書中的中國人。這套「專門替中國人寫的英文課本」不是要拿來考試拿成績,而是要讓我們學習「使用英文」而非只是背單字、片語。

 Let we going to English world together.

如果你在聯經整套購買,例如,整套「聯經:專門替中國人寫的英文課本」共六本加其他兩本,我算了一下,比75折還低,實在划算。

如果你有心要學英文,但又不得其門而入,我推薦這套由「作者/文庭澍、策劃審訂/李家同」所撰寫的「專門替中國人寫的英文課本」,不管你英文有多爛,我相信這套書都能救得了你。

除了書中的練習,你還可以上「李家同教授的英文教室」,依你學習的進度去Practice,它每週換一次題目,讓你除了書中的內容,還可以多Practice其他的內容,多看、多寫、多聽、多說,準沒錯!

e-coupon大放送

Thank you to look me blog, I want send some gift for you. You can buy anything in Internet bookstore. I hope you like it. ^_^

(請已使用者回覆留言,說你已使用那一組序號)
Books.com.tw 100 E-Coupon:

以下為面額100元E-Coupon序號:DBJB7vgN

注意事項:
1. 使用期限為:2010年11月23日~2010年11月30日止,逾期無效。
2. 使用限制:單筆訂單滿888元(含)以上方可折抵使用。

iread.com.tw 25*2 E-Coupon:

6aAu2eWprs 使用期限:2010/11/23~2010/12/24
UsSqqORowV 使用期限:2010/11/23~2010/12/24

CSS, jQuery -- 動態調整網頁文字大小設計技巧

我們計設網頁時,都必須做一個非常全面的考慮,當字型考慮好了之後,然下來考慮文字的大小。文字對大家影響很大,太小看不清更,看起來吃力,太大又很奇怪,但你面對的使用者又是那種「一種米養百種人」的情況,這個說太大,那個說太小,怎麼辦?

那就要從最開始設計CSS時,就把文字大小的關係處理好,那接下來就可以很輕鬆搞定網頁上文字大小的問題。

基本這問題不難,先首第一步,必須利用CSS的「繼承」關係,由上而下繼承一個「主大小」,然後依各「元素」所需去自訂自己需要的大小,而非由各元素去各自自訂大小。

先看一個各元素去各自自訂大小的範例:

h1 {
  font-size: 24px;
}

h2 {
  font-size: 20px;
}

h3 {
  font-size: 16px;
}

p {
  font-size: 14px;
}

以上這種各自玩各自的遊戲,盡量不要,現在是合作的社會,所以我們來玩繼承合作遊戲:

body {
  /* 一般都會選擇 small 或 medium為主大小;
     small約 12px; medium 約 14px;
  */
  font-size: small;
}

h1 {
  /* 12px * 200% 約 24px */
  font-size: 200%;
}

h2 {
  /* 12px * 160% 約 19px */
  font-size: 160%;
}

h3 {
  /* 12px * 120% 約 14px  */
  font-size: 120%;
}

p {
  /* 12 * 1.5 = 18px  */
  font-size: 1.5em;
}

經由body來設定為主要字型大小,讓以下所有元素去「繼承」這個字型大小的設定,需要改變時,只需要利用「%, 百分比」或「em, 倍」的用法,即可立即享受到繼承的好處,例如,使用者覺得字太小了點,你只需要將body中「font-size: small;」改為「font-size: medium;」那整個網頁就馬上會將字型放大,而且相關的元素也會立即跟著變更,而不用一個一個去調整。

再來,我想讓使用者去手動變更網頁上字型的大小,怎麼做?

jQuery -- 手動讓使用者動態調整網頁文字大小

這邊我透過jQuery示範:

$(function(){
 // 加上flag是為了讓文字有切換的效果
 var flag = false;
 // 在一個input上(id=click)註冊onclick事件
 $('#click').bind('click',function(){
  if (flag){
   $('body').css('font-size','medium');
   flag = false;
  }
  else {
   $('body').css('font-size','large');
   flag = true;
  }
 });
});

其實很簡單,我們只要透過修改body裡的css屬性,將font-size變更,網頁立即產生效果。


學會CSS中繼承關係,你也能有像Yahoo國際水準的功能哦!

第一篇:簡單介紹JavaScript

  1. 變數命名
  2. 資料型別(data type)
  3. 關鍵字
  4. 保留字
  5. 比較符號
  6. 邏輯符號

建議使用右下方Popout按鍵來「全螢幕」觀看。


History

2010/05/06,整理資料至xmind。
2010/11/23,xmind內容轉為文字輸出。

ECMAScript(262)

ECMAScript定義了指令碼語言的所有語法、類型、語句、關鍵字、保留字、運算子和物件等,其他語言可以實現ECMAScript來作為功能基礎,JavaScript就是其中之一。




ECMAScript

JavaScript

ActionScript

ScriptEase

BOM

Browser Object Model,BOM提供Web開發者移動視窗、改變狀態列…一些與網頁內容無關的動作。

DOM

Document Object Model, 一種與瀏覽器、平台、語言無關的介面,DOM把整個網頁標籤轉換成節點樹架構的文件。

Web標準

將網頁分離為三個部份,結構、表現、行為。

  1. Structure--(X)HTML
  2. Presentation--CSS
  3. Behavior--JavaScript

傳統HTML的缺點

  1. 維護困難 為了修改某個標記格式,需要花費很多時間,越後期的修改、維護成本越高。
  2. 標記不足 HTML本身標記不足,HTML本身標記都是內容服務使用,關於美工、排版根本很少或沒有支援。
  3. 網頁過胖 傳統網頁除了包含HTML外,還加上CSS、JavaScript,最後還會加上動態程式語言,除了維護困難,頁面往往過於胖大,浪費許多頻寬。
  4. 定位困難 HTML在定位時就顯得捉襟見肘,過多的<table>也導致頁面的複雜和後期維護的困難。

對網站瀏覽者的好處

  1. 檔案下載、頁面顯示更快
  2. 內容能被更多使用者訪問(含殘障人士)
  3. 內容能被更多設備訪問(PDA、智慧手機…)
  4. 使用者能透過CSS選擇自己介面風格
  5. 由CSS提供適合列印版本

對網站開發者的好處

  1. 更少的程式碼
  2. 更容易維護
  3. 頻寬要求更低,例如,ESPN.com使用CSS改版,每天節約超過2TB的頻寬。
  4. 更容易被搜尋引擎接受,及更高的排名
  5. 改版方便(結構、表現、行為分離)
  6. 提高網站易用性,例如,美國:Section 508、台灣:無障礙空間、國際:WCAG

ECMAScript語法

  1. 區分大小寫
  2. 弱類型變數:定義變數只用"var"關鍵字,並可以初始化為任意的值。
  3. 每行結尾的分號可有可無


    養成良好的程式設計習慣,為每一句程式結尾都加上分號。


    在新版Browser中,不加分號會有問題
  4. 括孤{ }用區程式碼區塊
  5. 註解


    //這是單行註解


    /*


    這是多行註解


    */

變數

  1. 變數是透過var關鍵字來宣告,是記憶體裡獨一無二名稱(unique name)的存儲位置(storage location)。
  2. 變數在使用之前都應宣告(雖然不宣告也能使用)。
  3. 未宣告的變數,會自動建立為全域變數(在函式內也一樣),並初始化為指定的值。
  4. 同一變數應該只儲存一種資料型別,建立一個有初始值的變數,是種好習慣。

命名

  1. 字首必是英文字母、底線(_)或$符號。
  2. 其他可以是英文字母、底線(_)、數字、$符號。
  3. 變數不能是關鍵字或保留字。

命名規則

Camel

  • 首字母小寫,其他單字字首大寫
  • studentName, classNumber
  • 用於變數和函式

Pascal

  • 首字母大寫
  • FirstName, LastName
  • 用於物件

匈牙利

改良Pascal,在變數前加上(一個或一組)小寫字母來說明變數的型別。

  • i代表Integer,s代表String
  • int代表Integer,str代表String

項目

範例

縮寫

陳列

a / arr

sStudents

布林

b / bln

bSex

浮點數

f

fTax

函數

fn

fnSwap

整數

i / int

iAge

物件

o / obj

oCar

正規式

re / reg

reTWID

字串

s / str

strName

常數

  1. 常數用來建立一個不會改變的值,除了修改JavaScript原始碼之外。
  2. 常數透過const關鍵字來宣告
  3. 常數習慣以「全大寫字母」來命名,例如,const TAXRATE = .5;。
  4. const關鍵字最近才加入JavaScript,使用前請多檢查。IE到目前都還不支援(IE8)。

初始化

  1. 初始化背後的概念,在於避免存取沒有存入值的變數。
  2. 如果宣告時還不知變數值,可先使用「什麼都沒有」來當值,減低存取未初始化變數的風險。

初始值

範例

"",空字串

var name="";

0,數值

var price=0;

false,布林

var Select=false;

變數範圍(scope)

scope掌控變數的生命週期,還有程式碼是否可以存取變數。

區域變數(Local Variables)
在函數內宣告的變數,存在於函式執行時,只能在函式內的程式區塊使用。
全域變數(Global Variables)
變數在函數外宣告,整個JavaScript程式的函數和程式碼都可以存取。

資料型別(data type)





未定義(undefined)

某段資料未初始化,或沒有值

空(null)

不是字串的"",數字的0,布林的false,空就是空,代表一種空狀態。

布林(boolean)

true(成立)與false(不成立)

字串(string)

文字(text)資料只是一串字元,通常出現在單/雙引號之間

數值(number)

數字資料,未出現在單/雙引號之間的阿拉伯數字

物件(object)


參考(reference)

var check = function(evt){...};

列表(list)

完成(completion)
JavaScript基本資料型別,布林(boolean), 字串(string), 數值(number);JavaScript會在你設定資料時,自動判定型別,自動指定,我們無法在設定變數時設定資料型別。

關鍵字

  • break
  • case
  • catch
  • continue
  • default
  • delete
  • do
  • else
  • finally
  • for
  • function
  • if
  • in
  • instanceof
  • new
  • return
  • switch
  • this
  • throw
  • try
  • typeof
  • var
  • void
  • while
  • with

保留字

  • abstract
  • boolean
  • byte
  • char
  • class
  • const
  • debugger
  • double
  • enum
  • export
  • extends
  • final
  • float
  • goto
  • implements
  • import
  • int
  • interface
  • long
  • native
  • package
  • private
  • protected
  • public
  • short
  • static
  • super
  • synchronized
  • throws
  • transient
  • volatile
保留字一般較少使用,在物件導向程式設計中使用率比較高。

比較符號

比較符號 說明
== 等於
!= 不等於
> 大於
< 小於
>= 大於等於
<= 小於等於
=== 絕對等於
!== 絕對不等於
雙等號運算子(等於)會進行型態強制轉換,假如比較的資料型態不一樣,有時結果會相當有趣:1 == true會得true。要避免型態強制轉換,要用三等號運算子(絕對等於),例如,

1 === true會得false,還有一個!== (絕對不等於)運算子。

邏輯符號

邏輯符號 說明
&& And運算
|| Or運算
! Not運算

CSS -- 中英文字型家族相關整理

英文字型家族

  1. Sans-serif家族
    Sans-serif家族都沒有截線可讀性較高。
    • Verdana
    • Arial Black
    • Trebuchet MS
    • Arial
    • Genev
  2. Serif家族
    Serif家族都有截線,比較像印刷體
    • Times
    • Times New Roman
    • Georgia
  3. Monospace家族
    Monospace家族字母寬度都一樣,適合顯示軟體程式碼之類。
    • Courier
    • Courier New
    • Andale Mono
  4. Cursive家族
    Cursive家族像手寫,適合「標題, h1~h6」之類。
    • Comic Sans
    • Apple Chancery
  5. Fantasy家族
    Fantasy家族像裝飾性風格,但非每台電腦都有,網路上較少使用。
    • LAST NINJA
    • Impact

Windows or Mac?

Windows and Mac可能都有的字型:
  • Andale Mono
  • Arial
  • Arial Black
  • Comic Sans
  • Courier New
  • Georgia
  • Impact
  • Times New Roman
  • Trebuchet MS
  • Verdana
Mac可能有:
  • Genava
  • Courier
  • Helvetica
  • Times

Google Font API

Google Font API是Google所提供免費的英文字型。可線上載入及使用。

正體中文字型家型

中文字型的選擇就少很多,因為我們使用在網站上,主要目標還是Browser,假設你使用了「華康字型」,網路上其他人的電腦沒有此字型,也是白搭。所以就中文字型而言,在簡體或正體中文網站,就簡單多了,除非Microsoft會透過Microsoft Update去更新字型給所有Windows用戶,不然還是不要想太多,你沒什麼機會在網頁裡就中文字型動什麼花樣。

以大眾市場而言,正體中文就「"標楷體", "細明體", "新細明體","微軟正黑體"」四種,沒了;"微軟正黑體"還算比較新的字型,也不一定所有正體中文電腦都有,所以說是三種也行。

2010/12/07 補充--正體中文及簡體中文font-family設定

/* for China */
    font-family : "宋体", simsun, nsimsun, "黑体", simhei, "楷体", simkai, "仿宋", simfang, Arial, Verdana, "Trebuchet MS", sans-serif;
    
    /* for Taiwan */
    font-family : "新細明體", PMingLiu , "標楷體", DFKai-sb , "細明體", MingLiu , "微軟正黑體", "Microsoft JhengHei" , Arial, Verdana, "Trebuchet MS", sans-serif;

2010/12/27 補充--OS及軟體包含字型查詢網址

  1. Microsoft Typegraphy
  2. MAC OS X:Fonts list

Microsoft AntiXSS Library 3.1 Upgrade 4.0

如果你的網站有讓人家「輸入資料」,那必須非常小心的處理,在以前,我們必須寫很多檢查程式,前面javascript檢查一遍,後面再用VBScript(ASP)或Visual Basic(ASP.NET)再檢查一遍,反正這種檢查永遠不嫌多。

一般而言,為了要保護好網站,所以這種檢測、檢查的程式就可以寫很多很多,在ASP.NET最簡單的方式就是拉Validator控制項,如果更進一步就寫些JavaScript來加強,但一山還有一山高,總是有人有得出辦法去過去,不然SQL Injection、XSS…都已經出現多少年,還是有一堆網站被它們打敗,你可以看看「XSS (Cross Site Scripting) Cheat Sheet」或「Ultimate XSS CSS injection」這裡面的功擊情境,Try it,你寫的檢測Code能防的了幾種,我是看的頭都花了。

再來,寫JavaScript有個壞處,就是你的處理方式,只要懂的人就能把你的JavaScript內容看光光,知道了你的處理方式,我們就能開始設計跳過你處理方式的方法。ASP.NET的Validator控制項是不錯,但Validator控制項只合適用來檢測一些簡單的需求,如果複雜些的,那Validator控制項還是不好用,不相信,簡單,一樣使用Validator控制項去檢測上面那些攻擊情境的內容看看。

那Regular Expression呢?不多說,這是張王牌,但使能用它的人,必須有很好的內功,不然你是練不了它的。

後來發現了一個非常好用的函式庫「Microsoft Web Protection Library」,我是從AntiXSS Library 3.1版開始使用,此函式庫不得了,AntiXSS Library會幫你進行內容過濾的動作,將有害的內容剔除與替代,給你一個受保護的環境。在AntiXSS Library 3.1就能保護我上面所提「XSS (Cross Site Scripting) Cheat Sheet」與「Ultimate XSS CSS injection」的所有攻擊情境,這讓我們用起來安心,用起來爽歪歪。

我不敢保證,AntiXSS Library能100%保護我們不受功擊或不讓功擊成功,但最少基礎上的保護,別人如果是70分,你使用AntiXSS Library後,我們會加到90分以上,所以我極推薦AntiXSS Library。想像是幫「網站」裝防毒軟體,有裝有保佑。

Microsoft AntiXSS Library 3.1 Upgrade 4.0

在更新AntiXSS Library 3.1 DLL檔至4.0版之後,發現一些內容上的差異,在Visual Studio 2010中,會提供原先使用AntiXSS Class過時的訊息,查了一下4.0的手冊,還直的沒有AntiXSS的內容,取代的是Sanitzer Class(Sanitzer,清潔劑,取的真好),用法與AntiXSS一樣,Sanitzer.GetSafeHtml()、Sanitzer.GetSafeHtmlFragment()。

加入Microsoft AntiXSS Library 4.0參考

在專案或網站的「Bin」目錄下,按右鍵選擇「加入參考」,選擇「瀏覽」,找到安裝Microsoft AntiXSS Library的目錄,一般是在「...\Microsoft Information Security\AntiXSS Library v4.0」之下(你可同時安裝3.1與4.0),你可以找到兩個DLL檔,AntiXSSLibrary.dll與HtmlSanitizationLibrary.dll,如果你有使用AntiXSS Library 3.1,要與舊版程式碼相容,那就參考新的AntiXSSLibrary.dll;如果你是要使用AntiXSS Library 4.0功能,那就參考HtmlSanitizationLibrary.dll,參考完在使用前先「Imports Microsoft.Security.Application」(Visual Base)、「Using Microsoft.Security.Application」(C#)即可使用。

Sanitzer Class

Dim s1 As String = Sanitizer.GetSafeHtml(tbxNamen.Text)
Dim s2 As String = Sanitizer.GetSafeHtmlFragment(tbxName.Text)

' Encoder Class也是AntiXSS Library所提供
Response.Write(Encoder.HtmlEncode(s1))
Response.Write(Encoder.HtmlEncode(s2))

我們輸入含Tag(<b> KKBruce </b>)的內容,我們看一下結果:
<!-- s1的內容 -->
<html>

<body>

<b>KKBruce</b>

</body>

</html>


<!-- s2的內容 -->
<b>KKBruce</b>

我們輸入含Script Tag(<script> alert('Hello world!');</script>),我們看一下結果:
<!-- s1的內容 -->
<html>

<head>

</head>

</html>



<!-- s2的內容,空空如也,什麼都沒有,已經被過濾剔除 -->


Sanitizer.GetSafeHtml()會傳回一個完整的HTML架構內容,而Sanitizer.GetSafeHtmlFragment()是就傳回你所傳入的內容。注意第二個含Script例子,它被AntiXSS Library 4.0認定為有害內容,所以就回傳一個「String.Empty」給你,這點與AntiXSS Library 3.1不同,如果你是使用AntiXSS Library 3.1 upgrade AntiXSS Library 4.0,這部份有所不同,請參考AntiXSS Library 4.0手冊。

你可以繼續Try其他SQL Injection、XSS…等,你應該會得到很滿意的結果。

結論是,愛它(網站)就要保護它,請多多利用這個免費Microsoft Web Protection Library(AntiXSS Library),有了AntiXSS Library你就不怕中標了。

Microsoft ajax CDN Domain改名為aspnetcdn

公司在China有網站,而網站內有引用jQuery,而為了節省一點點流量及加快載入速度,想必會使用Ajax CDN服務,而目前只有Microsoft及Google有提供這類Ajax Framework CDN服務,使用這類服務不錯,但只有一個技術上缺點首一個…怎麼說的缺點呢?

技術上而言,我們在引使用必須將版本資料寫死,例如,
http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.4.4-min.js或
google.load("jquery","1.4.4");,所以當版本有更動且你想升級時,那又是一件大工程,因為你必須將所有有引用的網頁找出,然後修改它。不過現在也還好,工具都寫得很方便,可以整個資料夾、整個專案的取代,也算還OK。

另一個…缺點就是…China對Google不太友善,所以我採用China使用Microsft Ajax CDN,其他使用Google Ajax CDN,最少目前Microsoft在China還沒發生什麼會被封、會被鎖之類的事情,這是思考後所決定採用的方案。

今天要更新jQuery至1.4.4版,結果發現Microsoft Ajax CDN的Domain已經改了,這是Microsoft的說明:

ajax.microsoft.com renamed to ajax.aspnetcdn.com

The CDN used to use the microsoft.com domain name and has been changed to use the aspnetcdn.com domain name. This change was made to increase performance because when a browser referenced the microsoft.com domain it would send any cookies from that domain across the wire with each request. By renaming to a domain name other than microsoft.com performance can be increased by as much to 25%. Note ajax.microsoft.com will continue to function but ajax.aspnetcdn.com is recommended.

* Old Format: http://ajax.microsoft.com/ajax/jQuery/jquery-1.4.4.js
* New Format: http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.4.4.js

據Microsft說法,改使用新aspnetcdn能提升25%的效率,怎麼好!
如果你有使用到Microsoft Ajax CDN服務,快快去修改,將ajax.microsoft.com修改或取代為「ajax.aspnetcdn.com」,一點點功夫就能讓網站更快更好些,何樂而不為!

此外,Visual Studio的jQuery說明檔-vsdoc.js,從1.4.1~1.4.4都已經上線,Visual Stdio 2010引用一下,馬上就能查詢最新功能相關資訊。

參考:

Microsoft Ajax content delivery network (CDN)

後置程式手寫SqlDataSource程式新增日期格式之錯誤產生及解決

ADO.NET #3 (GridView + SqlDataSource)完全手寫、後置程式碼,兼論 SqlDataSource與UpdateParameter/DeleteParameter的用法

在學習以上程式碼的過程中,不斷出現錯誤訊息,一直無法新增成功,但失敗為成功之母,也讓我在使用SqlDataSource1.UpdateParameters還有日期處理上有了多一分認識。

在執行程式的過程,一直出現SqlDataSource.Update()有問題,錯誤訊息為「從字元字串轉換成日期及/或時間時,轉換失敗。」直覺是日期方面有問題,於是在日期資料上加了CData()轉換,但還是一樣,後來索性直接到MS SQL Server中去直接執行Update語法,發現在MS SQL Server中的錯誤訊息一模一樣。

我在ASP.NET (.NET Framework 4)的GridView中,ASP.NET很好心會幫我們進行文化轉換,即原資料庫中資料為「2002-08-01 00:00:00.000」,但你在畫面上看到的是「2002/8/1 上午 12:00:00」,所以程式碼:

' my_test_time.Text = "2002/8/1 上午 12:00:00"
SqlDataSource1.UpdateParameters.Add("test_time", my_test_time.Text)

問題出在這裡,這個「2002/8/1 上午 12:00:00」格式MS SQL Server看不懂,所以我就很直覺加上CDate()

' CDate(my_test_time.Text)輸出還是"2002/8/1 上午 12:00:00"
SqlDataSource1.UpdateParameters.Add("test_time", CDate(my_test_time.Text))

結果…還是錯,CDate()輸出格式還是「2002/8/1 上午 12:00:00」也就是說,CDate()還是會依文化特性來轉換,所以我們加上格式化輸出:

' 輸出格式 = 2002/8/1 12:00:00
SqlDataSource1.UpdateParameters.Add("test_time",CDate(my_test_time.Text).ToString("yyyy/MM/dd HH:mm:ss"))

程式總算正常了。

我在想,其他人為什麼沒碰到這個問題?我想比較可能的原因是MS SQL Server的版本不同,我使用的是比較新版MS SQL Server 2008 R2 (10.50.1600),所造成的結果。另外也可能是SqlDataSource1.UpdateParameters的小Bug,SqlDataSource1.UpdateParameters不像我們在使用像「SqlDataAdapter.UpdateCommand.Parameters.AddWithValue("@test_time", CDate(my_test_time.Text))」,SqlDataAdapter.UpdateCommand應該會自動幫你轉回正常的格式,讓MS SQL Server能接受,所以在使用SqlDataAdapter.UpdateCommand等相關程式時,也沒發這過這樣的錯誤,這部份我就沒深入研究。

結果就是,使用SqlDataSource1.UpdateParameters請小心「日期的格式」。

參考:
日期和時間格式字串

關於ATI AGP卡(About Ati AGP Card)

我家裡電腦顯示卡是Asus AH3450,本來想裝Windows 7玩玩,結果什麼都能安裝,就是顯示卡的Driver裝不起來,找了Asus的客服及去Ati官網,都沒能解決我的問題,後來看到這一篇:

Hotfix for “No compatible hardware found” error when installing ATI Catalyst™ drivers for ATI Radeon™ HD 4xxx, ATI Radeon HD 3xxx and ATI Radeon HD 2xxx series AGP products

可以說Ati的Driver在某此Windows版本之後,會出現不支援AGP Card的問題,所以有人出了這個Hotfix版本的Driver,剛好AH3450是HD3xxx系列,但…很不幸,問題依然存在,所以bye bye Windows 7,你實在不合適舊PC上,雖然在無顯示卡Driver下,你運作的比XP還順,但我總不能一直等下去,所以我又回到XP的懷抱。

華碩雲端硬碟空間軟體使用方法( ASUS Web Storage Software Use Method)

前一篇「華碩雲端硬碟(Asus Web Storage)」我們談到如何申請帳號及基本的使用,首先,我們申請好Asus web storage帳號後,接下來我們來看看如何使用Asus Web Storage各項功能。

先下載軟體安裝於本機,我下載「ASUS WebStorage for Windows」然後安裝後,啟動軟體,我下載的是3.0.52版。

MySyncFolder

MySyncFolder


這一個上次有介紹過了,主要為做「登入」與「資料夾同步」,它的運作很簡單,假設你有A,B,C三台電腦需要進行資料同步,以前最方便是就拿USB隨身碟,把資料各copy一份到A,B,C,但時間一久,你就會發現怎麼A電腦有的資料,B電腦沒有,C電腦有的資料,A、B電腦又缺了那一份。

這時你就會發現MySyncFolder的好用,只要你在這三台電腦都安裝好Asus web storage軟體,使用相同的帳號密碼登入後,嘿~嘿~嘿~,這個Asus Web Storage軟體就會自動幫同步你所設定資料夾下所有檔案資料,你就不用怕找不到資料,更重要的是,你所有的資料還能透過Web來存取,你可以按最右邊的「Go to Web」,它會幫你自動登入Asus Web Storage:

MySyncFolder UI


在Web UI上,你能針對檔案或是資料夾進行「權限設定」,透過最旁邊的下三角形:

Share

分享設定


我們選擇「分享設定」,經過分享設定你就可以把此資料夾或檔案分享出去給Internet上所有人。所以請小心,重要或機密資料,不是透過這一個設定分享出去。

Beging Share

當我們按下「開始分享」就會產生:

Share Information

這樣就會產生分享網址,你可以點http://oeo.la這一個試試看:

oeo.la share UI

這裡重要的設定只有「設定分享密碼」,即如果你只是要分享給特定人士,而非Internet上的大眾,請記得一定要設定密碼!切記,切記!

群組分享夾


在剛才分享設定中,可以把資料夾設定為「群組分享資料夾」,也就是都有在使用Asus Web Storage的使用者,如果你知道對方的帳號或Email,你就可以互相申請加入為好友,然後就有一個專屬於這些好友的分享空間。

Group share

Calender


Asus Web Storage -- Calender

「行事曆」的同步,

Calender UI

也就是能幫你同步各電腦之間的行事曆,不過目前還無法從網頁上看到同步後的行事曆,這一點就Outlook或Google日曆方便些,不過我相信會有那一天。

BookmarkSyncer


它會同步各台電腦中的瀏覽器「我的最愛」書籤:

BookmarkSyncer Setting

雖然我們失去了xmarks,但我又找到新歡了,無論你是要同步Internet Explorer、Google Chrome、Mozilla Firefox通通沒有問題,真的要為Asus web storage好好加分一下才行。

MobileApp

Mobile App

如果你有使用智慧型手機,可以把相對應的軟體(iPhone, iPod Touch, Android)抓回來安裝後,即可與智慧型手機進行同步的工作。

Mobile App Client

Backup


Backup

顧名思義,即備份電腦的資料,這比較是「單機備份」,非同步的功能。你能備份A電腦的「工作進度」資料夾,B電腦的「女兒的照片」、C電腦的「ProjectCode」,這裡是一個重點,如果你是付費用戶,Asus web storage是不限空間,也就是說你可以把你所有的資料全部全陪都進行備份的動作。

設定初次備份條件

備份狀態

設定備份條件

設定你要備份的資料夾或檔案,加入後Asus web storage會自動幫你備份。

備分--進階設定

排程備份

也就是你要多久備份一次至Asus web storage,自動備分是指當資料夾有異動,它就會自動進行備份動作。

Backup Web UI

Backup Web UI Folder

在Web找到「已備份的項目」,你就能找到各電腦所備份的資料。

Drive


Drive

Drive是可以直接透過本機的「檔案總管」去直接存取Asus Web Storage的資料,這可以讓我們很方便存取我們想要資料,而不必再去開啟網頁,東點西連。

Drive --  MySyncfolder

Asus Web Storage軟體部份介紹到此。前面有依功能介紹一些Web上的功能,但接下來才是Web上的殺手級應用。

多格式之閱讀


當你把檔案上傳至Asus web storage後,你還能在Asus web storage裡直接「閱讀」或稱「預覽」,

.docx format

我測試的結果,只要它能讀的出來的格式:xls、doc、ppt、txt、jpg、pdf、Office Open XML(Office 2007/2010)…都能在Asus web storage上讀出,但它只能把內容中的文字資料,但我覺得厲害的是,文字排版不會亂七八糟,依然可以很輕鬆看下去。

全文檢索


這可不是開玩笑。
當我們資料檔案一多時,使用搜尋是最方便的方式,但Asus web storage不只是搜尋,而且是提供全文檢索,也就是可以搜尋到上傳資料檔案中的內容,這可以讓我們更快速找到我們要的資料。

索引建立中…

第一次使用全文檢索,Asus web storage會建立索引,所以必須等一會兒,依資料量的大小,時間不等(不會太快),你可以睡前來建立^_^。

客服


再來,Asus web storage的客服也不錯,有問題,回信速度快,也另外讓我學到一招,如何快速開始AppData資料夾,以下是客服會要你進行的動作:


  1. 請打開ie 在網址列輸入%appdata%
  2. 進入ASUS WebStorage 資料夾
  3. 進入LOG 資料夾
  4. 把LOG的內容複製並壓縮寄給我們

如果你要提問,必須到「用戶服務-->用戶中心-->FAQ」(請先登入),最上方有個「提問」,再依你的問題輸入資料,輸入後再上傳Log即可。

結論


這一套由台灣國內廠商Asus所出Web Storage,我用了相當高興,終於有讓我用了也會高興的「台灣貨」。如果你要發揮100% Asus web storage的功能,必須與Asus web storage所提供的軟體結合,才會有更好的表現。相信假以時日,應該能有不錯的成績。讓我們大家一起來支援。

相關文章:
華碩雲端硬碟(Asus Web Storage)

影音轉檔軟體整理

自從買了那台Garmma G70 MP5之後,目前來說,影片、照片、音樂是使用率最高的三個,而且最大的好處是「分享」容易,在以前,我們出去玩後,但想與家人、朋友分享照片,雖然可以透過網路,但總是沒有「互動」「笑聲」,而且又不是每個人都會使用電腦、網路。

沖洗出來,可,不錯!但影片(Movie)類怎麼沖洗!隨身帶台Notebook?有了MP5之後,真的好方便,薄薄一片拿出來,分享影片,沒問題,分享照片,沒問題。

但有問題困擾我,就是看影片時,有些影片是直的,有些是橫的,在MP5看還沒有什麼問題,可以手動換個方向即可,但TV Out後,只好自己的「」來換個方向,這是第一個。第二個,像機錄影都是使用AVI檔,這個格式檔案太大,很傷HDD空間,所以就必須借助一些工具的幫忙。

在影音轉檔部份,如果是格式轉換,例如AVI轉MP4、AVI轉RMVB…之類,這種免費軟體很多,功能與使用大多很方便,但因為我要幫影像「轉方向」,含這部份功能的免費軟體就少了些。

#1 線上轉檔:如果你家中電腦和我一樣,舊舊的,跑的慢慢的,那簡單格式轉換就合適使用這種方式,例用一些線上網站提供的格式轉換功能,來幫你進行格式轉換的工作。缺點只有你上傳頻寬要大且快,不然上傳大檔案…等的時間還真久。


http://www.online-convert.com/
轉換格式多元,影、音、文件…等。

http://www.clipconverter.cc/
可直接將各影音網頁的影片檔,轉換為指定格式後下載。

這兩個網站各有強項,我就不多介紹了。

#2 格式轉換:利用免費軟體來進行檔案格式轉換的工作,先介紹沒有轉向功能,再介紹有轉向功能。

無轉方向功能:
http://www.garmma.com/tw/downloads/WinAVI9.0.rar
garmma官網提供的工具(含破解),簡單使用。

WinX HD Video Converter Deluxe
可得免費序號,不保證還有免費序號,點看看還有沒有。支援格式相當多,但無rmRM(rmvb)相關格式。

WinAVI 10.x 及WinX系統都要付費,但可以拿到免費的來使用,為什麼不用。

有轉方向功能:
http://www.formatoz.com/
格式工廠,對岸寫的軟體,2.50版安裝後在功能表會出現亂碼,但使用起來正常。特效只能「設定」無法「預覽」,但格式支援完整。

http://www.any-video-converter.com/products/for_video_free/
使用簡單,且可以直接抓取影音網站的影片檔,轉換為指定格式後下載。特效可以先「預覽」,這對我來說是重要的功能,但它不支援RM(RMVB)相關格式。

目前而言,轉成MP4及RMVB都是不錯的選擇,比較新的MKV相容性還不是很好,如果你有需要在TV播放1080p畫質的電影、影片,可以試試MKV,我試過G70內附MKV 1080p檔來播放,畫質細膩,Good!不過前提是你的Source畫質要高,例如DVD等級才MKV有用。

ps.. Garmma G70 MP5有bug,在瀏覽圖片時…很難找到想看的圖片,經反應…沒人理我。@_@

選一個安全的DNS伺服器

我的工作內容有一部份與DNS有關,所以會常常關心有關DNS的消息,最近看到這一篇:「百萬台路由器陷入危機…」,裡面有提供一份資料:


介紹請看這篇, 重點是,為什麼這麼重要的工作,不是由ISP來進行,例如Hinet…等!

你們家裡還在使用「168.95.1.1 / 168.95.192.1」當DNS伺服器,我建議改成使用以上三個的組合,例如「8.8.8.8 + 208.67.222.222」或「8.8.4.4 + 208.67.220.220」,如果你不確定要使用那兩個組合,在Google網站中,有提供「namebench」的效能測試工具,把上面6組IP全部輸入,然後nanebench就會分析結果給你看,從結果中選擇最好的兩個來使用。

這些第三方DNS伺服器,最少能提供額外安全過濾功能,讓你在上網的同時能更放心些!以下是我電腦測試結果:http://namebench.appspot.com/id/2159001,除了以上6台的IP,我還加上Hinet的那兩台,測試結果是「Google + Seednet」,好像怎麼測試Google都會是"第一名"!

峇里島(Bali)入境表格及消費價格參考表



以上是旅行社提供的價目表,有些價錢差不多,像租車、愛之船…可以當成參考資料。

入境必須寫二張表格:

第一張:以家庭為單位,寫一張即可。

正面


背面

全部選No,如果有Yes,我也不知道怎麼辦!

第二張:每人一份,絕大部份抄Passpost。

正面

背面

其中「ACCOMODATION,處住」的英文應該是打錯了,應該是「ACCOMMODATION」少了一個M。

我會特地多拿一份是因為,在機上寫的時候,有些看不懂意思,其實看不懂可以Call美美的空姐來幫忙,但婆婆在旁邊,又不能要電話,所以還是…自己用功。未來希望能常有出國的機會,所以這些表格是最好的教材,拿回來自己K,也分享給各位,先看看,不懂的查一下字典,它只問一些很簡單的問題。

另外For Official use的簡寫,我查不到意思,我也就沒勾選了。(照字面,應該是給官員們勾選的)

自己的孩子自己教

From Books

我借用這本書的書名來當標題,本來我下的標頭是「請擁有孩子的教育權」,但想來想去,實在想不出比這個標題更好的,所以借用一下。

其實我非常佩服這位徐權鼎爸爸,如果說家中有一位資優生是Luck,那一次擁有二位資優生那絕對不是一個Luck那麼簡單,徐權鼎爸爸與徐媽媽將他們兩位生命的力量全部注入這兩位寶貝。

台灣有人稱「變型蟲」,而台灣的教育環境雖然有許多批評,但也不要看壞不看好,這位徐權鼎爸爸就是變型蟲教育裡一位很了不起的教育家,他讓孩子樂在學習,而且把學習當成生活的一部份。

如果你看過另一位教育作者陳之華的書,你會發現兩者所談一個在南極、一個在北極,徐權鼎爸爸所談是在台灣受教者的生存之道,陳之華所講是一個理想、一個夢想、一個未來之路。誰不想兩者皆有,但魚與熊掌…你知道台灣教育還是一條未建好的高速公路,未通車前,我們只能看看書,做做夢,希望等到我們孩子長大後,能有一個現實與夢想能一起存在之地。

這兩位的想法不斷在我心中,產生兩面對立,但其中不變的重點是「家庭」,沒有一個好的家庭,談什麼教育,談什麼資優不資優,談什麼教學環境,談什麼教學理念…什麼都不用談。

這個家庭與貧富無關,但與負不負責有關,用更專業的說法是當責(QBQ)。

生了孩子後,可以說注意力全放在孩子,不管是自己的、家人的、朋友的,我都非常注意,注意每個細節,別人如何教育孩子,別人有何厲害之處,別人有何可改進之處,好的我們學起來,壞的我們一定不會犯,我希望有機會變成為徐權鼎爸爸與陳之華的變型蟲,吸收日月精華,讓我們的孩子可以有良好的德、知、體、群、美,又可以像在芬蘭受教一般。

但我看到一些狀況,使得將算父母有心想要教育孩子,但也會搞得灰頭土面、無計可施的地步。孩子小,定性很重要,大了就很難改了。就是因為孩子還小,所以沒有定性,所以更要好好教導,但很多與長輩同住讓長輩帶孩子,就我看到的,通常沒有什麼好結果。

長輩疼孫子、曾孫是一定的,不管是婆婆家裡或我們家裡,家族聊天時,不免會聊到小時候如何皮,如何被修理,然後話風一轉,就會轉到現在這些長輩現在如何疼這些孫子、曾孫,而這些猴仔是如何爬到這些長輩頭上,我們就會與長輩半開玩笑的說:要是以前我們這樣,早就被打死了。

重點來了,不管是與長輩同住或是讓長輩帶孩子,通常再有智慧的長輩也敵不過疼惜之情。舉例來說,今天你與長輩同住,小孩子做錯事了,當你要管教孩子時,這時說那時快,這位長輩就是會在這個時候出現,然後說:怎麼了?然後就會擋在你的面前,然後說好啦、好啦…,把你往外推,第一次你無法管教孩子,第二次你無法管教孩子,第三次…不要想了,你已經無法管教孩子

我們常說「機會教育」最難得也最重要,但在這種有長輩在的環境裡,常常會碰壁,所以我非常認真的建議各位,一定要好好的與長輩溝通,讓長輩知道,孩子犯錯必須要教導,而不是每次都是找長輩來保護他犯的過錯,你必須把孩子的教育權掌握在手裡。

當有智慧的父母親,很不容易,當有智慧的長輩,更是困難。當我爸爸提出要幫我帶小朋友時,我的臉是笑的,但我的心裡想:「我才不要,我自己的孩子,我要自己教。」而且這種責任,為什麼是長輩來擔?


如果讓長輩帶的孩子,我覺得,那很不負責任。

我所謂「讓長輩帶孩子」是指7 * 24 hour或5*24 hour。現代社會因為種種因素,所以只有少數是非雙薪家庭,在雙薪家庭中,孩子還小時,必須交給保母,或是交給祖父母,或像新聞報導的曾祖父母。由保母帶比較好一些,因為這些保母通常經驗老,帶孩子也比較有一套,不太可能讓孩子爬到頭上,由祖父母帶就…很慘。

父母親白天上班,由保母或祖父母幫幫忙帶,這無可厚非,但有些父母親就是可以為了種種理由,或是簡單只為了「省錢」,由祖父母代替父母,只有假日去接回小孩,去渡個二天一夜的假期,也因為見面的時間少,所以又是疼愛有加,這種情況長大的小孩,就我看到的,脾氣通常都不太好,非常有那種「土皇帝」的感覺,而這種孩子,通常你想管教時,通常都讓你非常頭痛。

我不只聽過一個祖父母這樣說:老了做什麼?帶孫子。我自己可不想過這樣的生活,年輕時為家為子,但老了還要帶孫養孫

我們自己帶孩子都已經用盡精力,何況是我們的祖父母?我都不知道這會不會讓他們短命?我們的爸媽已經幸苦夠久了,現在的我們已經很幸福了,就因為幸福慣了,所以就不願意受帶孩子的苦,我們的爸媽能忍受,所以我們就把帶孩子的責任交給他們。

沒錢,絕對不是理由。我大哥說過一句話:「用好、用壞,吃好、吃壞麥而已。」(台語)

我是相信現世報的人,你現在這樣對你的孩子,將來他們也會一樣回報你。

請好好當你孩子的「一家之長」。