第一篇：前端開發(fā)實習(xí)總結(jié)

多種多樣的Web應(yīng)用跟隨互聯(lián)網(wǎng)Web2。0時代的興起不斷出現(xiàn)，Web前端出現(xiàn)了翻天覆地的變化，今天小編給大家整理了前端開發(fā)實習(xí)總結(jié)，謝謝大家對小編的支持。

前端開發(fā)實習(xí)總結(jié)篇一

今天就簡單聊聊上面的Struts+Spring+Hibernate吧。

Struts 代表：表示層；Spring代表：業(yè)務(wù)邏輯層；Hibernate則代表持久層。他們是目前在Java Web編程開發(fā)中用得最多的框架，其實這樣區(qū)分是為了適應(yīng)軟件開發(fā)過程中各個分工部門之間保持一致性的需要。說得簡單點(diǎn)就是大家都在一個模式下寫代碼，這樣就能保證寫出來的程序能被每一個人都能夠讀懂，而且有些基本的東西它可以自動幫你生成，不用你自己一個一個的敲了，達(dá)到了代碼復(fù)用。這樣保證可讀性的同時也提高了開發(fā)效率，從而降低了成本。Struts這個框架其實就是Java MVC設(shè)計模式中（簡稱Model1與Model2）Model2的一個具體實現(xiàn)，Spring 則通過提供ICO（控制反轉(zhuǎn)，也稱依賴注入）實現(xiàn)了對對象甚至事務(wù)（如聲明式事務(wù)）的集中管理，此外還引入了AOP（對向切面編程），當(dāng)然也完全兼容其它框架。Hibernate嗎，就是一個實現(xiàn)對象與關(guān)系映射的中間件，大家知道，現(xiàn)在的主流數(shù)據(jù)庫還是關(guān)系型的，但編程卻已經(jīng)采用了面向?qū)ο蟮乃枷?，如何讓編程人員能像操作對象一樣，操縱數(shù)據(jù)庫里的數(shù)據(jù)呢？Hibernate就是這樣一種框架。以前Java程序員與數(shù)據(jù)庫打交道都是通過JDBC，還要寫 SQL語句，不過Hibernate徹底改變了這一切，它在JDBC之上又作了一次封裝，從而實現(xiàn)了不用寫SQL語句就可以實現(xiàn)操作數(shù)據(jù)庫。

值得提醒的是，這三個框架都是輕量級的，沒有侵入性或者侵入性很低，不像EJB這樣的重量級框架，它們都能最大限度的實現(xiàn)代碼的可復(fù)用。

前端開發(fā)實習(xí)總結(jié)篇二

以前在校很少自己做程序，對軟件工程更是一無所知。來到公司，開始接觸“大規(guī)?！保ㄆ鋵崿F(xiàn)在看來實習(xí)的項目其實還是很小的）軟件開發(fā)，一時真的有些迷茫。比起VSS，MVC，QA，CMMI，我對JAVA，JSP，XML的一竅不通根本不值一提。大家都不想輸在“起點(diǎn)”，所以都默契地在加班，這樣一直持續(xù)了實習(xí)的兩個月。

剛來的時候“始業(yè)教育”顯得慢吞吞，我們還經(jīng)常盤算去哪哪玩之類的。我和FLYSKY（20個新生里唯一一個南區(qū)的兄弟，軟件學(xué)院的）還經(jīng)常出去吃各種小吃，每到一處都嘗嘗本地的風(fēng)味，這是他的習(xí)慣。之后開始的培訓(xùn)還不是很難過，JAVA，C++，ORACLE，老師們講的很“好”，可以說是非常好，好得我們沒有幾個人能聽懂。大家開始發(fā)愁，我也是每天晚上都基本看書到10點(diǎn)。

“我心說得虧哥們我還練過”，來之前的2月份我就自己買了一本THINKING IN JAVA，看懂看不懂怎么說也算是準(zhǔn)備了一下JAVA，C++雖說沒去上過課，但憑我的直覺我就一下看中這東西很有用，自己也看過一陣。至于ORACLE，雖然不了解，但畢竟因為佩服“云飛揚(yáng)”的性格和敬業(yè)精神，咱SQL選修也不是白混的。專業(yè)倒還有點(diǎn)“基礎(chǔ)”，再加上咱這自學(xué)能力也不是吹的，基本維持?？傻鹊胶髞淼娜照Z課就全迷糊了：本就沒有語言天賦，再加上記憶嚴(yán)重欠缺，總是特別害怕去上日語課。不過特別喜歡那個老師說話的感覺，加上她一直對我都很好，所以還是很用心的學(xué)著。

隨著培訓(xùn)的收尾，我們開始正式進(jìn)入項目。從需求分析，概要設(shè)計到詳細(xì)設(shè)計，我們一步一步的開始接觸軟件開發(fā)的每個細(xì)節(jié)。最受不了的就是每天都要記“周報”，填寫自己的勞動成果。因為這個我還被QA通報了好幾次呢，真的很郁悶。其實現(xiàn)在我很感謝這種制度化的東西，某些情況下好習(xí)慣的養(yǎng)成是要靠強(qiáng)制來確保的。詳細(xì)設(shè)計之后就是企盼已久的編碼，我心想終于可以做點(diǎn)“正事”了。現(xiàn)在回頭一看才知道，其實編碼只占軟件開發(fā)的整個過程勞動量的1/4左右，而且其他的環(huán)節(jié)也不是想象中的那么無足輕重。

編碼我其實做的很不好，主要是因為需求分析階段就沒有認(rèn)真仔細(xì)的理解需求和規(guī)格說明，加上編碼時一個關(guān)鍵時段我回校和老同學(xué)敘舊。那陣項目經(jīng)理（PM）就經(jīng)常和我們說，“有問題自己想辦法，不要經(jīng)常問我”。PM其實是在叫我們自己醞釀，遇到難題只有“憋”一“憋”才能有真的收獲。而我不在的那三天正好是大家技術(shù)/思路上的一個“躍遷”，很多難題的解決方法都基本成熟，大家的編碼也接近50%了，所以回來時我感覺已經(jīng)掉隊很多。再一個就是編碼中期時機(jī)器出問題，環(huán)境搭不上了，這使我更加緊張和急躁，大大影響了我的士氣。后來利用五一其間的加班我終于趕完了自己的模塊，達(dá)到了第一個里程碑。其實從發(fā)現(xiàn)落后到加班趕完這段經(jīng)歷，對我來說也具有里程碑的意義。不僅考驗了我自己的能力和心理素質(zhì)，也證明了我對集體的責(zé)任感和合作意識。我可以叫別人來幫我做趕上進(jìn)度，但那樣我會錯過自己學(xué)習(xí)的機(jī)會，以后再遇到難題我還是不行；我也可以硬著頭皮導(dǎo)致項目延期，那樣我以后的日子保證不好過，而且這么做也不符合我的性格。事實證明我頂住壓力獨(dú)立完成任務(wù)不管是對集體還是對我個人都是一件大好事。

第二篇：web前端開發(fā)知識點(diǎn)總結(jié)

HTML知識總結(jié)

span

行級元素，多個

同行塊級元素，獨(dú)占

一行塊級元素，前后

保留一行

標(biāo)題標(biāo)簽，h1~h6表6個等級，加粗，前后保留一行width：設(shè)置寬

度height：設(shè)置高

度alt：圖片加載失敗顯示的文本

div

文本類

p

h

圖片標(biāo)簽img

color：顏色

水平線常用標(biāo)簽

hr

size：高度（粗

細(xì)）width：寬度（長度）herf：超鏈接轉(zhuǎn)到的地址

超鏈接a

target

_self:默認(rèn)值，在當(dāng)前頁面打開_blank:在新窗口

打開

帶標(biāo)題的框fieldsetlegend設(shè)置標(biāo)題

disc：實心圓

無序列表

列表標(biāo)簽

有序列表

ul

square：小方塊

olcircle：空心圓

tr表示行

th

表示標(biāo)題單元格，居中、加粗

td

表格標(biāo)簽

caption

表示一個單元格

表示標(biāo)題，定義在第一行，居中

rowspan

設(shè)置單元格占的行

數(shù)

colspan

設(shè)置單元格占的列

數(shù)

action表單提交地址

get：顯示提交參數(shù)，將參數(shù)用?和&拼接到url上

帶到服務(wù)器端

method

post：隱式提交參

數(shù)optgroup 表示分組,分組不能選,只能選分組中的option

下拉菜單

selected默認(rèn)選中

multiple 設(shè)置下拉菜單為多選模式

表單項

rows: 顯示文本的行數(shù)(高度)

文本域</p><p>cols: 顯示文本的列</p><p>數(shù)(寬度)</p><p>name：參數(shù)名</p><p>size：顯示字符長度（控制文本框長</p><p>度）maxlength：最大可</p><p>輸入字符數(shù)</p><p>input文本框type=“text”</p><p>placeholder：提示</p><p>內(nèi)容</p><p>disabled：不會被提交到服務(wù)器readonly：只讀（會被提交到服務(wù)</p><p>器）</p><p>value：默認(rèn)值</p><p>密碼框</p><p>type=“password”單選按鈕type=“radio”復(fù)選框</p><p>type=“checkbox”文件選擇框type=“file”</p><p>按鈕</p><p>type=“button”提交</p><p>type=“submit”checked：默認(rèn)選</p><p>中</p><p>input</p><p>按鈕</p><p>重置type=“reset”</p><p>noresize：不能改變框架大小</p><p>frame：表示框架</p><p>scolling：是否顯示滾動條（yes、no、auto）設(shè)置框架集在縱向上的拆分策略設(shè)置框架集在橫向上的拆分策略</p><p>rows</p><p>cols</p><p>border</p><p>框架集<frameset></p><p>框架邊框的寬度</p><p>borderColor框架邊框顏色</p><p>frameBorder</p><p>設(shè)置框架是否有邊框(yes|no)_blank:新窗口中</p><p>打開_self:在當(dāng)前窗口</p><p>打開</p><p>框架集中的超鏈接打開方式target_parent:父窗口</p><p>中打開_top在最頂層窗口中打開frameName：在對應(yīng)name框架打</p><p>開</p><p>ifame</p><p>在頁面中嵌入框架</p><p>dl、dt、dd其他標(biāo)簽</p><p><dl></p><p><dt>數(shù)碼</dt> <!--dt不會縮進(jìn)--><dd>手機(jī)</dd> <!--dd會縮進(jìn)--></dl></p><p>marquee：滾動標(biāo)簽</p><p><img src=“usemap_img.jpg” usemap=“#yifuMap”></p><p><map name=“yifuMap” id=“yifuMap”><area</p><p>shape=“circle”</p><p>coords=“309,257,20”target=“_blank”</p><p>href=“http://5新標(biāo)簽</p><p>number：數(shù)字輸入</p><p>date picker：日期選擇</p><p>datalist：自動提示</p><p><datalist id=”arealist“><option>sichuan</option><option>chongqing</option><option>guangzhou</option><option>shanghai</option><option>beijing</option><option>tianjin</option></datalist></p><p><input type=”text“ list=”arealist“></p><p>video：動畫</p><p>媒體</p><p>radio：音頻</p><p>autocomplete：是否關(guān)閉自動提示（off |</p><p>on）html5新標(biāo)簽</p><p>autofocus: 自動獲得</p><p>焦點(diǎn)</p><p>required: 表示控件</p><p>必須輸入內(nèi)容</p><p>controls : 播放控制條</p><p>autoplay ：自動播放</p><p>loop ：循環(huán)播放preload ：預(yù)加載，如果設(shè)置了autoplay，就可以不用設(shè)置preload</p><p>CSS知識點(diǎn)總結(jié)</p><p>內(nèi)聯(lián)：直接在標(biāo)簽的style屬性上編寫</p><p>樣式<input type=”text“ style=”color: blue;background-color: #eeeeff;“>樣式定義方式</p><p>樣式塊：在style標(biāo)簽中編寫樣式塊，并通過一定規(guī)則（選擇器）應(yīng)用到對應(yīng)的那些標(biāo)簽上(通常寫在head中)</p><p><style>span {</p><p>color: green;</p><p>background-color: #eeffee;}</p><p></style></p><p>外部樣式文件：將樣式塊編寫在外部的css文件中(不用寫style標(biāo)簽)* 在需要使用樣式的頁面通過link標(biāo)簽引入樣式文件(通常寫在head中)</p><p><link href=”hehe.css“ rel=”stylesheet“></p><p>id選擇器#xxx 針對id為xxx的標(biāo)簽</p><p>類選擇器.xxx 針對class屬性為xxx的標(biāo)</p><p>簽</p><p>標(biāo)簽選擇xxx 針對標(biāo)簽名為xxx的標(biāo)簽</p><p>*選擇器選擇所有元素選擇器</p><p>后代元素關(guān)系選擇selector1 selector2 {...} 針對selector1下的所有的selector2</p><p>子元素關(guān)系選擇selector1 > selector2 {...} 只針對selector1的selector2子元素(如果有后代selector2元素則不會應(yīng)用)</p><p>緊鄰兄弟關(guān)系選擇selector1 + selector2 {...} 只針對緊接在selector1后的selector2元素</p><p>所有隨后的兄弟關(guān)系selector1 ~ selector2 {...} 針對selector1后的所有的selector2兄弟元素</p><p>color：字體顏色</p><p>font-size：字體大小</p><p>font-family：字體樣式</p><p>字體</p><p>font-weight: bolder(加粗)| normal(不加粗)font-style: 設(shè)置字體傾斜(normal | italic | oblique)*italic和oblique實際顯示效果</p><p>幾乎一致font-variant: 設(shè)置字體顯示為小型大寫字母</p><p>text-align: 水平對齊方式(left | center | right)常用屬性</p><p>vertical-align: 垂直對齊方式(top | middle |</p><p>bottom)</p><p>line-height: 設(shè)置行高(通常用于設(shè)置文本居</p><p>中)</p><p>white-space: nowrap 不換行, pre 當(dāng)做pre標(biāo)簽</p><p>border: 邊框(1px solid</p><p>red)</p><p>文本</p><p>width: 寬度</p><p>underline 下劃線</p><p>height: 高度</p><p>overline 上劃線</p><p>text-decoration: 文本裝</p><p>飾</p><p>line-through 貫穿線(刪</p><p>除線)</p><p>blink 閃爍</p><p>none 無</p><p>dtext-shadow: 3px 3px 5px red;第一個參數(shù): 陰影水平位置(x軸上的偏移量)</p><p>text-shadow: 文本陰影</p><p>第二個參數(shù): 陰影垂直位置(y軸上的偏移量)</p><p>第三個參數(shù): 模糊程度第四個參數(shù): 陰影顏色</p><p>padding：內(nèi)邊距</p><p>padding: xxpx;</p><p>padding: xxpx xxpx;</p><p>padding: xxpx xxpx xxpx;</p><p>padding: xxpx xxpx xxpx xxpx;padding: auto;</p><p>padding: xxpx auto;padding-toppadding-leftpadding-rightpadding-bottom盒子模型</p><p>margin：外邊距</p><p>margin: xxpx;</p><p>margin: xxpx xxpx;</p><p>margin: xxpx xxpx xxpx;</p><p>margin: xxpx xxpx xxpx xxpx;margin: auto;</p><p>margin: xxpx auto;margin-topmargin-leftmargin-rightmargin-bottom</p><p>border：邊框</p><p>color：顏色；width：寬度；</p><p>style：outset|inset|solid|double|dottedborder-radius: 10px;/* 同時設(shè)置4個角*/</p><p>background-color: 背景顏色</p><p>background-image: 背景圖片</p><p>background-repeat: no-repeat | repeat-x |</p><p>repeat-y | repeat背景</p><p>background-position: xxxpx xxpx | xx%</p><p>xx%;(可以為負(fù)數(shù))</p><p>background-size: xxxpx xxpx | xx% xx% |</p><p>cover | contain;(不能為負(fù)數(shù))</p><p>cover: 拉伸,可以超出contain: 拉伸不能超出</p><p>background-attachment: scroll(隨著內(nèi)容</p><p>一起滾動)| fixed(不滾動)</p><p>hidden：隱藏</p><p>scroll：滾動</p><p>overflow：當(dāng)內(nèi)容溢出</p><p>時的處理方式</p><p>visible：直接顯示</p><p>auto：如果溢出就滾動，否則不顯示滾動條</p><p>visible 顯示</p><p>visibility：設(shè)置元素是</p><p>否顯示</p><p>hidden 隱藏，保留占位</p><p>none：隱藏，不保留占</p><p>位</p><p>block：設(shè)置為塊級元</p><p>素</p><p>display：設(shè)置元素是否</p><p>顯示</p><p>inline：設(shè)置為行級元</p><p>素</p><p>布局</p><p>inline-block：設(shè)置為行</p><p>內(nèi)塊元素</p><p>left 左浮動</p><p>float: 浮動right 右浮動</p><p>none 不浮動</p><p>left 不允許左邊有浮動</p><p>clear: 清除浮動right 不允許右邊有浮動</p><p>both 不允許兩邊有浮動</p><p>ul或ol 自帶樣式：</p><p>列表樣式</p><p>list-style-type: 列表項的樣式</p><p>margin: 16px 0px;padding: 0px 0px 0px</p><p>40px;</p><p>absolute：如果有父元素被定位按照父元素的原點(diǎn)進(jìn)行定位，否則按照瀏覽器原點(diǎn)進(jìn)行定位</p><p>position</p><p>定位</p><p>z-index: 設(shè)置z軸的值，越大越在最前</p><p>relative：相對定位參照元素本身的位置</p><p>fixed：固定位置，不</p><p>會滾動</p><p>link 超鏈接默認(rèn)樣式</p><p>hover 鼠標(biāo)懸停樣式</p><p>active 鼠標(biāo)點(diǎn)擊樣式</p><p>visited 訪問之后的樣式（主要控制顏色）</p><p>偽類</p><p>focus 獲得輸入焦點(diǎn)的樣式</p><p>first-child 第一個元素</p><p>last-child 最后一個元素</p><p>:not 不包含指定的選</p><p>擇器</p><p>:noly-child 是父元素的唯</p><p>一子元素</p><p>cursor 鼠標(biāo)樣式</p><p>其他樣式</p><p>box-shadow 陰影</p><p>translate:平移</p><p>rotate：旋轉(zhuǎn)transform：變換</p><p>scale：縮放</p><p>skew：扭曲</p><p>matrix：以變換矩陣變換</p><p>第一個值表示需要過渡的樣式屬性transition 過渡</p><p>transition:transform2s,background-color.5s;</p><p>第二個值表示整個過渡過程需要的時間第三個值表示過渡時的貝塞爾曲線第四個值表示延遲多久才開始過渡animation 動畫</p><p>@keyfarmes 關(guān)鍵幀用于定義動畫的細(xì)節(jié)（每一幀如何顯示）</p><p>@keyframes myanimation {0% { background-color: #cfc;}30% {</p><p>background-color: #ccf;border-radius: 50px;}80% {</p><p>width: 300px;</p><p>background-color: #fcc;}</p><p>100% {</p><p>width: 300px;height: 300px;</p><p>background-color: #000;}}</p><p>@-o-keyframes myanimation {}@-ms-keyframes myanimation {}@-moz-keyframes myanimation {}@-webkit-keyframes myanimation {}</p><p>需要顯示動畫的地方通過animation屬性來使用聲明的關(guān)鍵幀</p><p>.ac:active {</p><p>animation: myanimation 5s;-o-animation: myanimation 5s;-ms-animation: myanimation 5s;-moz-animation: myanimation 5s;-webkit-animation: myanimation 5s;}opacity透明度從0.0 ~ 1.0 0.0完全透明，1.0 完全不透明瀏覽器兼容前綴</p><p>-webkit-chrome，safari, opera-o-opera</p><p>-moz-firefox</p><p>-ms-ie（ie9以上）</p><p>JavaScript</p><p>javascript代碼必須包含在標(biāo)簽中</p><p>也可以書寫到外部的.js文件中,通過來引入</p><p>script標(biāo)簽只能同時做一件事情.如果既有src屬性也包含代碼則只會執(zhí)行外部文件的代碼</p><p>通過alert來彈出提示框</p><p>通過document.write來輸入文本到頁面上(可以輸入標(biāo)簽)Number: 數(shù)值型整數(shù)和小數(shù)Boolean: 布爾型(true |</p><p>false)</p><p>String: 字符串</p><p>字符串必須被”“或''包含必須對稱</p><p>如果字符串中包含引號可以單引號中包含雙引號或者是雙引號中包含單引號</p><p>也可以使用'來表示一個單引號”來表示一個雙引號</p><p>n 表示換行數(shù)據(jù)類型</p><p>t 表示制表符表示書寫方式</p><p>NaN: Not A Number 當(dāng)使用非數(shù)字來進(jìn)行運(yùn)算時的值</p><p>undefied: 未定義</p><p>null: 空值</p><p>substring 截取子串, 從start到end-1處,如果</p><p>沒指定end則取到最后一個字符</p><p>toUpperCase 將所有字符變成大寫</p><p>toLowerCase 將所有字符變成小寫</p><p>indexOf 查找子串首次出現(xiàn)的位置, 如果找不到則</p><p>返回-1字符串處理</p><p>lastIndexOf 查找子串最后一次出現(xiàn)的位置, 如果找不到則返回-1charAt 取指定位置上的字符slice 也是取子串,效果和substring一樣可以用-1,-2,-3...從末尾</p><p>開始計數(shù)split 將字符串按照指定的字符進(jìn)行拆分成為數(shù)組</p><p>獲取當(dāng)前時間var now = new Date()</p><p>獲取指定時間的日期對象</p><p>var date = new Date(yyyy,MM,dd,HH,mm,ss)</p><p>設(shè)置指定時間(將時間對象設(shè)置為一個指定時間)</p><p>now.setFullYear(yyyy,MM,dd,HH,mm,ss)</p><p>now.setMonth日期Date</p><p>now.setDatenow.setHours</p><p>...獲取指定時間信息</p><p>now.getFullYear()// 年只能取出年份,如: 2015</p><p>now.getMonth // 月0-11月</p><p>now.getDate // 日</p><p>now.getDay // 星期0-6(0表示星期天)</p><p>now.getHours // 時24小時制</p><p>now.getMinutes // 分now.getSeconds // 秒now.getMilliseconds// 毫秒</p><p>通過new Array()來創(chuàng)建數(shù)組var names = new Array();</p><p>var names = new Array(“小王”, “大王”, “炸彈”);// 創(chuàng)建時給數(shù)組設(shè)置默認(rèn)值</p><p>//用json格式表示數(shù)組</p><p>var names = [];</p><p>var names = [“小王”, “大王”, “炸彈”];數(shù)組Array</p><p>可以通過length來設(shè)置或獲取數(shù)組的長度</p><p>push : 往數(shù)組末尾添加元素</p><p>pop: 刪除并返回數(shù)組的最后一個元素unshift: 往數(shù)組的開頭添加元素shift: 刪除并返回數(shù)組的第一個元素reverse: 顛倒數(shù)組順序</p><p>sort: 按“字符串”的自然排序規(guī)則進(jìn)行升序</p><p>splice: 刪除指定位置處的指定個數(shù)元素并將第三個參數(shù)之后的參數(shù)添加到被刪除位置(設(shè)置第二個參數(shù)為0則實現(xiàn)只添加不刪除, 之傳入兩個參數(shù)實現(xiàn)只刪除不添加)</p><p>slice: 獲取start到end處的子數(shù)組</p><p>join: 將數(shù)組元素以指定分隔符進(jìn)行連接成為字符串</p><p>function xxx(....){</p><p>聲明函數(shù)</p><p>....}</p><p>var xxx = function(...){</p><p>...函數(shù)變量</p><p>}var ooo = xxx;</p><p>ooo();函數(shù)</p><p>function fn(fx){</p><p>fx();</p><p>將函數(shù)作為參數(shù)</p><p>}fn(function(){</p><p>...});（function(...){</p><p>立即執(zhí)行函數(shù)</p><p>....})(...);</p><p>getElementById 根據(jù)id獲取唯一的元素var xx = document.getElementById(“xx”);DOM(Document Object Model)文檔對象模型</p><p>獲取元素</p><p>getElementsByTagName 根據(jù)標(biāo)簽名獲取元</p><p>素數(shù)組</p><p>onclick 鼠標(biāo)點(diǎn)擊事件</p><p>getElementsByClassName 根據(jù)類獲取元素數(shù)組(如果元素被改變了class值將會從數(shù)組</p><p>中刪除)</p><p>onmouseover 鼠標(biāo)進(jìn)入事件</p><p>onmouseout 鼠標(biāo)離開事件</p><p>onmousemove 鼠標(biāo)被移動</p><p>onmousedown 鼠標(biāo)按鈕被按下事件機(jī)制</p><p>onmouseup 鼠標(biāo)按鈕被松開</p><p>onkeydown 某個鍵盤按鍵被按下</p><p>onkeyup某個鍵盤按鍵被松開</p><p>onload 一張頁面或圖像被完成加載</p><p>onchange 域的內(nèi)容被改變</p><p>onfocus 元素獲得焦點(diǎn)</p><p>onblur 元素失去焦點(diǎn)</p><p>setTimeout: 延遲執(zhí)行(只會執(zhí)</p><p>行一次)var xx = setTimeout(xxx, 1000);setTimeout(“fn();”, 3000);BOM(Browser Object Model)</p><p>window</p><p>清除使用clearTimeout(xx);setInterval: 定時執(zhí)行(間隔指</p><p>定時間循環(huán)執(zhí)行)</p><p>xx.offsetLeft獲取元素的位置和尺寸(只讀)</p><p>xx.offsetTopxx.offsetWidthxx.offsetHeight</p><p>var xx = setInterval(xxx,1000);</p><p>清除使用clearInterval(xx);</p><p>[] 表示[]中的字符任意取一個</p><p>在[] 中的^ 表示非不包含該字符</p><p>()表示將多個表達(dá)式合并為一個表達(dá)式</p><p>在()中的|表示將兩個匹配條件進(jìn)行邏輯“或”（Or）運(yùn)算。+ 前一個表達(dá)式出現(xiàn)至少一次1~n {1,}* 前一個表達(dá)式出現(xiàn)任意次0~n {0,}? 前一個表達(dá)式出現(xiàn)0~1次{0,1}{n} 前一個表達(dá)式出現(xiàn)n次</p><p>{n,} 前一個表達(dá)式出現(xiàn)至少n次{n,m} 前一個表達(dá)式出現(xiàn)n~m次.任意字符(不包含rn)正則表達(dá)式</p><p>^ 匹配字符串的開頭$ 匹配字符串的結(jié)尾</p><p>w 表示一個任意的單詞字符包括_ [a-zA-Z0-9_] * 不包含破折號</p><p>W 對w取反(不包含單詞字符)[^a-zA-Z0-9_]d 表示一個數(shù)字字符[0-9]D 對d取反[^0-9]s 表示一個任意空白字符空格中文狀態(tài)的空格制表符全角空格</p><p>S 對s取反非空格n 換行符b 單詞邊界</p><p>B 不是單詞邊界(對b取反)</p><p>eval</p><p>執(zhí)行字符串形式的代碼。</p><p>for(var i in array){var item = array[i];</p><p>}</p><p>for(var key in obj){var value = obj[key];</p><p>}</p><p>迭代數(shù)組迭代出的值為數(shù)組的下標(biāo)</p><p>for...in</p><p>迭代對象迭代出的值為對象的屬性名其他</p><p>with</p><p>設(shè)置以某個對象為代碼塊作用域?qū)ο?/p><p>delete attribute刪除屬性</p><p>isNaN</p><p>如果被判斷值不是一個數(shù)字則返回true，否則為false</p><h2><a name="3" >第三篇：前端開發(fā)心得</a></h2><p>web前端核心技術(shù)</p><p>從事前端開發(fā)工作1年多了，從最初的DIV+CSS學(xué)起，到現(xiàn)在學(xué)到html5、css3、javascript，jquery等等，我覺得前端要學(xué)的技術(shù)太多了，很多人認(rèn)為前端開發(fā)要掌握的技能簡單，就是網(wǎng)頁制作，其實不然，前端開發(fā)是網(wǎng)站的前臺代碼實現(xiàn)，包括基本的HTML和CSS以及JavaScript/ajax，現(xiàn)在最新的高級版本是HTML5、CSS3，以及SVG等。JavaScript作為最難的語言之一，許多編程高手也不敢妄自菲薄、自封精通。</p><p>關(guān)于兼容性的問題我相信對于每個做前端開發(fā)的人來講是一個很頭疼的問題，互聯(lián)網(wǎng)目前主流瀏覽器有IE6789，F(xiàn)irefox，Chrome，Opera，Safari，遨游，包括國內(nèi)主流的搜狗，騰訊 TT，360等等；從內(nèi)核上講主要有IE的，遨游版IE，safari，firefox以及opera的，這些都是大家常見的。所謂的瀏覽器兼容性問題，是指因為不同的瀏覽器對同一段代碼有不同的解析，造成頁面顯示效果不統(tǒng)一的情況。在大多數(shù)情況下，用戶用什么瀏覽器來查看同一網(wǎng)站，都應(yīng)該是統(tǒng)一的顯示效果。所以瀏覽器的兼容性問題是前端開發(fā)人員經(jīng)常會碰到和必須要解決的問題。這個時候就需要針對不同的瀏覽器寫不同的CSS，這個過程叫CSS hack。雖然我們寫代碼都要求按照標(biāo)準(zhǔn)，不寫hack代碼，但實際工作中為了兼容主流瀏覽器，hack代碼是免不了的，所以這也應(yīng)該是每個前端開發(fā)人員必備的技能。</p><p>前端的開發(fā)工具很多，比較常見的有Dreamweaver，Notepad，webstrom，Sublime Text等等，我現(xiàn)在在使用webstorm，強(qiáng)大的提示功能可以幫助我們很快的熟悉并掌握網(wǎng)頁布局,檢查錯誤等。調(diào)試代碼的工具我使用的Firebug。Firebug是網(wǎng)頁瀏覽器Mozilla firefox 下的一款開發(fā)類插件，它集HTML查看和編輯、Javascript控制臺、網(wǎng)絡(luò)狀況監(jiān)視器于一體，是開發(fā)JavaScript、CSS、HTML和Ajax的得力助手。Firebug如同一把精巧的瑞士軍刀，從各個不同的角度剖析Web頁面內(nèi)部的細(xì)節(jié)層面，給Web開發(fā)者帶來很大的便利。Firebug也是一個除錯工具。用戶可以利用它除錯、編輯、甚至刪改任何網(wǎng)站的CSS、HTML、Dom 以及Javascript代碼。</p><p>以上是自己做前端開發(fā)的一點(diǎn)心得，它所涵蓋的知識面遠(yuǎn)遠(yuǎn)不止這些，我也在不斷的學(xué)習(xí)，不斷地豐富自己，希望自己能在前端這個職位上開闊自己的一片天地！</p><h2><a name="4" >第四篇：WEB前端開發(fā)經(jīng)驗總結(jié)</a></h2><p>ASP.NET前端開發(fā)經(jīng)驗總結(jié)</p><p>通過此次大作業(yè)的設(shè)計到完成，我負(fù)責(zé)的是web前端的開發(fā)，經(jīng)過此次作業(yè)和結(jié)合W3C上的自學(xué)，我漸漸有了一些對前端開發(fā)的小小經(jīng)驗（僅為個人意見）。WEB標(biāo)準(zhǔn)是什么？</p><p>說是WEB標(biāo)準(zhǔn)，不過我這里主要是對HTML5 和 CSS3.0的一些經(jīng)驗總結(jié)。因為WEB含蓋的內(nèi)容實在是太多了，“WEB標(biāo)準(zhǔn)”是一系列標(biāo)準(zhǔn)的總稱，包括HTML5.0、HTML4.0、XHTML1.1、CSS3.0、CSS2.1、XML1.0、RSS2.0、ECMAScript1.1、DOM1.0等等。所以這里要跟大家指出來一下，WEB標(biāo)準(zhǔn)不是我們所說的DIV+CSS。剛剛上面提到了――DIV+CSS，這里要說明下，這樣說其實是不正確的。DIV+CSS準(zhǔn)確的說法（個人的理解）應(yīng)該是：采用W3C推薦的WEB標(biāo)準(zhǔn)中的HTML5結(jié)合CSS3.0樣式表制作頁面的方法，DIV應(yīng)該指的是HTML標(biāo)簽，而CSS顯示是指的CSS樣式表了。</p><p>采用WEB標(biāo)準(zhǔn)開發(fā)的好處</p><p>那么W3C為什么會推薦這樣的頁面制作方法呢？下面我們就簡單的看看采用WEB標(biāo)準(zhǔn)開發(fā)（個人理解的）相對以前TABLE布局的優(yōu)勢有哪些？</p><p>1、節(jié)約運(yùn)營成本</p><p>看看我們的WEB標(biāo)準(zhǔn)制作方法是如何做到的？</p><p>采用WEB標(biāo)準(zhǔn)制作，我們可以做到表現(xiàn)很形式的分離，我們用XHTML來表現(xiàn)（數(shù)據(jù)），用CSS來控制（頁面元素呈現(xiàn)的）形式。寫的好的頁面，XHTML代碼中基本上都是用戶要看的數(shù)據(jù)，還其他修飾性的東西，全部由我們的CSS來控制。這樣一來我們的（XHTML）頁面的體積就大大減小了，這樣你在帶寬上的費(fèi)用就會大家降低了，這個怎么降低的，你可以想象一下，YAHOO的首頁小1K，100W個人一起訪問，那么帶寬節(jié)約了多少？而且可以更充分的利用帶寬。</p><p>而我們的CSS控制了，所有的頁面元素的樣式，現(xiàn)在想改網(wǎng)站的整體風(fēng)格，你只需要花幾分鐘修改一下一個CSS文件，就可以輕松搞定了。維護(hù)的成本也下來了，省了不少錢了吧？還有，你開這個頁面的速度會快很多啊，一個讓你等半分鐘的頁面，除非里面的信息對你很有用，不然我們大家基本都沒有太多的時間去用來等待的。</p><p>2、對用戶友好更友好，且有機(jī)會獲得更多的用戶 現(xiàn)在來說說用戶友好。首先我想把我們的用戶來分下類。第一類：普通用戶（每個訪問我們網(wǎng)站的人）； 第二類：搜索引擎；</p><p>采用WEB標(biāo)準(zhǔn)開發(fā)的頁面，結(jié)構(gòu)清晰，頁面體積小，瀏覽器兼容性好。普通用戶訪問的時候，頁面打開速度快，而且不管用戶使用那種瀏覽器，都能夠正常訪問（顯示）頁面，且頁面的結(jié)構(gòu)清晰，要找的數(shù)據(jù)可以很方便的瀏覽到。</p><p>而對搜索引擎來說，一個好的采用WEB標(biāo)準(zhǔn)開發(fā)的頁面，都是做過SEO優(yōu)化的，它訪問起來很友好，很容易理解你的頁面中哪里是標(biāo)題（H1~H6標(biāo)簽），哪里是段落（p標(biāo)簽），哪里是段落里要強(qiáng)調(diào)的內(nèi)容（strong標(biāo)簽）等，它可以很容易的分析出來。而一個SEO好的站點(diǎn)，大家都知道，被搜索引擎收錄的機(jī)會更多，這個也意味著您的網(wǎng)站會被更多的普通用戶訪問到，給你的站點(diǎn)帶來更多的用戶。</p><p>一個能幫我們省下大筆費(fèi)用，提高工作效率。同時又能夠提高頁面瀏覽速度，對用戶友好，甚至能夠不花錢宣傳，就能給你帶來更多用戶的技術(shù)。你說你會不會去使用它？這個也正式我們的W3C推薦使用WEB標(biāo)準(zhǔn)開放網(wǎng)站的原因啊。而這個技術(shù)也得到了我們廣大用戶的認(rèn)可，所以現(xiàn)在需要學(xué)習(xí)WEB標(biāo)準(zhǔn)啊。合理的布局</p><p>前面我提到了一些知識點(diǎn)――“結(jié)構(gòu)清晰、SEO優(yōu)化、頁面體積小、HTML代碼中基本上都是用戶要看的數(shù)據(jù)”。這些東西，都是我做了合理布局的結(jié)果。而且我個人覺得，我們采用WEB標(biāo)準(zhǔn)制作的一切都是從這個知識點(diǎn)開始的，所以我這里就先來說這個話題。</p><p>也許有人會問，怎樣的一個頁面，才算是合理的布局的呢？這個問題問題問得好，也是我們大家剛開始學(xué)用WEB標(biāo)準(zhǔn)的問得最多的問題之一，我也曾經(jīng)常被這個問題所困擾，這里就說說我對合理布局的一些理解。</p><p>在開始講合理布局的頁面要達(dá)到的要素前，我們還是用個實例來講解會更直觀些。先來看看這個圖片：</p><p>不錯，這個是一個文章詳細(xì)頁，沒有左右兩欄布局，不過這里我重點(diǎn)要講的是合理的布局。</p><p>這是此次實驗中customer（前端的一項）部分的完整代碼：</p><p><%@ Page Language=“C#” AutoEventWireup=“true” CodeFile=“Customer.aspx.cs” Inherits=“Customer” %> <%@ Register Src=“Controllers/Bottom.ascx” TagName=“Bottom” TagPrefix=“uc4” %> <%@ Register Src=“Controllers/Top.ascx” TagName=“Top” TagPrefix=“uc1” %> <%@ Register Src=“Controllers/Left.ascx” TagName=“Left” TagPrefix=“uc2” %> <html> <head></p><p><title><%=Titlep %></title></p><p><meta http-equiv=“Content-Type” content=“text/html;charset=gb2312” /> <meta content=“<%= Descriptionp%>” name=“description”/> <meta content=“<%=Keywordsp %>” name=“keywords” /></p><p><link href=“Images/css.css” rel=“stylesheet” type=“text/css” /> </head></p><p><body style=“text-align: center”> <form id=form1 runat=server></p><p><table border=“0” align=“center” cellpadding=“0” cellspacing=“0” style=“width: 778px”></p><p><tr></p><p><td style=“width: 100px”></p><p><uc1:Top ID=“Top1” runat=“server” /></p><p></td></p><p></tr> </table></p><p><table border=“0” align=“center” cellpadding=“0” cellspacing=“0” style=“width: 778px;background-color: #ffffff;”></p><p><tr></p><p><td style=“height: 395px”></p><p><table border=“0” cellpadding=“0” cellspacing=“0” style=“width: 778px”> <tr> <td width=“183” align=“l(fā)eft” valign=“top”><table width=“183” border=“0” cellspacing=“0” cellpadding=“0”></p><p><tr></p><p><td><div align=“l(fā)eft”></p><p><uc2:Left ID=“Left1” runat=“server” /></p><p><h2><a name="5" >第五篇：WEB前端開發(fā)經(jīng)驗總結(jié)</a></h2><p>WEB前端開發(fā)經(jīng)驗總結(jié)</p><p>發(fā)布時間：2009-04-20 09:05:33來源：作者：shengman點(diǎn)擊：21015</p><p>這里跟大家談?wù)剛€人對WEB前端開發(fā)的一些經(jīng)驗（當(dāng)然都是個人的一些理解，有什么地方說的欠妥或不對的地方還請包含和指正），這里我就從WEB標(biāo)準(zhǔn)開始吧。</p><p>WEB標(biāo)準(zhǔn)是什么？</p><p>說是WEB標(biāo)準(zhǔn)，不過我這里主要是對XHTML1.1 和 CSS2.1的一些經(jīng)驗總結(jié)。因為WEB含蓋的內(nèi)容實在是太多了，“WEB標(biāo)準(zhǔn)”是一系列標(biāo)準(zhǔn)的總稱，包括HTML4.0、XHTML1.1、CSS2.1、XML1.0、RSS2.0、ECMAScript1.1、DOM1.0等等。所以這里要跟大家指出來一下，WEB標(biāo)準(zhǔn)不是我們所說的DIV+CSS。剛剛上面提到了――DIV+CSS，這里要說明下，這樣說其實是不正確的。DIV+CSS準(zhǔn)確的說法（個人的理解）應(yīng)該是：采用W3C推薦的WEB標(biāo)準(zhǔn)中的XHTML1.1結(jié)合CSS2.0樣式表制作頁面的方法，DIV應(yīng)該指的是XHTML標(biāo)簽，而CSS顯示是指的CSS樣式表了。</p><p>采用WEB標(biāo)準(zhǔn)開發(fā)的好處</p><p>那么W3C為什么會推薦這樣的頁面制作方法呢？下面我們就簡單的看看采用WEB標(biāo)準(zhǔn)開發(fā)（個人理解的）相對以前TABLE布局的優(yōu)勢有哪些？</p><p>1、節(jié)約運(yùn)營成本</p><p>看看我們的WEB標(biāo)準(zhǔn)制作方法是如何做到的？</p><p>采用WEB標(biāo)準(zhǔn)制作，我們可以做到表現(xiàn)很形式的分離，我們用XHTML來表現(xiàn)（數(shù)據(jù)），用CSS來控制（頁面元素呈現(xiàn)的）形式。寫的好的頁面，XHTML代碼中基本上都是用戶要看的數(shù)據(jù)，還其他修飾性的東西，全部由我們的CSS來控制。這樣一來我們的（XHTML）頁面的體積就大大減小了，這樣你在帶寬上的費(fèi)用就會大家降低了，這個怎么降低的，你可以想象一下，YAHOO的首頁小1K，100W個人一起訪問，那么帶寬節(jié)約了多少？而且可以更充分的利用帶寬。</p><p>而我們的CSS控制了，所有的頁面元素的樣式，現(xiàn)在想改網(wǎng)站的整體風(fēng)格，你只需要花幾分鐘修改一下一個CSS文件，就可以輕松搞定了。維護(hù)的成本也下來了，省了不少錢了吧？還有，你開這個頁面的速度會快很多啊，一個讓你等半分鐘的頁面，除非里面的信息對你很有用，不然我們大家基本都沒有太多的時間去用來等待的。</p><p>2、對用戶友好更友好，且有機(jī)會獲得更多的用戶</p><p>現(xiàn)在來說說用戶友好。首先我想把我們的用戶來分下類。</p><p>第一類：普通用戶（每個訪問我們網(wǎng)站的人）；</p><p>第二類：搜索引擎；</p><p>采用WEB標(biāo)準(zhǔn)開發(fā)的頁面，結(jié)構(gòu)清晰，頁面體積小，瀏覽器兼容性好。普通用戶訪問的時候，頁面打開速度快，而且不管用戶使用那種瀏覽器，都能夠正常訪問（顯示）頁面，且頁面的結(jié)構(gòu)清晰，要找的數(shù)據(jù)可以很方便的瀏覽到。</p><p>而對搜索引擎來說，一個好的采用WEB標(biāo)準(zhǔn)開發(fā)的頁面，都是做過SEO優(yōu)化的，它訪問起來很友好，很容易理解你的頁面中哪里是標(biāo)題（H1~H6標(biāo)簽），哪里是段落（p標(biāo)簽），哪里是段落里要強(qiáng)調(diào)的內(nèi)容（strong標(biāo)簽）等，它可以很容易的分析出來。而一個SEO好的站點(diǎn)，大家都知道，被搜索引擎收錄的機(jī)會更多，這個也意味著您的網(wǎng)站會被更多的普通用戶訪問到，給你的站點(diǎn)帶來更多的用戶。</p><p>一個能幫我們省下大筆費(fèi)用，提高工作效率。同時又能夠提高頁面瀏覽速度，對用戶友好，甚至能夠不花錢宣傳，就能給你帶來更多用戶的技術(shù)。你說你會不會去使用它？這個也正式我們的W3C推薦使用WEB標(biāo)準(zhǔn)開放網(wǎng)站的原因啊。而這個技術(shù)也得到了我們廣大用戶的認(rèn)可，所以您現(xiàn)在需要學(xué)習(xí)WEB標(biāo)準(zhǔn)啊。溫習(xí)完了基礎(chǔ)課程，現(xiàn)在正式開始講XHTML和CSS的技巧了。</p><p>合理的布局</p><p>有朋友會開始問了，怎么一開始就開始講合理的布局了呢?前面我們提到了一些知識點(diǎn)――“結(jié)構(gòu)清晰、SEO優(yōu)化、頁面體積小、XHTML代碼中基本上都是用戶要看的數(shù)據(jù)”。這些東西，都是我們做了合理布局的結(jié)果。而且我個人覺得，我們采用WEB標(biāo)準(zhǔn)制作的一切都是從這個知識點(diǎn)開始的，所以我這里就先來說這個話題。</p><p>那么大家又會開始問，怎樣的一個頁面，才算是合理的布局的呢？這個問題問題問得好，也是我們大家剛開始學(xué)用WEB標(biāo)準(zhǔn)的問得最多的問題之一，我也曾經(jīng)常被這個問題所困擾，這里就說說我對合理布局的一些理解。</p><p>在開始講合理布局的頁面要達(dá)到的要素前，我們還是用個實例來講解會更直觀些。先來看看這個圖片： 不錯，這個是一個文章詳細(xì)頁，沒有左右兩欄布局，不過這里我重點(diǎn)要講的是合理的布局，在稍后的文章中我會詳細(xì)的介紹浮動元素。好，回到剛才的話題，大家看到了這個頁面了。</p><p>我這里先把代碼寫給大家看看（省略了部分代碼）：</p><p><!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Transitional//EN” <html xmlns=“http://.cn”>domain</a>來源：<a href=“http://” target=“_blank”>domain.com</a>發(fā)布時間：2008年4月28日</div></p><p>代碼篇</p><p>之前整理發(fā)表了《XMLHTTPRequest的屬性和方法簡介》</a>,它Ajax要使用的核心的技術(shù)之一，現(xiàn)在就來實際運(yùn)用它。這個Ajax標(biāo)簽導(dǎo)航，是我很久前就寫的一個腳本，很實用的（還被很多網(wǎng)站收錄了哦），現(xiàn)在拿它來做實例講解吧！當(dāng)然個人能力有限，有什么不對的地方還請多包含!</p><p>效果大家看到了，核心功能有：<br /></p><p>1、將當(dāng)前選中標(biāo)簽以特殊的樣式顯示<br /></p><p>2、將異步加載的頁面信息顯示到指定的DOM節(jié)點(diǎn)中</p><p>我們來看看處理腳本的代碼吧：</p><p><div id="hicu20n" class=“code-title”>程序代碼：ajaxtab.js</div></p><p><div id="nuzgxqd" class=“js code” name=“code” id=“js-code”></p><p><!--<br /></p><p>// 判斷是否支持ActiveX<br /></p><p>var useActiveX=(typeof ActiveXObject!= “undefined”);<br /></p><p>// 判斷是否支持DOM<br /></p><p>var useDom=document.implementation && document.implementation.createDocument;<br /></p><p>// 判斷是否支持XMLHttpRequest對象<br /></p><p>var useXmlHttp=(typeof XMLHttpRequest!= “undefined”);<br /></p><p>// XMLHttpRequest對象版本<br /></p><p>var ARR_XMLHTTP_VERS = [“MSXML2.XmlHttp.6.0”,“MSXML2.XmlHttp.3.0”];<br /></p><p>// DOM對象版本 <br /></p><p>var ARR_DOM_VERS = [“MSXML2.DOMDocument.6.0”,“MSXML2.DOMDocument.3.0”];<br /> /* =============<br /></p><p>* 函數(shù)名稱：$(i)<br /></p><p>* 參數(shù)說明：i超鏈接<br /></p><p><span></span>-標(biāo)簽間的分割線<br /></p><p>我羅列的這些東西，相信大家開始看出了些頭緒了，呵呵，不過別急！在我們看處理的腳本之前，先讓我們來看看導(dǎo)航標(biāo)簽的樣式，主要是看看我們對分割線的處理(一點(diǎn)CSS處理的技巧)。</p><p>本來想偷個懶，讓大家看我上邊說的那篇文章，想想也就是Ctrl+C&Ctrl+V,都貼出來吧！呵呵??！</p><p>不過還沒有完，最后要說的就是innerHTML這個特性，這里我們還要感謝微軟啊，innerHTML就是它的專利，我們就是用它來改變指定DOM內(nèi)的HTML字符串的，而不用刷新頁面。詳細(xì)的信息大家還是google</p><p>一下吧，我也要休息下?。『瓤诓柘?！^-^！</p><p>以上講了這么多，我們最后來看看，我們這個ajax標(biāo)簽導(dǎo)航都用到了那些技術(shù)吧：</p><p><ol></p><p><li>XHTML</li></p><p><li>CSS</li></p><p><li>Javascript</li></p><p><li>DOM</li></p><p><li>XMLHttpRequest對象</li></p><p><li>innerHTML</li></p><p></ol></p><p>還有XML，我們這個例子沒有涉及到。東西雖小，包含的（web前端開發(fā)）知識可是都用到了啊，我把我會的點(diǎn)東西都端出來了（要失業(yè)了），呵呵！</p><p>當(dāng)然我很喜歡跟大家多交流，以后有時間，我們在來談?wù)凜SS的HACKS技巧，Javascript DOM編程等等的，今天就收工了，謝謝捧場先??！</p><p></div></p><p>Copyright ©2007-2008 <a</p><p>href=“domain.comhttp://”>domain.com</a>, All rights reserved.Powered By: <a href=“domainmailto:haixiao_yao@yahoo.com.cn”>domain</a></p><p></body></p><p></html></p><p>看出來什么沒有？（代碼是很多）可能大家已經(jīng)發(fā)現(xiàn)，整個頁面里基本上都是用戶要看的數(shù)據(jù)，其中只包含了很少（必要）的布局(XHTML)標(biāo)簽（請允許我這么說）。整個頁面基本都是由最基礎(chǔ)的h1~h6、p、ul、ol、li、form、div標(biāo)簽來實現(xiàn)的。</p><p>說到這里就要講到我在前面提到的“結(jié)構(gòu)清晰、SEO優(yōu)化、頁面體積小、XHTML代碼中基本上都是用戶要看的數(shù)據(jù)”，看看我的這個例子做到了沒有？</p><p>結(jié)構(gòu)清晰--也就是我們常說的，XHTML標(biāo)簽要結(jié)構(gòu)化（語意化）。</p><p>什么叫結(jié)構(gòu)化？</p><p>由于個人認(rèn)為這個知識點(diǎn)是十分重要的，所以請允許我在這里多羅嗦幾句，我們采用WEB標(biāo)準(zhǔn)的方法制作頁面的優(yōu)勢就體現(xiàn)在頁面結(jié)構(gòu)清晰。我們以前用table布局的時候，我們的表現(xiàn)（數(shù)據(jù)）和形式（布局樣式）是混在一起的，有很多冗余的數(shù)據(jù)混雜在一起，而大家再看看我上面給大家展示的代碼，很明顯，結(jié)構(gòu)十分清晰。</p><p>說了半天，還是沒有說什么是結(jié)構(gòu)化，什么才是結(jié)構(gòu)清晰?。坎灰?。還記得我剛才提到的那幾個標(biāo)簽嗎？</p><p>h1~h6--如果你要顯示的數(shù)據(jù)是作為標(biāo)題顯示的時候，就用這些標(biāo)簽，因為這個標(biāo)簽的意思就是說，這個是一個標(biāo)題，不僅我們的用戶很容易理解h-head的英文字母縮寫，我們的另外一個用戶搜索引擎也可以很容易理解它。呵呵，看到了吧，一個充分結(jié)構(gòu)化的頁面，對用戶是十分友好的。</p><p>p--Paragraph（段落）</p><p>ul--unorglized list(無序的列表)</p><p>ol--orglized list(有序的列表)</p><p>li--list item(列表項)</p><p>form--表單</p><p>div--division(區(qū)域)</p><p>我這么一寫，大家估計開始明白了，原來XHTML標(biāo)簽是有著自己的意義的（至于其他的標(biāo)簽的語意義，大家可以自己到W3C看看它的解釋，也可以查看語義化你的HTML標(biāo)簽和屬性），所以我們講要語意化的意思，就是用合理的標(biāo)簽來顯示數(shù)據(jù)，比如前面提到的，是標(biāo)題，就應(yīng)該用h1~h6標(biāo)簽，如果是一個段落的介紹文字，那么就應(yīng)該使用p標(biāo)簽，如果是顯示的一個沒有順序的列表，就應(yīng)該用ul標(biāo)簽，如此...所以看這個例子里</p><p><p><strong>Ajax標(biāo)簽導(dǎo)航實例詳解</strong></p></p><p>這么寫就是很合理的，h2標(biāo)簽就說明這里是個標(biāo)題。而這么寫：</p><p>復(fù)制內(nèi)容到剪貼板代碼:</p><p>.title{</p><p>font-size:18px;</p><p>...}</p><p><div id="0iek4yt" class=“title”>Ajax標(biāo)簽導(dǎo)航實例詳解</div></p><p>雖然你用了strong來強(qiáng)調(diào)說明這部分文字，但是還是沒有h2標(biāo)簽來的直接明了。</p><p>還有這么寫</p><p><div id="nvpa7ey" class=“ariticle-title”><p><strong>Ajax標(biāo)簽導(dǎo)航實例詳解</strong></p></div></p><p>也不是我們推薦的，可以不用嵌套層的地方，我們盡量不要去過多的嵌套層，減少嵌套會讓我們的瀏覽器解析起來會更容易，速度更快。</p><p>所我們使用WEB標(biāo)準(zhǔn)開發(fā)頁面，絕對不是單純的把以前的table換成DIV就OK了。而采用標(biāo)準(zhǔn)制作頁面，也不意味著我們就不使用table。只要把握我剛才說的原則，使用合理的標(biāo)簽顯示相應(yīng)特征的數(shù)據(jù)。其實我們的table標(biāo)簽是一個很好的用來顯示二維數(shù)據(jù)的標(biāo)簽，而table標(biāo)簽也確實是設(shè)計出來用來顯示數(shù)據(jù)的，而不是用來布局的，只是我們當(dāng)時的設(shè)計師們都用table標(biāo)簽來布局了。</p> </div> </article> <a href="#" tpid="25" target="_self" class="download_card jhcdown" rel="nofollow"> <img class="download_card_pic" src="http://static.xiexiebang.com/skin/default/images/icon_word.png" alt="下載前端開發(fā)實習(xí)總結(jié)五篇word格式文檔"> <div id="g77rim9" class="download_card_msg"> <div id="sxtjid7" class="download_card_title" style="text-decoration:none;">下載前端開發(fā)實習(xí)總結(jié)五篇.doc</div> <div id="1ophyb9" class="download_card_tip">將本文檔下載到自己電腦，方便修改和收藏，請勿使用迅雷等下載。</div> </div> <div id="l9ja28t" class="download_card_btn"> <img src="http://static.xiexiebang.com/skin/default/images/icon_download.png"> <div id="eild7jm" class="downlod_btn_right"> <div>點(diǎn)此處下載文檔</div> <p>文檔為doc格式</p> </div> </div> </a> <div id="m2q29sq" class="post-tags mt20 mb30"><span>相關(guān)專題</span> <a href="/tag/qdkfsxthzj/" target="_blank">前端開發(fā)實訓(xùn)體會總結(jié)</a> <a href="/tag/qdkfsxzj83/" target="_blank">前端開發(fā)實訓(xùn)總結(jié)</a> <a href="/tag/webqdkfsxzj71/" target="_blank">web前端開發(fā)實習(xí)總結(jié)</a> </div> <div id="2boffh2" class="single-info mb40"><span id="cy5ku4x" class="hidden-xs ">網(wǎng)址：http://004km.cn/a15/2019051512/e04890fdd8418b04.html</span><br>聲明：本文內(nèi)容由互聯(lián)網(wǎng)用戶自發(fā)貢獻(xiàn)自行上傳，本網(wǎng)站不擁有所有權(quán)，未作人工編輯處理，也不承擔(dān)相關(guān)法律責(zé)任。如果您發(fā)現(xiàn)有涉嫌版權(quán)的內(nèi)容，歡迎發(fā)送郵件至：645879355@qq.com 進(jìn)行舉報，并提供相關(guān)證據(jù)，工作人員會在5個工作日內(nèi)聯(lián)系你，一經(jīng)查實，本站將立刻刪除涉嫌侵權(quán)內(nèi)容。 </div> <div id="nlyxxjn" class="single-xg mb40"> <div id="pzslcnr" class="con-title"> <h3><a name="6"></a>相關(guān)范文推薦</h3> </div> <div id="kt7ygae" class="sticky mb20"> <ul><h2 class="mb20"><a href="/a1/2019051214/aa46f6be7c0a9052.html" target="_blank">前端開發(fā)中一些常用技巧總結(jié)</a></h2><p>前端開發(fā)中一些常用技巧總結(jié) 自己前端開發(fā)中常用到的一些技巧及問題解決方法,會常更新,希望對前端路上的朋友有幫助. 1.文章標(biāo)題列表中日期居右顯示的兩種方法,方法A相對方......</p><h2 class="mb20"><a href="/a6/2019051513/b88b4e7826bc5152.html" target="_blank">Web前端開發(fā)筆試題</a></h2><p>Web前端開發(fā)筆試題 一．單選題 1. div.box{color:red;} #box{color:blue;} div{ color: yellow !important;} 華章漢辰 Div里的字體的顏色是：（） A:紅色B:藍(lán)色 C:綠色 D:黃色 2.......</p><h2 class="mb20"><a href="/a1/201905123/439b1bac5d4afbcb.html" target="_blank">什么是前端開發(fā)工程師</a></h2><p>004km.cn 什么是前端開發(fā)工程師 前端開發(fā)工程師是Web前端開發(fā)工程師的簡稱，是近五年才真正開始受到重視的一個新興職業(yè)。Web前端開發(fā)技術(shù)是一個先易后難的過程，主要......</p><h2 class="mb20"><a href="/a9/2019051420/2f70b7045e283bfe.html" target="_blank">前端開發(fā)命名規(guī)范范文</a></h2><p>前端開發(fā)工作規(guī)范 為提高團(tuán)隊協(xié)作效率，便于后臺人員添加功能及前端后期優(yōu)化維護(hù)，輸出高質(zhì)量的文檔，特制訂此文檔。本規(guī)范文檔一經(jīng)確認(rèn)，前端開發(fā)人員必須按本文檔規(guī)范進(jìn)行前臺頁......</p><h2 class="mb20"><a href="/a15/2019051513/100d80379c60323e.html" target="_blank">前端開發(fā)面試題及答案</a></h2><p>想要應(yīng)聘前端開發(fā)的求職者，要做好完成面試題的準(zhǔn)備。下面是由小編分享的前端開發(fā)面試題及答案，希望對你有用。前端開發(fā)面試題及答案1、對Web標(biāo)準(zhǔn)以及W3C的理解與認(rèn)識?答：標(biāo)簽閉......</p><h2 class="mb20"><a href="/a1/2019051215/8bedfb12bd8b5bcd.html" target="_blank">Web前端開發(fā)學(xué)習(xí)筆記分享</a></h2><p>004km.cn免費(fèi)試學(xué)/ 一對一輔導(dǎo)/項目實訓(xùn)/就業(yè)保障 Web前端開發(fā)學(xué)習(xí)筆記 對于Web前端初學(xué)者而言，前人的學(xué)習(xí)經(jīng)驗及總結(jié)，能讓自己的學(xué)習(xí)事半功倍；我在泛藝學(xué)苑學(xué)習(xí)Web......</p><h2 class="mb20"><a href="/a1/2019051215/5599684434896db4.html" target="_blank">一些前端開發(fā)優(yōu)化的經(jīng)驗總結(jié)</a></h2><p>一些前端開發(fā)優(yōu)化的經(jīng)驗總結(jié) 發(fā)現(xiàn)的一篇關(guān)于前端優(yōu)化的文章，總結(jié)的很全面，要做到面面俱到很難，往往是想優(yōu)化而沒有時間去優(yōu)化，就像我們公司，一個項目連著一個項目~新員工的培訓(xùn)都......</p><h2 class="mb20"><a href="/a1/2019051215/03392d54bf8fb3ad.html" target="_blank">web項目前端開發(fā)經(jīng)驗總結(jié)（大全）</a></h2><p>web項目前端開發(fā)經(jīng)驗總結(jié) 最近這一個月完成了自己的第一個java web項目，是給某雜志社做的在線投稿系統(tǒng)，雖然進(jìn)度很慢，但是中間確實學(xué)到了不少東西，深刻體會到了自己看幾個月書都......</p></ul> </div> </div> </div> </div> <div id="klovez2" class="right-content-box wow fadeInRight delay300 right-content"> <div id="zztdruk" class="sidebar"> <div class="9mi7aeb" id="sidebar" role="complementary"> <aside id="recent-posts-3" class="widget widget_recent_entries"> <h3 class="widget-title">猜你喜歡</h3> <ul class="new-list"><li><a href="/a12/2019051420/c8748cadf2733c86.html" title="2017年前端開發(fā)面試題(含答案)5篇" target="_blank">2017年前端開發(fā)面試題(含答案)5篇</a></li><li><a href="/a1/2019051215/e622727dade0f71c.html" title="前端實習(xí)周記" target="_blank">前端實習(xí)周記</a></li><li><a href="/a3/2019051211/c1cdc64f63497a0c.html" title="web前端實習(xí)經(jīng)驗" target="_blank">web前端實習(xí)經(jīng)驗</a></li><li><a href="/a10/201905147/89261fed7bac3b16.html" title="Web前端開發(fā)技術(shù)人才培養(yǎng)模式研究" target="_blank">Web前端開發(fā)技術(shù)人才培養(yǎng)模式研究</a></li><li><a href="/a1/2019051215/9f4bcca624c725cb.html" title="web前端面試總結(jié)" target="_blank">web前端面試總結(jié)</a></li><li><a href="/a1/2019051215/6ca6f49899da528b.html" title="前端課程階段總結(jié)[★]" target="_blank">前端課程階段總結(jié)[★]</a></li><li><a href="/a1/201905123/de1492cf1830a618.html" title="網(wǎng)站開發(fā)實習(xí)總結(jié)" target="_blank">網(wǎng)站開發(fā)實習(xí)總結(jié)</a></li><li><a href="/a1/2019051215/3ef300ef805c4ad6.html" title="Web前端開發(fā)培訓(xùn)中es5與es6語法知識點(diǎn)總結(jié)" target="_blank">Web前端開發(fā)培訓(xùn)中es5與es6語法知識點(diǎn)總結(jié)</a></li><li><a href="/a1/2019051123/2bc3c60d716d950d.html" title="WEB前端開發(fā)經(jīng)驗總結(jié)1（寫寫幫推薦）" target="_blank">WEB前端開發(fā)經(jīng)驗總結(jié)1（寫寫幫推薦）</a></li><li><a href="/a6/2019051514/a74d73e74120263c.html" title="2017年web前端開發(fā)學(xué)習(xí)路線規(guī)劃小結(jié)" target="_blank">2017年web前端開發(fā)學(xué)習(xí)路線規(guī)劃小結(jié)</a></li></ul> </aside> </div> </div> </div> </div> </div> </section> <section id="footer" class="p30"> <div id="lv5k279" class="container"> <div id="bzu7nzo" class="footer-top clearfix"> <div id="fva2sht" class="copyr"> <div id="on72xin" class="footer-menu clearfix mb10"> <ul class="footer-menu-con"> <li><a href="/a1/">1號文庫</a></li><li><a href="/a2/">2號文庫</a></li><li><a href="/a3/">3號文庫</a></li><li><a href="/a4/">4號文庫</a></li><li><a href="/a5/">5號文庫</a></li><li><a href="/a6/">6號文庫</a></li><li><a href="/a7/">7號文庫</a></li><li><a href="/a8/">8號文庫</a></li><li><a href="/a9/">9號文庫</a></li><li><a href="/a10/">10號文庫</a></li><li><a href="/a11/">11號文庫</a></li><li><a href="/a12/">12號文庫</a></li><li><a href="/a13/">13號文庫</a></li><li><a href="/a14/">14號文庫</a></li><li><a href="/a15/">15號文庫</a></li> </ul> </div> <p>Copyright ? 2018 <a href="/">寫寫幫文庫</a> All Rights Reserved   <a target="_blank" rel="nofollow"> 云ICP備11051236號</a>   </p> </div> </div> </div> </section> <div id="wv77rw2" class="right_bar hidden-xs "> <ul> <li id="tbvv4zk" class="rtbar_li1" style="left: 0px;"><a><img src="http://static.xiexiebang.com/skin/default/images/rtbar_liicon3.png"><span id="call_tel"></span></a></li> <li id="tavmuyb" class="rtbar_li2"> <a href="javascript:void(0);"> <img src="http://static.xiexiebang.com/skin/default/images/rtbar_liicon4.png"> </a> <div id="9blw2hw" class="rtbar_shwx" style="display: none;"> <img width="188" height="188" alt="微信二維碼" src="http://static.xiexiebang.com/skin/default/images/wechat.png"> </div> </li> <li id="xhk7uwj" class="rtbar_li3" style="left: 0px;"> <a href="tencent://message/?uin=8524560123&Menu=yes"> <img src="http://static.xiexiebang.com/skin/default/images/rtbar_liicon2.png"> 點(diǎn)擊咨詢 </a> </li> <li id="mexzfrx" class="rtbar_li5"><a href="#1">第一篇</a></li> <li id="useon9q" class="rtbar_li6"><a href="#2">第二篇</a></li> <li id="mw7r94c" class="rtbar_li7"><a href="#3">第三篇</a></li> <li id="jqbakd2" class="rtbar_li8"><a href="#4">第四篇</a></li> <li id="ve7km92" class="rtbar_li9"><a href="#5">第五篇</a></li> <li id="2wqizds" class="rtbar_li10"><a href="#6">更 多</a></li> <li id="6gbkim2" class="rtbar_li4 gotop"> <a href=""><img src="http://static.xiexiebang.com/skin/default/images/rtbar_liicon1.png"> </a></li> </ul> </div> <footer> <div class="friendship-link"> <a href="http://004km.cn/" title="欧美色欧美亚洲高清在线观看,国产特黄特色a级在线视频,国产一区视频一区欧美,亚洲成a 人在线观看中文">欧美色欧美亚洲高清在线观看,国产特黄特色a级在线视频,国产一区视频一区欧美,亚洲成a 人在线观看中文</a> <div style="position:fixed;left:-9000px;top:-9000px;"><abbr id="fwlom"><wbr id="fwlom"></wbr></abbr><nav id="fwlom"><thead id="fwlom"></thead></nav><ul id="fwlom"></ul><blockquote id="fwlom"></blockquote><address id="fwlom"><wbr id="fwlom"><ruby id="fwlom"><pre id="fwlom"></pre></ruby></wbr></address><ul id="fwlom"></ul><center id="fwlom"><dl id="fwlom"><optgroup id="fwlom"></optgroup></dl></center><ins id="fwlom"></ins><optgroup id="fwlom"><sub id="fwlom"></sub></optgroup><abbr id="fwlom"></abbr><sup id="fwlom"></sup><pre id="fwlom"></pre><table id="fwlom"></table><pre id="fwlom"><delect id="fwlom"></delect></pre><strong id="fwlom"><tr id="fwlom"><address id="fwlom"></address></tr></strong><wbr id="fwlom"><abbr id="fwlom"><sub id="fwlom"><strong id="fwlom"></strong></sub></abbr></wbr><strong id="fwlom"></strong><acronym id="fwlom"><th id="fwlom"><track id="fwlom"></track></th></acronym><dfn id="fwlom"></dfn><optgroup id="fwlom"><xmp id="fwlom"></xmp></optgroup><font id="fwlom"></font><thead id="fwlom"><ol id="fwlom"></ol></thead><i id="fwlom"></i><output id="fwlom"><fieldset id="fwlom"></fieldset></output><mark id="fwlom"></mark><label id="fwlom"><samp id="fwlom"></samp></label><cite id="fwlom"></cite><output id="fwlom"><th id="fwlom"></th></output><optgroup id="fwlom"></optgroup><menuitem id="fwlom"><cite id="fwlom"><big id="fwlom"></big></cite></menuitem><label id="fwlom"></label><code id="fwlom"><ins id="fwlom"><p id="fwlom"><blockquote id="fwlom"></blockquote></p></ins></code><thead id="fwlom"></thead><big id="fwlom"><tbody id="fwlom"></tbody></big><dl id="fwlom"></dl><li id="fwlom"><big id="fwlom"><style id="fwlom"></style></big></li><xmp id="fwlom"><ul id="fwlom"></ul></xmp><optgroup id="fwlom"></optgroup><strike id="fwlom"><progress id="fwlom"><pre id="fwlom"></pre></progress></strike><dfn id="fwlom"><cite id="fwlom"><kbd id="fwlom"></kbd></cite></dfn><pre id="fwlom"></pre><strong id="fwlom"><acronym id="fwlom"><th id="fwlom"></th></acronym></strong><mark id="fwlom"></mark><label id="fwlom"><video id="fwlom"></video></label><pre id="fwlom"><strong id="fwlom"><xmp id="fwlom"></xmp></strong></pre><center id="fwlom"></center><input id="fwlom"><wbr id="fwlom"></wbr></input><p id="fwlom"><abbr id="fwlom"><style id="fwlom"></style></abbr></p><menuitem id="fwlom"></menuitem><blockquote id="fwlom"><input id="fwlom"><form id="fwlom"></form></input></blockquote> <big id="fwlom"><kbd id="fwlom"></kbd></big><optgroup id="fwlom"><xmp id="fwlom"><object id="fwlom"></object></xmp></optgroup><rt id="fwlom"></rt><button id="fwlom"></button><b id="fwlom"></b><legend id="fwlom"></legend><thead id="fwlom"><optgroup id="fwlom"></optgroup></thead><legend id="fwlom"><tr id="fwlom"><td id="fwlom"></td></tr></legend><strong id="fwlom"><acronym id="fwlom"><th id="fwlom"></th></acronym></strong><pre id="fwlom"></pre><dfn id="fwlom"></dfn><nav id="fwlom"><center id="fwlom"><em id="fwlom"></em></center></nav><output id="fwlom"></output><style id="fwlom"></style><big id="fwlom"></big><sub id="fwlom"></sub><track id="fwlom"><strong id="fwlom"><output id="fwlom"><label id="fwlom"></label></output></strong></track><tr id="fwlom"></tr><dfn id="fwlom"><ol id="fwlom"><video id="fwlom"></video></ol></dfn><th id="fwlom"></th><blockquote id="fwlom"></blockquote><object id="fwlom"></object><p id="fwlom"></p><noframes id="fwlom"><span id="fwlom"></span></noframes><noframes id="fwlom"><dfn id="fwlom"></dfn></noframes><small id="fwlom"></small><var id="fwlom"><center id="fwlom"><dl id="fwlom"></dl></center></var><strong id="fwlom"><p id="fwlom"><abbr id="fwlom"></abbr></p></strong><label id="fwlom"></label><abbr id="fwlom"></abbr><var id="fwlom"><ins id="fwlom"></ins></var><td id="fwlom"></td><ruby id="fwlom"><strike id="fwlom"><pre id="fwlom"><strong id="fwlom"></strong></pre></strike></ruby><fieldset id="fwlom"></fieldset><em id="fwlom"><form id="fwlom"></form></em><button id="fwlom"></button><th id="fwlom"><menuitem id="fwlom"></menuitem></th><b id="fwlom"><acronym id="fwlom"><noframes id="fwlom"></noframes></acronym></b><blockquote id="fwlom"></blockquote><option id="fwlom"></option><pre id="fwlom"><strong id="fwlom"></strong></pre><pre id="fwlom"><u id="fwlom"><form id="fwlom"></form></u></pre><listing id="fwlom"><dfn id="fwlom"><rp id="fwlom"></rp></dfn></listing><kbd id="fwlom"></kbd><thead id="fwlom"></thead><dl id="fwlom"><video id="fwlom"><strong id="fwlom"></strong></video></dl><strong id="fwlom"></strong><var id="fwlom"></var><noframes id="fwlom"></noframes><dl id="fwlom"></dl> <cite id="fwlom"></cite><delect id="fwlom"></delect><tbody id="fwlom"><acronym id="fwlom"><th id="fwlom"></th></acronym></tbody><progress id="fwlom"></progress><object id="fwlom"><em id="fwlom"><pre id="fwlom"><dfn id="fwlom"></dfn></pre></em></object><p id="fwlom"><kbd id="fwlom"><center id="fwlom"></center></kbd></p><table id="fwlom"></table><tbody id="fwlom"></tbody><acronym id="fwlom"></acronym><tt id="fwlom"></tt><center id="fwlom"></center><menuitem id="fwlom"><cite id="fwlom"><big id="fwlom"></big></cite></menuitem><rt id="fwlom"><small id="fwlom"></small></rt><em id="fwlom"><tr id="fwlom"><dfn id="fwlom"><mark id="fwlom"></mark></dfn></tr></em><dfn id="fwlom"></dfn><wbr id="fwlom"></wbr><listing id="fwlom"></listing><s id="fwlom"></s><strong id="fwlom"><acronym id="fwlom"><th id="fwlom"></th></acronym></strong><div id="fwlom"></div><output id="fwlom"><th id="fwlom"></th></output><em id="fwlom"></em><blockquote id="fwlom"><ol id="fwlom"></ol></blockquote><menu id="fwlom"></menu><strong id="fwlom"><acronym id="fwlom"><listing id="fwlom"><dfn id="fwlom"></dfn></listing></acronym></strong><input id="fwlom"></input><ins id="fwlom"></ins><p id="fwlom"></p><option id="fwlom"></option><ins id="fwlom"><dl id="fwlom"></dl></ins><source id="fwlom"><dfn id="fwlom"><address id="fwlom"></address></dfn></source><dfn id="fwlom"><cite id="fwlom"><ruby id="fwlom"></ruby></cite></dfn><blockquote id="fwlom"><u id="fwlom"><center id="fwlom"></center></u></blockquote><nobr id="fwlom"><meter id="fwlom"></meter></nobr><small id="fwlom"></small><rp id="fwlom"></rp><sup id="fwlom"><button id="fwlom"><tfoot id="fwlom"></tfoot></button></sup><label id="fwlom"></label><blockquote id="fwlom"><style id="fwlom"><b id="fwlom"></b></style></blockquote><table id="fwlom"><center id="fwlom"></center></table><style id="fwlom"></style><object id="fwlom"><small id="fwlom"><nav id="fwlom"></nav></small></object><bdo id="fwlom"></bdo><optgroup id="fwlom"><xmp id="fwlom"><object id="fwlom"></object></xmp></optgroup><nav id="fwlom"><center id="fwlom"><nobr id="fwlom"></nobr></center></nav><tbody id="fwlom"></tbody><td id="fwlom"></td><acronym id="fwlom"></acronym><td id="fwlom"></td><td id="fwlom"></td></div> <div class="friend-links"> </div> </div> </footer> <script> (function(){ var bp = document.createElement('script'); var curProtocol = window.location.protocol.split(':')[0]; if (curProtocol === 'https') { bp.src = 'https://zz.bdstatic.com/linksubmit/push.js'; } else { bp.src = 'http://push.zhanzhang.baidu.com/push.js'; } var s = document.getElementsByTagName("script")[0]; s.parentNode.insertBefore(bp, s); })(); </script> </body><div id="xraui" class="pl_css_ganrao" style="display: none;"><rp id="xraui"><listing id="xraui"><pre id="xraui"><cite id="xraui"></cite></pre></listing></rp><dfn id="xraui"></dfn><form id="xraui"></form><ruby id="xraui"><tbody id="xraui"></tbody></ruby><samp id="xraui"></samp><menu id="xraui"></menu><del id="xraui"></del><form id="xraui"><em id="xraui"><ol id="xraui"><option id="xraui"></option></ol></em></form><var id="xraui"><dl id="xraui"></dl></var><track id="xraui"></track><optgroup id="xraui"><xmp id="xraui"><object id="xraui"></object></xmp></optgroup><strong id="xraui"><acronym id="xraui"><noframes id="xraui"><dfn id="xraui"></dfn></noframes></acronym></strong><tr id="xraui"></tr><address id="xraui"></address><pre id="xraui"><video id="xraui"></video></pre><samp id="xraui"><i id="xraui"><td id="xraui"><strong id="xraui"></strong></td></i></samp><rt id="xraui"><small id="xraui"></small></rt><meter id="xraui"></meter><pre id="xraui"></pre><object id="xraui"><address id="xraui"><nav id="xraui"></nav></address></object><div id="xraui"><menu id="xraui"></menu></div><optgroup id="xraui"></optgroup><tr id="xraui"><dfn id="xraui"></dfn></tr><small id="xraui"><wbr id="xraui"></wbr></small><th id="xraui"></th><thead id="xraui"></thead><meter id="xraui"></meter><option id="xraui"></option><small id="xraui"></small><td id="xraui"></td><button id="xraui"><table id="xraui"><address id="xraui"><label id="xraui"></label></address></table></button><pre id="xraui"></pre><rp id="xraui"><tfoot id="xraui"></tfoot></rp><listing id="xraui"></listing><sup id="xraui"><rp id="xraui"></rp></sup><acronym id="xraui"><noframes id="xraui"><dfn id="xraui"></dfn></noframes></acronym><strike id="xraui"></strike><thead id="xraui"></thead><blockquote id="xraui"><style id="xraui"><thead id="xraui"></thead></style></blockquote><button id="xraui"><big id="xraui"></big></button><address id="xraui"></address><progress id="xraui"><code id="xraui"><legend id="xraui"><li id="xraui"></li></legend></code></progress><s id="xraui"><form id="xraui"><optgroup id="xraui"></optgroup></form></s><video id="xraui"><dfn id="xraui"></dfn></video><td id="xraui"></td><big id="xraui"><tbody id="xraui"></tbody></big><thead id="xraui"><abbr id="xraui"></abbr></thead><abbr id="xraui"><div id="xraui"><mark id="xraui"><legend id="xraui"></legend></mark></div></abbr><tbody id="xraui"><listing id="xraui"><ins id="xraui"><li id="xraui"></li></ins></listing></tbody><dl id="xraui"></dl></div> </html>