資源描述：
《編寫高質量代碼--web前端開發(fā)修煉之道筆記》由會員上傳分享，免費在線閱讀，更多相關內容在工程資料-天天文庫。
1、第一章從網站重構說起打造高質最的前端代碼，提高代碼的可維護性——精簡、重用、有序。第二章團隊合作精一行，通卜行。增加代碼可讀性——注釋。重用性需提高，分為公共組件為私有組件，代碼模塊化。公共組件不能輕易修改，因為影響大，所以一般只提供“讀”的權限。磨刀不謀砍柴工——前期的構思很重要。構思的主要內弈包括規(guī)范的制定、公共紐?件的設計和復雜功能的技術方案等。一般來說，前期構思占?整個項目3()%?60%的時間都算是正常的。第三章高質雖:的HTML?3-1標簽語義對照表標簽名英文金拼中文翻譯divdiv
2、ision分隔spanspan范［flolorderedlist排序列段ulunordcredlist不排序列Alilistitem列衣項目dldefinitionlist定義列左dtdefinitionterm定義術諂dddefinitiondescription定義描述deldeleted捌除insinserted插入hl??h6header1toheader6杯題1到杯趣6Pparagraph段落hrhorizontalrule水平尺aanchor錨abbrabbreviation縮寫詞a
3、cronymacronym取首字母的縮耳訶addressaddress地址varvariableprepreformatted険定義格式blockquoteblockquotation區(qū)塊引用語strongstrongememphasizedbbold粗體iitalic斜體（續(xù)）標簽名英文全拼中文翻譯bigbig空大smallsmall受小supsuperscripted上標subsubscripted下標brbreak換行centercenter居中fontfont字體uunderlined下
4、劃線sStrikethrough刪除踐fieldsctfieldset域集legendlegend圖標captioncaption標鬆CSS只是web標準的一部分，在HTML、CSS、JS三人元素屮，HTML才是最重要的，結構才是重點，樣式是用來修飾結構的。正確的做法是，先確定HTML,確定語義的標簽，再來選用合適的CSSo判斷標簽語義是否良好的簡單方法：去掉樣式，看網頁結構是否組織良好有序，是否仍然有很好的可讀性。語義良好的網頁去掉樣式后結構依然很清晰?！癈SS裸體日”，2006.04.05第
5、一屆，從第三屆開始改為4月9日。（設立FI的就是為了提醍大家用合適的HTML標簽的重要性）一個語義良好的頁而，h標簽應該是完整有序沒有斷層的，也就是說要按照hl、h2、h3、h4這樣的次序排下來，不要出現類似hl、h3、h4,漏掉h2的情況。當頁面內標簽無法滿足設計需要時,才會適當添加div和span等五語義標簽來輔助實現。第四章高質量的CSS紐織CSS的方法：base.css+common.css+page.css,在一般情況卜任何一個網頁的最終表現都是由這三者共同完成的，這三者不是并列結構，
6、而是層疊結構。1?base層這一層位于三者的最底層，提供CSSreset功能和粒度最小的通用類——原子類。這一層會被所有頁面引用，是頁面樣式所需依賴的最底層。這一層與具體UI無關，無論何種風格的設計都可以引用它，所以base層要力求精簡和通用。如果將用CSS控制頁面樣式比喻為建房子，這一層的核心職能是為房子打好地基（CSSreset）,并將建房用的磚塊（原子類）準備充足。因為幾乎所有的房子都要打地基，也都需要磚塊，所以base層具有高度可移植性，不同設計風格的網站可以使用同一個base層。因為這
7、一層的內容很少，所以可以簡單地放在一個文件里，例如base.css-base層相對穩(wěn)定，基本上不需要維護。2.common層這i層位于中間，提供組件級的css類?提到組件，就不得不提“模塊化”.“模塊化”可以從樣式和行為兩個層面來考蟲，與common層相關的是樣式的模塊化?我們可以將頁面內的元素拆分成一小塊一小塊功能和樣式相對獨立的小“模塊”，這些“模塊”有些是很少章復的，有些是會大量重復的，我們可以將大量重復的“模塊”視為一個組件。我們從頁面里盡可能多地將組件提取出來，放在common層里。c
8、ommon層就相當于MVC模式中的M（Model,模型）。為了保證重用性和靈活性，M需要盡可能將內部實現封裝，對可能會經常變化的部分提供靈活的接口?關于common層的技巧，詳見4.4節(jié)。common層就像建房時用到的門窗.不同風格的房子會用到不同樣式的門窗，各個房間用到的門窗的數帚和位賈可以不同，但樣式相同。門窗有自己的小元件，I:匕如玻璃、門閂、門框、門板.鑰匙孔等.門窗可以籟體移動.增減，但門窗本身的構造是相對穩(wěn)定的。不同風格的房子就好比不同風格的網站，房子選用的門窗就好比這個網站選用的U
