《ppk 談 javascript》讀書筆記 byWasabi

《ppk 談 javascript》讀書筆記 bywasabi三個分離

1. 表現與結構分離 (css 與其html);

2. 行為與結構分離 (javascript 與 html);

3. 行為與表現分離 (javascript 與 css);

行為與結構分離

1) 獨立檔案中的函數

2) 從html中先移除事件處理程式

html代碼

//錯誤示範：  

<a href="javascript:showpopup('niceimage.jpg');">do nifty!</a>  

//正确示範：  

<a href="niceimage.jpg" id="nice">do nifty!</a>  

document.getelementbyid('nice').onclick = function (){ showpopup(this.href);}  

//錯誤示範： <a href="javascript:showpopup('niceimage.jpg');">do nifty!</a> //正确示範： <a href="niceimage.jpg" id="nice">do nifty!</a> document.getelementbyid('nice').onclick = function (){ showpopup(this.href);}

可通路性規則

1. 條理分明的html

2. 寫死的連接配接必須有href

3. 産生對本使用者有意思的内容

4. 用javascript隐藏内容

重定向使用者

js代碼 <embed width="14" height="15" pluginspage="http://www.macromedia.com/go/getflashplayer" type="application/x-shockwave-flash" allowscriptaccess="always" quality="high" src="http://wasabi.javaeye.com/javascripts/syntaxhighlighter/clipboard_new.swf">

//它會覆寫舊頁面在遊覽器中的曆史記錄。當使用者點選後退，她會被送到曆史記錄中的前一個頁面。  

location.replace('scriptpage.html');  

//它會建立一條新的遊覽器中的曆史記錄。當使用者點選後退，會被送到href前的那個page,跟着又執行location.href.後退按鈕的功能事實上被破壞了，這也是現有的最糟糕的可用性問題之一。  

location.href = 'scriptpage.html';  

//它會覆寫舊頁面在遊覽器中的曆史記錄。當使用者點選後退，她會被送到曆史記錄中的前一個頁面。 location.replace('scriptpage.html'); //它會建立一條新的遊覽器中的曆史記錄。當使用者點選後退，會被送到href前的那個page,跟着又執行location.href.後退按鈕的功能事實上被破壞了，這也是現有的最糟糕的可用性問題之一。 location.href = 'scriptpage.html';