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

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

HTML知識總結(jié)

span

行級元素，多個(gè)

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

一行塊級元素，前后

保留一行

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

度height：設(shè)置高

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

div

文本類

圖片標(biāo)簽img

color：顏色

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

size：高度（粗

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

超鏈接a

target

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

打開

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

disc：實(shí)心圓

無序列表

列表標(biāo)簽

有序列表

square：小方塊

olcircle：空心圓

tr表示行

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

表格標(biāo)簽

caption

表示一個(gè)單元格

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

rowspan

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

數(shù)

colspan

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

數(shù)

action表單提交地址

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

帶到服務(wù)器端

method

post：隱式提交參

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

下拉菜單cols: 顯示文本的列數(shù)(寬度)name：參數(shù)名size：顯示字符長度（控制文本框長度）maxlength：最大可輸入字符數(shù)input文本框type=“text”placeholder：提示內(nèi)容disabled：不會被提交到服務(wù)器readonly：只讀（會被提交到服務(wù)器）value：默認(rèn)值密碼框type=“password”單選按鈕type=“radio”復(fù)選框type=“checkbox”文件選擇框type=“file”按鈕type=“button”提交type=“submit”checked：默認(rèn)選中input按鈕重置type=“reset”noresize：不能改變框架大小frame：表示框架scolling：是否顯示滾動條（yes、no、auto）設(shè)置框架集在縱向上的拆分策略設(shè)置框架集在橫向上的拆分策略rowscolsborder框架集<frameset>框架邊框的寬度borderColor框架邊框顏色frameBorder設(shè)置框架是否有邊框(yes|no)_blank:新窗口中打開_self:在當(dāng)前窗口打開框架集中的超鏈接打開方式target_parent:父窗口中打開_top在最頂層窗口中打開frameName：在對應(yīng)name框架打開ifame在頁面中嵌入框架dl、dt、dd其他標(biāo)簽<dl><dt>數(shù)碼</dt> <dd>手機(jī)</dd> </dl>marquee：滾動標(biāo)簽<img src=“usemap_img.jpg” usemap=“#yifuMap”><map name=“yifuMap” id=“yifuMap”><areashape=“circle”coords=“309,257,20”target=“_blank”href=“http://5新標(biāo)簽number：數(shù)字輸入date picker：日期選擇datalist：自動提示<datalist id=”arealist“><option>sichuan</option><option>chongqing</option><option>guangzhou</option><option>shanghai</option><option>beijing</option><option>tianjin</option></datalist><input type=”text“ list=”arealist“>video：動畫媒體radio：音頻autocomplete：是否關(guān)閉自動提示（off |on）html5新標(biāo)簽autofocus: 自動獲得焦點(diǎn)required: 表示控件必須輸入內(nèi)容controls : 播放控制條autoplay ：自動播放loop ：循環(huán)播放preload ：預(yù)加載，如果設(shè)置了autoplay，就可以不用設(shè)置preloadCSS知識點(diǎn)總結(jié)內(nèi)聯(lián)：直接在標(biāo)簽的style屬性上編寫樣式<input type=”text“ style=”color: blue;background-color: #eeeeff;“>樣式定義方式樣式塊：在style標(biāo)簽中編寫樣式塊，并通過一定規(guī)則（選擇器）應(yīng)用到對應(yīng)的那些標(biāo)簽上(通常寫在head中)<style>span {color: green;background-color: #eeffee;}</style>外部樣式文件：將樣式塊編寫在外部的css文件中(不用寫style標(biāo)簽)* 在需要使用樣式的頁面通過link標(biāo)簽引入樣式文件(通常寫在head中)<link href=”hehe.css“ rel=”stylesheet“>id選擇器#xxx 針對id為xxx的標(biāo)簽類選擇器.xxx 針對class屬性為xxx的標(biāo)簽標(biāo)簽選擇xxx 針對標(biāo)簽名為xxx的標(biāo)簽*選擇器選擇所有元素選擇器后代元素關(guān)系選擇selector1 selector2 {...} 針對selector1下的所有的selector2子元素關(guān)系選擇selector1 > selector2 {...} 只針對selector1的selector2子元素(如果有后代selector2元素則不會應(yīng)用)緊鄰兄弟關(guān)系選擇selector1 + selector2 {...} 只針對緊接在selector1后的selector2元素所有隨后的兄弟關(guān)系selector1 ~ selector2 {...} 針對selector1后的所有的selector2兄弟元素color：字體顏色font-size：字體大小font-family：字體樣式字體font-weight: bolder(加粗)| normal(不加粗)font-style: 設(shè)置字體傾斜(normal | italic | oblique)*italic和oblique實(shí)際顯示效果幾乎一致font-variant: 設(shè)置字體顯示為小型大寫字母text-align: 水平對齊方式(left | center | right)常用屬性vertical-align: 垂直對齊方式(top | middle |bottom)line-height: 設(shè)置行高(通常用于設(shè)置文本居中)white-space: nowrap 不換行, pre 當(dāng)做pre標(biāo)簽border: 邊框(1px solidred)文本width: 寬度underline 下劃線height: 高度overline 上劃線text-decoration: 文本裝飾line-through 貫穿線(刪除線)blink 閃爍none 無dtext-shadow: 3px 3px 5px red;第一個(gè)參數(shù): 陰影水平位置(x軸上的偏移量)text-shadow: 文本陰影第二個(gè)參數(shù): 陰影垂直位置(y軸上的偏移量)第三個(gè)參數(shù): 模糊程度第四個(gè)參數(shù): 陰影顏色padding：內(nèi)邊距padding: xxpx;padding: xxpx xxpx;padding: xxpx xxpx xxpx;padding: xxpx xxpx xxpx xxpx;padding: auto;padding: xxpx auto;padding-toppadding-leftpadding-rightpadding-bottom盒子模型margin：外邊距margin: xxpx;margin: xxpx xxpx;margin: xxpx xxpx xxpx;margin: xxpx xxpx xxpx xxpx;margin: auto;margin: xxpx auto;margin-topmargin-leftmargin-rightmargin-bottomborder：邊框color：顏色；width：寬度；style：outset|inset|solid|double|dottedborder-radius: 10px;/* 同時(shí)設(shè)置4個(gè)角*/background-color: 背景顏色background-image: 背景圖片background-repeat: no-repeat | repeat-x |repeat-y | repeat背景background-position: xxxpx xxpx | xx%xx%;(可以為負(fù)數(shù))background-size: xxxpx xxpx | xx% xx% |cover | contain;(不能為負(fù)數(shù))cover: 拉伸,可以超出contain: 拉伸不能超出background-attachment: scroll(隨著內(nèi)容一起滾動)| fixed(不滾動)hidden：隱藏scroll：滾動overflow：當(dāng)內(nèi)容溢出時(shí)的處理方式visible：直接顯示auto：如果溢出就滾動，否則不顯示滾動條visible 顯示visibility：設(shè)置元素是否顯示hidden 隱藏，保留占位none：隱藏，不保留占位block：設(shè)置為塊級元素display：設(shè)置元素是否顯示inline：設(shè)置為行級元素布局inline-block：設(shè)置為行內(nèi)塊元素left 左浮動float: 浮動right 右浮動none 不浮動left 不允許左邊有浮動clear: 清除浮動right 不允許右邊有浮動both 不允許兩邊有浮動ul或ol 自帶樣式：列表樣式list-style-type: 列表項(xiàng)的樣式margin: 16px 0px;padding: 0px 0px 0px40px;absolute：如果有父元素被定位按照父元素的原點(diǎn)進(jìn)行定位，否則按照瀏覽器原點(diǎn)進(jìn)行定位position定位z-index: 設(shè)置z軸的值，越大越在最前relative：相對定位參照元素本身的位置fixed：固定位置，不會滾動link 超鏈接默認(rèn)樣式hover 鼠標(biāo)懸停樣式active 鼠標(biāo)點(diǎn)擊樣式visited 訪問之后的樣式（主要控制顏色）偽類focus 獲得輸入焦點(diǎn)的樣式first-child 第一個(gè)元素last-child 最后一個(gè)元素:not 不包含指定的選擇器:noly-child 是父元素的唯一子元素cursor 鼠標(biāo)樣式其他樣式box-shadow 陰影translate:平移rotate：旋轉(zhuǎn)transform：變換scale：縮放skew：扭曲matrix：以變換矩陣變換第一個(gè)值表示需要過渡的樣式屬性transition 過渡transition:transform2s,background-color.5s;第二個(gè)值表示整個(gè)過渡過程需要的時(shí)間第三個(gè)值表示過渡時(shí)的貝塞爾曲線第四個(gè)值表示延遲多久才開始過渡animation 動畫@keyfarmes 關(guān)鍵幀用于定義動畫的細(xì)節(jié)（每一幀如何顯示）@keyframes myanimation {0% { background-color: #cfc;}30% {background-color: #ccf;border-radius: 50px;}80% {width: 300px;background-color: #fcc;}100% {width: 300px;height: 300px;background-color: #000;}}@-o-keyframes myanimation {}@-ms-keyframes myanimation {}@-moz-keyframes myanimation {}@-webkit-keyframes myanimation {}需要顯示動畫的地方通過animation屬性來使用聲明的關(guān)鍵幀.ac:active {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 完全不透明瀏覽器兼容前綴-webkit-chrome，safari, opera-o-opera-moz-firefox-ms-ie（ie9以上）JavaScriptjavascript代碼必須包含在標(biāo)簽中也可以書寫到外部的.js文件中,通過來引入script標(biāo)簽只能同時(shí)做一件事情.如果既有src屬性也包含代碼則只會執(zhí)行外部文件的代碼通過alert來彈出提示框通過document.write來輸入文本到頁面上(可以輸入標(biāo)簽)Number: 數(shù)值型整數(shù)和小數(shù)Boolean: 布爾型(true |false)String: 字符串字符串必須被”“或''包含必須對稱如果字符串中包含引號可以單引號中包含雙引號或者是雙引號中包含單引號也可以使用'來表示一個(gè)單引號”來表示一個(gè)雙引號n 表示換行數(shù)據(jù)類型t 表示制表符表示書寫方式NaN: Not A Number 當(dāng)使用非數(shù)字來進(jìn)行運(yùn)算時(shí)的值undefied: 未定義null: 空值substring 截取子串, 從start到end-1處,如果沒指定end則取到最后一個(gè)字符toUpperCase 將所有字符變成大寫toLowerCase 將所有字符變成小寫indexOf 查找子串首次出現(xiàn)的位置, 如果找不到則返回-1字符串處理lastIndexOf 查找子串最后一次出現(xiàn)的位置, 如果找不到則返回-1charAt 取指定位置上的字符slice 也是取子串,效果和substring一樣可以用-1,-2,-3...從末尾開始計(jì)數(shù)split 將字符串按照指定的字符進(jìn)行拆分成為數(shù)組獲取當(dāng)前時(shí)間var now = new Date()獲取指定時(shí)間的日期對象var date = new Date(yyyy,MM,dd,HH,mm,ss)設(shè)置指定時(shí)間(將時(shí)間對象設(shè)置為一個(gè)指定時(shí)間)now.setFullYear(yyyy,MM,dd,HH,mm,ss)now.setMonth日期Datenow.setDatenow.setHours...獲取指定時(shí)間信息now.getFullYear()// 年只能取出年份,如: 2015now.getMonth // 月0-11月now.getDate // 日now.getDay // 星期0-6(0表示星期天)now.getHours // 時(shí)24小時(shí)制now.getMinutes // 分now.getSeconds // 秒now.getMilliseconds// 毫秒通過new Array()來創(chuàng)建數(shù)組var names = new Array();var names = new Array(“小王”, “大王”, “炸彈”);// 創(chuàng)建時(shí)給數(shù)組設(shè)置默認(rèn)值//用json格式表示數(shù)組var names = [];var names = [“小王”, “大王”, “炸彈”];數(shù)組Array可以通過length來設(shè)置或獲取數(shù)組的長度push : 往數(shù)組末尾添加元素pop: 刪除并返回?cái)?shù)組的最后一個(gè)元素unshift: 往數(shù)組的開頭添加元素shift: 刪除并返回?cái)?shù)組的第一個(gè)元素reverse: 顛倒數(shù)組順序sort: 按“字符串”的自然排序規(guī)則進(jìn)行升序splice: 刪除指定位置處的指定個(gè)數(shù)元素并將第三個(gè)參數(shù)之后的參數(shù)添加到被刪除位置(設(shè)置第二個(gè)參數(shù)為0則實(shí)現(xiàn)只添加不刪除, 之傳入兩個(gè)參數(shù)實(shí)現(xiàn)只刪除不添加)slice: 獲取start到end處的子數(shù)組join: 將數(shù)組元素以指定分隔符進(jìn)行連接成為字符串function xxx(....){聲明函數(shù)....}var xxx = function(...){...函數(shù)變量}var ooo = xxx;ooo();函數(shù)function fn(fx){fx();將函數(shù)作為參數(shù)}fn(function(){...});（function(...){立即執(zhí)行函數(shù)....})(...);getElementById 根據(jù)id獲取唯一的元素var xx = document.getElementById(“xx”);DOM(Document Object Model)文檔對象模型獲取元素getElementsByTagName 根據(jù)標(biāo)簽名獲取元素?cái)?shù)組onclick 鼠標(biāo)點(diǎn)擊事件getElementsByClassName 根據(jù)類獲取元素?cái)?shù)組(如果元素被改變了class值將會從數(shù)組中刪除)onmouseover 鼠標(biāo)進(jìn)入事件onmouseout 鼠標(biāo)離開事件onmousemove 鼠標(biāo)被移動onmousedown 鼠標(biāo)按鈕被按下事件機(jī)制onmouseup 鼠標(biāo)按鈕被松開onkeydown 某個(gè)鍵盤按鍵被按下onkeyup某個(gè)鍵盤按鍵被松開onload 一張頁面或圖像被完成加載onchange 域的內(nèi)容被改變onfocus 元素獲得焦點(diǎn)onblur 元素失去焦點(diǎn)setTimeout: 延遲執(zhí)行(只會執(zhí)行一次)var xx = setTimeout(xxx, 1000);setTimeout(“fn();”, 3000);BOM(Browser Object Model)window清除使用clearTimeout(xx);setInterval: 定時(shí)執(zhí)行(間隔指定時(shí)間循環(huán)執(zhí)行)xx.offsetLeft獲取元素的位置和尺寸(只讀)xx.offsetTopxx.offsetWidthxx.offsetHeightvar xx = setInterval(xxx,1000);清除使用clearInterval(xx);[] 表示[]中的字符任意取一個(gè)在[] 中的^ 表示非不包含該字符()表示將多個(gè)表達(dá)式合并為一個(gè)表達(dá)式在()中的|表示將兩個(gè)匹配條件進(jìn)行邏輯“或”（Or）運(yùn)算。+ 前一個(gè)表達(dá)式出現(xiàn)至少一次1~n {1,}* 前一個(gè)表達(dá)式出現(xiàn)任意次0~n {0,}? 前一個(gè)表達(dá)式出現(xiàn)0~1次{0,1}{n} 前一個(gè)表達(dá)式出現(xiàn)n次{n,} 前一個(gè)表達(dá)式出現(xiàn)至少n次{n,m} 前一個(gè)表達(dá)式出現(xiàn)n~m次.任意字符(不包含rn)正則表達(dá)式^ 匹配字符串的開頭$ 匹配字符串的結(jié)尾w 表示一個(gè)任意的單詞字符包括_ [a-zA-Z0-9_] * 不包含破折號W 對w取反(不包含單詞字符)[^a-zA-Z0-9_]d 表示一個(gè)數(shù)字字符[0-9]D 對d取反[^0-9]s 表示一個(gè)任意空白字符空格中文狀態(tài)的空格制表符全角空格S 對s取反非空格n 換行符b 單詞邊界B 不是單詞邊界(對b取反)eval執(zhí)行字符串形式的代碼。for(var i in array){var item = array[i];}for(var key in obj){var value = obj[key];}迭代數(shù)組迭代出的值為數(shù)組的下標(biāo)for...in迭代對象迭代出的值為對象的屬性名其他with設(shè)置以某個(gè)對象為代碼塊作用域?qū)ο?/p>delete attribute刪除屬性isNaN如果被判斷值不是一個(gè)數(shù)字則返回true，否則為false<h2><a name="2" >第二篇：WEB前端開發(fā)經(jīng)驗(yàn)總結(jié)</a></h2>ASP.NET前端開發(fā)經(jīng)驗(yàn)總結(jié)通過此次大作業(yè)的設(shè)計(jì)到完成，我負(fù)責(zé)的是web前端的開發(fā)，經(jīng)過此次作業(yè)和結(jié)合W3C上的自學(xué)，我漸漸有了一些對前端開發(fā)的小小經(jīng)驗(yàn)（僅為個(gè)人意見）。WEB標(biāo)準(zhǔn)是什么？說是WEB標(biāo)準(zhǔn)，不過我這里主要是對HTML5 和 CSS3.0的一些經(jīng)驗(yàn)總結(jié)。因?yàn)閃EB含蓋的內(nèi)容實(shí)在是太多了，“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，這里要說明下，這樣說其實(shí)是不正確的。DIV+CSS準(zhǔn)確的說法（個(gè)人的理解）應(yīng)該是：采用W3C推薦的WEB標(biāo)準(zhǔn)中的HTML5結(jié)合CSS3.0樣式表制作頁面的方法，DIV應(yīng)該指的是HTML標(biāo)簽，而CSS顯示是指的CSS樣式表了。采用WEB標(biāo)準(zhǔn)開發(fā)的好處那么W3C為什么會推薦這樣的頁面制作方法呢？下面我們就簡單的看看采用WEB標(biāo)準(zhǔn)開發(fā)（個(gè)人理解的）相對以前TABLE布局的優(yōu)勢有哪些？1、節(jié)約運(yùn)營成本看看我們的WEB標(biāo)準(zhǔn)制作方法是如何做到的？采用WEB標(biāo)準(zhǔn)制作，我們可以做到表現(xiàn)很形式的分離，我們用XHTML來表現(xiàn)（數(shù)據(jù)），用CSS來控制（頁面元素呈現(xiàn)的）形式。寫的好的頁面，XHTML代碼中基本上都是用戶要看的數(shù)據(jù)，還其他修飾性的東西，全部由我們的CSS來控制。這樣一來我們的（XHTML）頁面的體積就大大減小了，這樣你在帶寬上的費(fèi)用就會大家降低了，這個(gè)怎么降低的，你可以想象一下，YAHOO的首頁小1K，100W個(gè)人一起訪問，那么帶寬節(jié)約了多少？而且可以更充分的利用帶寬。而我們的CSS控制了，所有的頁面元素的樣式，現(xiàn)在想改網(wǎng)站的整體風(fēng)格，你只需要花幾分鐘修改一下一個(gè)CSS文件，就可以輕松搞定了。維護(hù)的成本也下來了，省了不少錢了吧？還有，你開這個(gè)頁面的速度會快很多啊，一個(gè)讓你等半分鐘的頁面，除非里面的信息對你很有用，不然我們大家基本都沒有太多的時(shí)間去用來等待的。2、對用戶友好更友好，且有機(jī)會獲得更多的用戶現(xiàn)在來說說用戶友好。首先我想把我們的用戶來分下類。第一類：普通用戶（每個(gè)訪問我們網(wǎng)站的人）；第二類：搜索引擎；采用WEB標(biāo)準(zhǔn)開發(fā)的頁面，結(jié)構(gòu)清晰，頁面體積小，瀏覽器兼容性好。普通用戶訪問的時(shí)候，頁面打開速度快，而且不管用戶使用那種瀏覽器，都能夠正常訪問（顯示）頁面，且頁面的結(jié)構(gòu)清晰，要找的數(shù)據(jù)可以很方便的瀏覽到。而對搜索引擎來說，一個(gè)好的采用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)簽）等，它可以很容易的分析出來。而一個(gè)SEO好的站點(diǎn)，大家都知道，被搜索引擎收錄的機(jī)會更多，這個(gè)也意味著您的網(wǎng)站會被更多的普通用戶訪問到，給你的站點(diǎn)帶來更多的用戶。一個(gè)能幫我們省下大筆費(fèi)用，提高工作效率。同時(shí)又能夠提高頁面瀏覽速度，對用戶友好，甚至能夠不花錢宣傳，就能給你帶來更多用戶的技術(shù)。你說你會不會去使用它？這個(gè)也正式我們的W3C推薦使用WEB標(biāo)準(zhǔn)開放網(wǎng)站的原因啊。而這個(gè)技術(shù)也得到了我們廣大用戶的認(rèn)可，所以現(xiàn)在需要學(xué)習(xí)WEB標(biāo)準(zhǔn)啊。合理的布局前面我提到了一些知識點(diǎn)――“結(jié)構(gòu)清晰、SEO優(yōu)化、頁面體積小、HTML代碼中基本上都是用戶要看的數(shù)據(jù)”。這些東西，都是我做了合理布局的結(jié)果。而且我個(gè)人覺得，我們采用WEB標(biāo)準(zhǔn)制作的一切都是從這個(gè)知識點(diǎn)開始的，所以我這里就先來說這個(gè)話題。也許有人會問，怎樣的一個(gè)頁面，才算是合理的布局的呢？這個(gè)問題問題問得好，也是我們大家剛開始學(xué)用WEB標(biāo)準(zhǔn)的問得最多的問題之一，我也曾經(jīng)常被這個(gè)問題所困擾，這里就說說我對合理布局的一些理解。在開始講合理布局的頁面要達(dá)到的要素前，我們還是用個(gè)實(shí)例來講解會更直觀些。先來看看這個(gè)圖片：不錯(cuò)，這個(gè)是一個(gè)文章詳細(xì)頁，沒有左右兩欄布局，不過這里我重點(diǎn)要講的是合理的布局。這是此次實(shí)驗(yàn)中customer（前端的一項(xiàng)）部分的完整代碼：<%@ 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><title><%=Titlep %></title><meta http-equiv=“Content-Type” content=“text/html;charset=gb2312” /> <meta content=“<%= Descriptionp%>” name=“description”/> <meta content=“<%=Keywordsp %>” name=“keywords” /><link href=“Images/css.css” rel=“stylesheet” type=“text/css” /> </head><body style=“text-align: center”> <form id=form1 runat=server><table border=“0” align=“center” cellpadding=“0” cellspacing=“0” style=“width: 778px”><tr><td style=“width: 100px”><uc1:Top ID=“Top1” runat=“server” /></td></tr> </table><table border=“0” align=“center” cellpadding=“0” cellspacing=“0” style=“width: 778px;background-color: #ffffff;”><tr><td style=“height: 395px”><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”><tr><td><div align=“l(fā)eft”><uc2:Left ID=“Left1” runat=“server” /><h2><a name="3" >第三篇：WEB前端開發(fā)經(jīng)驗(yàn)總結(jié)</a></h2>WEB前端開發(fā)經(jīng)驗(yàn)總結(jié)發(fā)布時(shí)間：2009-04-20 09:05:33來源：作者：shengman點(diǎn)擊：21015這里跟大家談?wù)剛€(gè)人對WEB前端開發(fā)的一些經(jīng)驗(yàn)（當(dāng)然都是個(gè)人的一些理解，有什么地方說的欠妥或不對的地方還請包含和指正），這里我就從WEB標(biāo)準(zhǔn)開始吧。WEB標(biāo)準(zhǔn)是什么？說是WEB標(biāo)準(zhǔn)，不過我這里主要是對XHTML1.1 和 CSS2.1的一些經(jīng)驗(yàn)總結(jié)。因?yàn)閃EB含蓋的內(nèi)容實(shí)在是太多了，“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，這里要說明下，這樣說其實(shí)是不正確的。DIV+CSS準(zhǔn)確的說法（個(gè)人的理解）應(yīng)該是：采用W3C推薦的WEB標(biāo)準(zhǔn)中的XHTML1.1結(jié)合CSS2.0樣式表制作頁面的方法，DIV應(yīng)該指的是XHTML標(biāo)簽，而CSS顯示是指的CSS樣式表了。采用WEB標(biāo)準(zhǔn)開發(fā)的好處那么W3C為什么會推薦這樣的頁面制作方法呢？下面我們就簡單的看看采用WEB標(biāo)準(zhǔn)開發(fā)（個(gè)人理解的）相對以前TABLE布局的優(yōu)勢有哪些？1、節(jié)約運(yùn)營成本看看我們的WEB標(biāo)準(zhǔn)制作方法是如何做到的？采用WEB標(biāo)準(zhǔn)制作，我們可以做到表現(xiàn)很形式的分離，我們用XHTML來表現(xiàn)（數(shù)據(jù)），用CSS來控制（頁面元素呈現(xiàn)的）形式。寫的好的頁面，XHTML代碼中基本上都是用戶要看的數(shù)據(jù)，還其他修飾性的東西，全部由我們的CSS來控制。這樣一來我們的（XHTML）頁面的體積就大大減小了，這樣你在帶寬上的費(fèi)用就會大家降低了，這個(gè)怎么降低的，你可以想象一下，YAHOO的首頁小1K，100W個(gè)人一起訪問，那么帶寬節(jié)約了多少？而且可以更充分的利用帶寬。而我們的CSS控制了，所有的頁面元素的樣式，現(xiàn)在想改網(wǎng)站的整體風(fēng)格，你只需要花幾分鐘修改一下一個(gè)CSS文件，就可以輕松搞定了。維護(hù)的成本也下來了，省了不少錢了吧？還有，你開這個(gè)頁面的速度會快很多啊，一個(gè)讓你等半分鐘的頁面，除非里面的信息對你很有用，不然我們大家基本都沒有太多的時(shí)間去用來等待的。2、對用戶友好更友好，且有機(jī)會獲得更多的用戶現(xiàn)在來說說用戶友好。首先我想把我們的用戶來分下類。第一類：普通用戶（每個(gè)訪問我們網(wǎng)站的人）；第二類：搜索引擎；采用WEB標(biāo)準(zhǔn)開發(fā)的頁面，結(jié)構(gòu)清晰，頁面體積小，瀏覽器兼容性好。普通用戶訪問的時(shí)候，頁面打開速度快，而且不管用戶使用那種瀏覽器，都能夠正常訪問（顯示）頁面，且頁面的結(jié)構(gòu)清晰，要找的數(shù)據(jù)可以很方便的瀏覽到。而對搜索引擎來說，一個(gè)好的采用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)簽）等，它可以很容易的分析出來。而一個(gè)SEO好的站點(diǎn)，大家都知道，被搜索引擎收錄的機(jī)會更多，這個(gè)也意味著您的網(wǎng)站會被更多的普通用戶訪問到，給你的站點(diǎn)帶來更多的用戶。一個(gè)能幫我們省下大筆費(fèi)用，提高工作效率。同時(shí)又能夠提高頁面瀏覽速度，對用戶友好，甚至能夠不花錢宣傳，就能給你帶來更多用戶的技術(shù)。你說你會不會去使用它？這個(gè)也正式我們的W3C推薦使用WEB標(biāo)準(zhǔn)開放網(wǎng)站的原因啊。而這個(gè)技術(shù)也得到了我們廣大用戶的認(rèn)可，所以您現(xiàn)在需要學(xué)習(xí)WEB標(biāo)準(zhǔn)啊。溫習(xí)完了基礎(chǔ)課程，現(xiàn)在正式開始講XHTML和CSS的技巧了。合理的布局有朋友會開始問了，怎么一開始就開始講合理的布局了呢?前面我們提到了一些知識點(diǎn)――“結(jié)構(gòu)清晰、SEO優(yōu)化、頁面體積小、XHTML代碼中基本上都是用戶要看的數(shù)據(jù)”。這些東西，都是我們做了合理布局的結(jié)果。而且我個(gè)人覺得，我們采用WEB標(biāo)準(zhǔn)制作的一切都是從這個(gè)知識點(diǎn)開始的，所以我這里就先來說這個(gè)話題。那么大家又會開始問，怎樣的一個(gè)頁面，才算是合理的布局的呢？這個(gè)問題問題問得好，也是我們大家剛開始學(xué)用WEB標(biāo)準(zhǔn)的問得最多的問題之一，我也曾經(jīng)常被這個(gè)問題所困擾，這里就說說我對合理布局的一些理解。在開始講合理布局的頁面要達(dá)到的要素前，我們還是用個(gè)實(shí)例來講解會更直觀些。先來看看這個(gè)圖片：不錯(cuò)，這個(gè)是一個(gè)文章詳細(xì)頁，沒有左右兩欄布局，不過這里我重點(diǎn)要講的是合理的布局，在稍后的文章中我會詳細(xì)的介紹浮動元素。好，回到剛才的話題，大家看到了這個(gè)頁面了。我這里先把代碼寫給大家看看（省略了部分代碼）：<!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ā)布時(shí)間：2008年4月28日</div>代碼篇之前整理發(fā)表了《XMLHTTPRequest的屬性和方法簡介》</a>,它Ajax要使用的核心的技術(shù)之一，現(xiàn)在就來實(shí)際運(yùn)用它。這個(gè)Ajax標(biāo)簽導(dǎo)航，是我很久前就寫的一個(gè)腳本，很實(shí)用的（還被很多網(wǎng)站收錄了哦），現(xiàn)在拿它來做實(shí)例講解吧！當(dāng)然個(gè)人能力有限，有什么不對的地方還請多包含!效果大家看到了，核心功能有： 1、將當(dāng)前選中標(biāo)簽以特殊的樣式顯示 2、將異步加載的頁面信息顯示到指定的DOM節(jié)點(diǎn)中我們來看看處理腳本的代碼吧：<div id="rbwfuud" class=“code-title”>程序代碼：ajaxtab.js</div><div id="vterkm6" class=“js code” name=“code” id=“js-code”><!-- // 判斷是否支持ActiveX var useActiveX=(typeof ActiveXObject!= “undefined”); // 判斷是否支持DOM var useDom=document.implementation && document.implementation.createDocument; // 判斷是否支持XMLHttpRequest對象 var useXmlHttp=(typeof XMLHttpRequest!= “undefined”); // XMLHttpRequest對象版本 var ARR_XMLHTTP_VERS = [“MSXML2.XmlHttp.6.0”,“MSXML2.XmlHttp.3.0”]; // DOM對象版本 var ARR_DOM_VERS = [“MSXML2.DOMDocument.6.0”,“MSXML2.DOMDocument.3.0”]; /* ============= * 函數(shù)名稱：$(i) * 參數(shù)說明：i超鏈接 -標(biāo)簽間的分割線 我羅列的這些東西，相信大家開始看出了些頭緒了，呵呵，不過別急！在我們看處理的腳本之前，先讓我們來看看導(dǎo)航標(biāo)簽的樣式，主要是看看我們對分割線的處理(一點(diǎn)CSS處理的技巧)。本來想偷個(gè)懶，讓大家看我上邊說的那篇文章，想想也就是Ctrl+C&Ctrl+V,都貼出來吧！呵呵??！不過還沒有完，最后要說的就是innerHTML這個(gè)特性，這里我們還要感謝微軟啊，innerHTML就是它的專利，我們就是用它來改變指定DOM內(nèi)的HTML字符串的，而不用刷新頁面。詳細(xì)的信息大家還是google一下吧，我也要休息下??！喝口茶先！^-^！以上講了這么多，我們最后來看看，我們這個(gè)ajax標(biāo)簽導(dǎo)航都用到了那些技術(shù)吧：<ol><li>XHTML</li><li>CSS</li><li>Javascript</li><li>DOM</li><li>XMLHttpRequest對象</li><li>innerHTML</li></ol>還有XML，我們這個(gè)例子沒有涉及到。東西雖小，包含的（web前端開發(fā)）知識可是都用到了啊，我把我會的點(diǎn)東西都端出來了（要失業(yè)了），呵呵！當(dāng)然我很喜歡跟大家多交流，以后有時(shí)間，我們在來談?wù)凜SS的HACKS技巧，Javascript DOM編程等等的，今天就收工了，謝謝捧場先??！</div>Copyright ©2007-2008 <ahref=“domain.comhttp://”>domain.com</a>, All rights reserved.Powered By: <a href=“domainmailto:haixiao_yao@yahoo.com.cn”>domain</a></body></html>看出來什么沒有？（代碼是很多）可能大家已經(jīng)發(fā)現(xiàn)，整個(gè)頁面里基本上都是用戶要看的數(shù)據(jù)，其中只包含了很少（必要）的布局(XHTML)標(biāo)簽（請?jiān)试S我這么說）。整個(gè)頁面基本都是由最基礎(chǔ)的h1~h6、p、ul、ol、li、form、div標(biāo)簽來實(shí)現(xiàn)的。說到這里就要講到我在前面提到的“結(jié)構(gòu)清晰、SEO優(yōu)化、頁面體積小、XHTML代碼中基本上都是用戶要看的數(shù)據(jù)”，看看我的這個(gè)例子做到了沒有？結(jié)構(gòu)清晰--也就是我們常說的，XHTML標(biāo)簽要結(jié)構(gòu)化（語意化）。什么叫結(jié)構(gòu)化？由于個(gè)人認(rèn)為這個(gè)知識點(diǎn)是十分重要的，所以請?jiān)试S我在這里多羅嗦幾句，我們采用WEB標(biāo)準(zhǔn)的方法制作頁面的優(yōu)勢就體現(xiàn)在頁面結(jié)構(gòu)清晰。我們以前用table布局的時(shí)候，我們的表現(xiàn)（數(shù)據(jù)）和形式（布局樣式）是混在一起的，有很多冗余的數(shù)據(jù)混雜在一起，而大家再看看我上面給大家展示的代碼，很明顯，結(jié)構(gòu)十分清晰。說了半天，還是沒有說什么是結(jié)構(gòu)化，什么才是結(jié)構(gòu)清晰?。坎灰?。還記得我剛才提到的那幾個(gè)標(biāo)簽嗎？h1~h6--如果你要顯示的數(shù)據(jù)是作為標(biāo)題顯示的時(shí)候，就用這些標(biāo)簽，因?yàn)檫@個(gè)標(biāo)簽的意思就是說，這個(gè)是一個(gè)標(biāo)題，不僅我們的用戶很容易理解h-head的英文字母縮寫，我們的另外一個(gè)用戶搜索引擎也可以很容易理解它。呵呵，看到了吧，一個(gè)充分結(jié)構(gòu)化的頁面，對用戶是十分友好的。p--Paragraph（段落）ul--unorglized list(無序的列表)ol--orglized list(有序的列表)li--list item(列表項(xiàng))form--表單div--division(區(qū)域)我這么一寫，大家估計(jì)開始明白了，原來XHTML標(biāo)簽是有著自己的意義的（至于其他的標(biāo)簽的語意義，大家可以自己到W3C看看它的解釋，也可以查看語義化你的HTML標(biāo)簽和屬性），所以我們講要語意化的意思，就是用合理的標(biāo)簽來顯示數(shù)據(jù)，比如前面提到的，是標(biāo)題，就應(yīng)該用h1~h6標(biāo)簽，如果是一個(gè)段落的介紹文字，那么就應(yīng)該使用p標(biāo)簽，如果是顯示的一個(gè)沒有順序的列表，就應(yīng)該用ul標(biāo)簽，如此...所以看這個(gè)例子里Ajax標(biāo)簽導(dǎo)航實(shí)例詳解這么寫就是很合理的，h2標(biāo)簽就說明這里是個(gè)標(biāo)題。而這么寫：復(fù)制內(nèi)容到剪貼板代碼:.title{font-size:18px;...}<div id="lrmta8n" class=“title”>Ajax標(biāo)簽導(dǎo)航實(shí)例詳解</div>雖然你用了strong來強(qiáng)調(diào)說明這部分文字，但是還是沒有h2標(biāo)簽來的直接明了。還有這么寫<div id="ovh731r" class=“ariticle-title”>Ajax標(biāo)簽導(dǎo)航實(shí)例詳解</div>也不是我們推薦的，可以不用嵌套層的地方，我們盡量不要去過多的嵌套層，減少嵌套會讓我們的瀏覽器解析起來會更容易，速度更快。所我們使用WEB標(biāo)準(zhǔn)開發(fā)頁面，絕對不是單純的把以前的table換成DIV就OK了。而采用標(biāo)準(zhǔn)制作頁面，也不意味著我們就不使用table。只要把握我剛才說的原則，使用合理的標(biāo)簽顯示相應(yīng)特征的數(shù)據(jù)。其實(shí)我們的table標(biāo)簽是一個(gè)很好的用來顯示二維數(shù)據(jù)的標(biāo)簽，而table標(biāo)簽也確實(shí)是設(shè)計(jì)出來用來顯示數(shù)據(jù)的，而不是用來布局的，只是我們當(dāng)時(shí)的設(shè)計(jì)師們都用table標(biāo)簽來布局了。<h2><a name="4" >第四篇：Web前端開發(fā)學(xué)習(xí)筆記分享</a></h2>004km.cn免費(fèi)試學(xué)/ 一對一輔導(dǎo)/項(xiàng)目實(shí)訓(xùn)/就業(yè)保障Web前端開發(fā)學(xué)習(xí)筆記對于Web前端初學(xué)者而言，前人的學(xué)習(xí)經(jīng)驗(yàn)及總結(jié)，能讓自己的學(xué)習(xí)事半功倍；我在泛藝學(xué)苑學(xué)習(xí)Web前端開發(fā)已經(jīng)有一段日子了，課程內(nèi)容個(gè)人覺得很全面、專業(yè)；下面是我通過這段時(shí)間學(xué)習(xí)，總結(jié)的一些Web前端開發(fā)學(xué)習(xí)筆記【前端開發(fā)需要學(xué)哪些？>>】，一是為了給自己加深印象，二是希望能幫助其他Web前端學(xué)習(xí)者們；以后內(nèi)容會持續(xù)更新，也歡迎大家進(jìn)行補(bǔ)充?！精@取全套學(xué)習(xí)資料>>】HTML篇總結(jié)非可視化標(biāo)簽：head meta style scrpit...可視化標(biāo)簽：img div span a ul li… 只有可視化標(biāo)簽，才能用css改變它單標(biāo)簽：meta link base img input br hr 雙標(biāo)簽：html head body div a p span..ul li ol dl ….常用可視化標(biāo)簽 div：一般用它來布局 a 超鏈接標(biāo)簽href*屬性：設(shè)置跳轉(zhuǎn)的網(wǎng)頁地址 target屬性：設(shè)置跳轉(zhuǎn)的目標(biāo)結(jié)論：凡事頁面可以點(diǎn)擊跳轉(zhuǎn)或者表單提交的文字，都用a標(biāo)簽 img：src*屬性用來設(shè)置圖片的url數(shù)據(jù)、alt提供給搜索引擎搜索的 ul li：列表；結(jié)論：只要將來設(shè)計(jì)頁面中有固定樣式的列表，就用ul和li table caption tr td(th)：慢慢已經(jīng)被淘汰了被ul li代替如果是合并豎排的就是合并行（rowspan）004km.cn免費(fèi)試學(xué)/ 一對一輔導(dǎo)/項(xiàng)目實(shí)訓(xùn)/就業(yè)保障如果是合并橫排的就是合并列（colspan）HTML部分導(dǎo)圖總結(jié) 標(biāo)簽集合004km.cn免費(fèi)試學(xué)/ 一對一輔導(dǎo)/項(xiàng)目實(shí)訓(xùn)/就業(yè)保障004km.cn免費(fèi)試學(xué)/ 一對一輔導(dǎo)/項(xiàng)目實(shí)訓(xùn)/就業(yè)保障以上即為我在泛藝學(xué)苑這一階段學(xué)習(xí)關(guān)于Web前端開發(fā)的總結(jié)以及筆記，接下來將要學(xué)習(xí)CSS；后續(xù)我會將Web前端開發(fā)學(xué)習(xí)總結(jié)陸續(xù)進(jìn)行更新。泛藝學(xué)苑采用的在線教育，對于身處三線城市的我而言提供了很大的便利，平時(shí)有經(jīng)驗(yàn)豐富的老師直播授課，課后有專業(yè)的老師進(jìn)行一對一輔導(dǎo)，還給我提供了大量的學(xué)習(xí)資料，雖然現(xiàn)在才剛開始學(xué)習(xí)，但是我有信心學(xué)完后，能夠找到一份滿意的工作。情>>】【了解課程詳<h2><a name="5" >第五篇：web項(xiàng)目前端開發(fā)經(jīng)驗(yàn)總結(jié)</a></h2>web項(xiàng)目前端開發(fā)經(jīng)驗(yàn)總結(jié)最近這一個(gè)月完成了自己的第一個(gè)java web項(xiàng)目，是給某雜志社做的在線投稿系統(tǒng)，雖然進(jìn)度很慢，但是中間確實(shí)學(xué)到了不少東西，深刻體會到了自己看幾個(gè)月書都不如做一個(gè)項(xiàng)目來的實(shí)在。這個(gè)項(xiàng)目自己主要負(fù)責(zé)的是JSP頁面、JS腳本、CSS樣式表的編寫，雖然主要做的是前端，但是在設(shè)計(jì)前端后臺交互功能時(shí)，對MVC架構(gòu)和數(shù)據(jù)庫又多了一分了解，這一個(gè)月的時(shí)間，自己在技術(shù)上也確實(shí)成長了不少。下面分成幾塊總結(jié)一下自己的這個(gè)項(xiàng)目中的心得吧：1.項(xiàng)目開發(fā)流程：從確認(rèn)需求開始，到原型設(shè)計(jì)，再到原型測試，這些都沒什么說的了，主要是剛開始開發(fā)前端JSP頁面時(shí)，自己走了很多彎路，想到有什么頁面就寫什么頁面，GET和POST的路徑也是隨心所欲，想到什么名字就起什么名字，結(jié)果發(fā)現(xiàn)這樣做嚴(yán)重影響了項(xiàng)目開發(fā)的進(jìn)度，后來經(jīng)過主管的提點(diǎn)后，我幡然醒悟，其實(shí)，面向?qū)ο蟮乃枷刖拓灤┰谡麄€(gè)項(xiàng)目當(dāng)中，在前面的原型設(shè)計(jì)的過程中，除了頁面的設(shè)計(jì)還有數(shù)據(jù)庫的設(shè)計(jì)，數(shù)據(jù)庫的每個(gè)表就對應(yīng)著Java中的每個(gè)實(shí)體類，這個(gè)類封裝了數(shù)據(jù)庫中的列作為屬性，封裝了數(shù)據(jù)庫的增刪改查作為方法，就拿這個(gè)投稿系統(tǒng)為例，實(shí)體主要有用戶、稿件等等，實(shí)體間還有著一對一映射或者一對多映射等對應(yīng)關(guān)系。其實(shí)，整個(gè)系統(tǒng)的開發(fā)就是圍繞著這些個(gè)實(shí)體進(jìn)行的，甚至于我們可以把實(shí)體名字做為二級目錄，把實(shí)體的增刪改查作為GET或POST的路徑，譬如account/add、paper/delete等等，有了這些路徑，那么與之對應(yīng)的GET和POST的Controller也就有了，接下來我們要做的就是，定義Controller中返回的視圖，寫完Controller后再把與實(shí)體相關(guān)的增刪改查方法寫到服務(wù)層中，再把項(xiàng)目的整個(gè)骨架搭起來，再去處理細(xì)節(jié)，很快的，這個(gè)項(xiàng)目就成型了。這里前端和后臺的配合尤為重要，數(shù)據(jù)交互是整個(gè)系統(tǒng)的核心。2.JSP頁面設(shè)計(jì)：提到JSP頁面，在這里我想說的一點(diǎn)是，其實(shí)JSP頁面是在服務(wù)器生成的，那么傳給JSP頁面的變量、參數(shù)都會在服務(wù)器轉(zhuǎn)化為它們具體的值，然后再傳給客戶端。JSP頁面可以實(shí)現(xiàn)很多服務(wù)器端的功能，因?yàn)榭梢灾苯釉陧撁媲度隞AVA代碼，但是我們必須明確的一點(diǎn)是，JSP頁面主要是用來呈現(xiàn)視圖的，不要再其中套入大量的代碼，要明確前端與后臺的分工。3.JSTL標(biāo)簽：JSTL標(biāo)簽就是JSP standard taglib，即JSP標(biāo)準(zhǔn)標(biāo)簽庫，首先，EL表達(dá)式可以非常方便的取出Controller返回的View包含的Model，甚至都無需聲明EL表達(dá)式。其次，JSTL標(biāo)簽可以實(shí)現(xiàn)很多的邏輯控制功能，比如最基本的c:if判斷、c:forEach循環(huán)，甚至有更強(qiáng)大的c:choose，有了這些，我們可以大大簡化代碼量，JSP頁面中用幾十行java寫的代碼，有時(shí)用幾句JSTL標(biāo)簽組合就實(shí)現(xiàn)了，此外，像fmt:parseDate和fmt:formatDate也是很好用的標(biāo)簽，用于日期的解析和格式化，此外JSTL更有強(qiáng)大的函數(shù)標(biāo)簽庫fn:，項(xiàng)目中我也只用到了fn:length取后臺傳的list的長度。要善用JSTL標(biāo)簽，但是又不要完全依賴于它，JSTL標(biāo)簽很方便、快捷，但是切記，JSTL功能有限，不要完全依賴于它。4.shiro框架：shiro框架是apache的一款面向java web項(xiàng)目的權(quán)限控制框架，這個(gè)框架無論前端、后臺都十分好用，在前端，我們可以使用shiro強(qiáng)大的標(biāo)簽庫，通過用戶角色賦予用戶不同的訪問權(quán)限。譬如，如果一個(gè)系統(tǒng)的用戶有訪客、用戶、管理員三種角色，我們就可以通過shiro標(biāo)簽來控制游客不能訪問哪些內(nèi)容，頁面向用戶和管理員呈現(xiàn)的不同內(nèi)容，這就是shiro標(biāo)簽的神奇之處。5.sitemesh框架：這個(gè)主要是用來將所有頁面套用固定格式，用以頁面的復(fù)用，其實(shí)有些時(shí)候標(biāo)簽更為方便，而且sitemesh框架的內(nèi)存開銷是的二倍，還會導(dǎo)致攔截器出現(xiàn)一些莫名的bug，所以并不推薦使用。6.jquery：在這個(gè)項(xiàng)目中寫了很多的jquery代碼，發(fā)現(xiàn)jquery確實(shí)是個(gè)神奇的東西，jquery的神奇之處就在于jquery強(qiáng)大的選擇器可以方便的取到頁面的DOM元素，并且給這些元素綁定不同的事件，提到綁定事件，說一下on、live和bind的區(qū)別：bind是jquery最早的綁定事件方法，on是jquery 1.7.0以后才有的方法，bind和on都不能將事件綁定給DOM加載完畢后后添加到頁面的DOM元素，這時(shí)就需要live了。還有一個(gè)經(jīng)常使用的就是jquery的ajax了，其實(shí)在做這個(gè)項(xiàng)目之前自己一直不理解ajax的作用機(jī)理，只是心里又個(gè)概念而已，但是，在真正使用的ajax之后，才發(fā)現(xiàn)ajax的強(qiáng)大之處，確實(shí)如AJAX自身描述一樣，異步加載javascript，這就允許我們在不打開新頁面的情況POST一些參數(shù)給后臺，后臺得到并處理這些參數(shù)后將JSON返回給前端，這個(gè)JSON的處理function就寫在ajax的success處理function中。在這個(gè)項(xiàng)目JSON和AJAX最主要的應(yīng)用就是翻頁，加載一個(gè)頁面，把頁面?zhèn)鹘o后臺然后把得到的JSON呈現(xiàn)給用戶，翻頁時(shí)重新POST參數(shù)，然后在用js重新處理一下翻頁區(qū)域即可。7.jquery.validate.js：這是一個(gè)輕量的jquery框架，主要用于表單的驗(yàn)證，非常方便。8.twitter bootstrap.js：bootstrap自帶的js框架，里面定義了許多與bootstrap樣式相關(guān)聯(lián)的函數(shù)，使用起來也很方便。9.正則表達(dá)式：正則表達(dá)式的模式匹配是很強(qiáng)大的，靈活運(yùn)用正則表達(dá)式，也會簡化代碼，甚至我們在查找替換時(shí)都可以使用正則表達(dá)式。總體上說，這個(gè)項(xiàng)目極大的鍛煉了自己的代碼編寫功能，從以前寫一句代碼要敲無數(shù)次backspace，現(xiàn)在居然可以將某些簡單的函數(shù)一氣呵成了。今天項(xiàng)目終于上線了，總結(jié)一下，希望以后自己能夠取得長足的進(jìn)步！ </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="下載web前端開發(fā)知識點(diǎn)總結(jié)word格式文檔"> <div id="e4emmbj" class="download_card_msg"> <div id="2qcrkaw" class="download_card_title" style="text-decoration:none;">下載web前端開發(fā)知識點(diǎn)總結(jié).doc</div> <div id="987m50o" class="download_card_tip">將本文檔下載到自己電腦，方便修改和收藏，請勿使用迅雷等下載。</div> </div> <div id="gxjdhno" class="download_card_btn"> <img src="http://static.xiexiebang.com/skin/default/images/icon_download.png"> <div id="uaulkfv" class="downlod_btn_right"> <div>點(diǎn)此處下載文檔</div> 文檔為doc格式 </div> </div> </a> <div id="igdfhto" class="post-tags mt20 mb30">相關(guān)專題 <a href="/tag/webqdzsdhz/" target="_blank">web前端知識點(diǎn)匯總</a> <a href="/tag/webqdkfgzzj/" target="_blank">web前端開發(fā)工作總結(jié)</a> <a href="/tag/webqdkfzsd/" target="_blank">web前端開發(fā)知識點(diǎn)</a> </div> <div id="10mokoc" class="single-info mb40">網(wǎng)址：http://004km.cn/a1/2019051215/0c387521035310d8.html 聲明：本文內(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)行舉報(bào)，并提供相關(guān)證據(jù)，工作人員會在5個(gè)工作日內(nèi)聯(lián)系你，一經(jīng)查實(shí)，本站將立刻刪除涉嫌侵權(quán)內(nèi)容。 </div> <div id="lju4wvw" class="single-xg mb40"> <div id="razzugc" class="con-title"> <h3><a name="6"></a>相關(guān)范文推薦</h3> </div> <div id="ihvgpmf" class="sticky mb20"> <ul><h2 class="mb20"><a href="/a6/2019051513/b88b4e7826bc5152.html" target="_blank">Web前端開發(fā)筆試題</a></h2>Web前端開發(fā)筆試題一．單選題 1. div.box{color:red;} #box{color:blue;} div{ color: yellow !important;} 華章漢辰 Div里的字體的顏色是：（） A:紅色B:藍(lán)色 C:綠色 D:黃色 2.......<h2 class="mb20"><a href="/a1/2019051215/9f4bcca624c725cb.html" target="_blank">web前端面試總結(jié)</a></h2>1. 常用那幾種瀏覽器測試？有哪些內(nèi)核(Layout Engine)? (Q1) 瀏覽器：IE，Chrome，F(xiàn)ireFox，Safari，Opera。 (Q2) 內(nèi)核：Trident，Gecko，Presto，Webkit。 2. 說下行內(nèi)元素和塊級元素的區(qū)別？行......<h2 class="mb20"><a href="/a4/201905125/91f0eb21ee1e3710.html" target="_blank">WEB前端開發(fā)工程師筆試試題（范文模版）</a></h2>WEB前端開發(fā)工程師筆試試題1.HTML的含義是什么?其主體部分由什么標(biāo)記構(gòu)成?2.說明在網(wǎng)頁設(shè)計(jì)中div標(biāo)簽的作用3.CSS指的是什么?在網(wǎng)頁制作中為什么要使用CSS技術(shù)4.css 中id和c......<h2 class="mb20"><a href="/a1/2019051215/3ef300ef805c4ad6.html" target="_blank">Web前端開發(fā)培訓(xùn)中es5與es6語法知識點(diǎn)總結(jié)</a></h2>Web前端開發(fā)培訓(xùn)中es5與es6語法知識點(diǎn)總結(jié)（百讀易萊勝）熱點(diǎn)：web前端開發(fā)培訓(xùn)百讀易萊勝官網(wǎng)前端開發(fā)易萊勝官網(wǎng)#es6的寫法： 1.利用import...form....代替require 方式一：導(dǎo)入......<h2 class="mb20"><a href="/a12/201905144/93610f309620c69e.html" target="_blank">web前端個(gè)人簡歷</a></h2>個(gè)人簡歷個(gè)人信息姓名：xxxx 性別：男出生日期：1993.03 婚姻狀況：未婚工作所在地：北京家庭所在地：湖北聯(lián)系電話：18xxxxxx 電子郵箱：xxxxxx@qq.com專業(yè)技能 1、熟練使用Sublime......<h2 class="mb20"><a href="/a2/2019051214/f8e237d4bcf5309a.html" target="_blank">Web前端工作總結(jié)</a></h2>Web前端學(xué)習(xí)總結(jié) 一.名詞解釋 1. 橫切在固定頁面的寬度(按柵格化進(jìn)行)并且對高度沒有限制的容器稱為一個(gè)標(biāo)準(zhǔn)橫切 2. 留白兩個(gè)容器或碎片之間的上、下、左、右的空白距離......<h2 class="mb20"><a href="/a1/2019051215/d4f5da23df5250bb.html" target="_blank">web前端學(xué)習(xí)總結(jié)2</a></h2>1.WEB標(biāo)準(zhǔn)以及W3C標(biāo)準(zhǔn)是什么？標(biāo)簽閉合、標(biāo)簽小寫、不亂嵌套、使用外鏈css和js、結(jié)構(gòu)行為表現(xiàn)的分離。1.xhtml和html有什么區(qū)別 XHTML 元素必須被正確地嵌套，閉合，區(qū)分大小寫，文......<h2 class="mb20"><a href="/a1/2019051123/2bc3c60d716d950d.html" target="_blank">WEB前端開發(fā)經(jīng)驗(yàn)總結(jié)1（寫寫幫推薦）</a></h2>WEB前端開發(fā)經(jīng)驗(yàn)總結(jié)1 結(jié)構(gòu)，結(jié)構(gòu)，剛才我提到了標(biāo)簽有塊級元素和行內(nèi)元素之分的，要是不理解好這兩個(gè)概念，我們也不會很好的了解怎么合理的結(jié)構(gòu)化頁面，現(xiàn)在就來介紹它們：塊級元素......</ul> </div> </div> </div> </div> <div id="yrtnggf" class="right-content-box wow fadeInRight delay300 right-content"> <div id="kf1zsmm" class="sidebar"> <div class="kji0s6t" 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="/a10/201905147/89261fed7bac3b16.html" title="Web前端開發(fā)技術(shù)人才培養(yǎng)模式研究" target="_blank">Web前端開發(fā)技術(shù)人才培養(yǎng)模式研究</a></li><li><a href="/a1/2019051212/7d7988947a3c5acb.html" title="web知識點(diǎn)總結(jié)" target="_blank">web知識點(diǎn)總結(jié)</a></li><li><a href="/a2/2019051219/39cd3ebe48d2ef88.html" title="Web前端程序員簡" target="_blank">Web前端程序員簡</a></li><li><a href="/a3/2019051211/c1cdc64f63497a0c.html" title="web前端實(shí)習(xí)經(jīng)驗(yàn)" target="_blank">web前端實(shí)習(xí)經(jīng)驗(yàn)</a></li><li><a href="/a1/2019051215/78242e56bcaab53f.html" title="最新web前端學(xué)習(xí)路線" target="_blank">最新web前端學(xué)習(xí)路線</a></li><li><a href="/a6/201905130/0b9cc70312ed972d.html" title="web前端培訓(xùn)學(xué)習(xí)心得" target="_blank">web前端培訓(xùn)學(xué)習(xí)心得</a></li><li><a href="/a6/2019051513/7eafc99efd48b52a.html" title="Web前端代碼規(guī)范" target="_blank">Web前端代碼規(guī)范</a></li><li><a href="/a15/2019051513/3cd4f42fff81dab5.html" title="web前端個(gè)人簡歷（5篇）" target="_blank">web前端個(gè)人簡歷（5篇）</a></li><li><a href="/a7/201905132/c33170f0027517b4.html" title="騰訊web前端開發(fā)工程師筆試題及答案" target="_blank">騰訊web前端開發(fā)工程師筆試題及答案</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="htcua2w" class="container"> <div id="uedj443" class="footer-top clearfix"> <div id="4ulmdcj" class="copyr"> <div id="p4yvfc8" 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> Copyright ? 2018 <a href="/">寫寫幫文庫</a> All Rights Reserved <a target="_blank" rel="nofollow"> 浙ICP備11058632號</a> </div> </div> </div> </section> <div id="esodbka" class="right_bar hidden-xs "> <ul> <li id="oeov2en" class="rtbar_li1" style="left: 0px;"><a><img src="http://static.xiexiebang.com/skin/default/images/rtbar_liicon3.png"></a></li> <li id="gjeovm6" class="rtbar_li2"> <a href="javascript:void(0);"> <img src="http://static.xiexiebang.com/skin/default/images/rtbar_liicon4.png"> </a> <div id="dadlb7x" 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="22wlrjb" class="rtbar_li3" style="left: 0px;"> <a href="tencent://message/?uin=2261362615&Menu=yes"> <img src="http://static.xiexiebang.com/skin/default/images/rtbar_liicon2.png"> 點(diǎn)擊咨詢 </a> </li> <li id="oicpoq2" class="rtbar_li5"><a href="#1">第一篇</a></li> <li id="rzuzlyn" class="rtbar_li6"><a href="#2">第二篇</a></li> <li id="fbf4a9n" class="rtbar_li7"><a href="#3">第三篇</a></li> <li id="3l05rao" class="rtbar_li8"><a href="#4">第四篇</a></li> <li id="saugdwx" class="rtbar_li9"><a href="#5">第五篇</a></li> <li id="jwqq2tb" class="rtbar_li10"><a href="#6">更多</a></li> <li id="9eaohsy" 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"></abbr><nav id="fwlom"><thead id="fwlom"></thead></nav><ul id="fwlom"></ul><blockquote id="fwlom"></blockquote><address id="fwlom"><ruby id="fwlom"><pre id="fwlom"></pre></ruby></address><ul id="fwlom"></ul><center id="fwlom"><dl id="fwlom"><optgroup id="fwlom"></optgroup></dl></center><ins id="fwlom"></ins><optgroup id="fwlom"></optgroup><abbr id="fwlom"></abbr><pre id="fwlom"></pre><table id="fwlom"></table><pre id="fwlom"><delect id="fwlom"></delect></pre><tr id="fwlom"><address id="fwlom"></address></tr><abbr id="fwlom"></abbr><acronym id="fwlom"><th id="fwlom"><track id="fwlom"></track></th></acronym><dfn id="fwlom"></dfn><optgroup id="fwlom"><xmp id="fwlom"></xmp></optgroup><thead id="fwlom"><ol id="fwlom"></ol></thead><output id="fwlom"><fieldset id="fwlom"></fieldset></output><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"><blockquote id="fwlom"></blockquote></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><acronym id="fwlom"><th id="fwlom"></th></acronym><label id="fwlom"><video id="fwlom"></video></label><pre id="fwlom"><xmp id="fwlom"></xmp></pre><center id="fwlom"></center><input id="fwlom"></input><abbr id="fwlom"><style id="fwlom"></style></abbr><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><legend id="fwlom"></legend><thead id="fwlom"><optgroup id="fwlom"></optgroup></thead><legend id="fwlom"><tr id="fwlom"><td id="fwlom"></td></tr></legend><acronym id="fwlom"><th id="fwlom"></th></acronym><pre id="fwlom"></pre><dfn id="fwlom"></dfn><nav id="fwlom"><center id="fwlom"></center></nav><output id="fwlom"></output><style id="fwlom"></style><big id="fwlom"></big><track id="fwlom"><output id="fwlom"><label id="fwlom"></label></output></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><noframes id="fwlom"></noframes><noframes id="fwlom"><dfn id="fwlom"></dfn></noframes><var id="fwlom"><center id="fwlom"><dl id="fwlom"></dl></center></var><abbr id="fwlom"></abbr><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"></pre></strike></ruby><fieldset id="fwlom"></fieldset><form id="fwlom"></form><button id="fwlom"></button><th id="fwlom"><menuitem id="fwlom"></menuitem></th><acronym id="fwlom"><noframes id="fwlom"></noframes></acronym><blockquote id="fwlom"></blockquote><option id="fwlom"></option><pre id="fwlom"></pre><pre id="fwlom"><form id="fwlom"></form></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"></video></dl><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"><pre id="fwlom"><dfn id="fwlom"></dfn></pre></object><kbd id="fwlom"><center id="fwlom"></center></kbd><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"></rt><tr id="fwlom"><dfn id="fwlom"></dfn></tr><dfn id="fwlom"></dfn><listing id="fwlom"></listing><s id="fwlom"></s><acronym id="fwlom"><th id="fwlom"></th></acronym><div id="fwlom"></div><output id="fwlom"><th id="fwlom"></th></output><blockquote id="fwlom"><ol id="fwlom"></ol></blockquote><menu id="fwlom"></menu><acronym id="fwlom"><listing id="fwlom"><dfn id="fwlom"></dfn></listing></acronym><input id="fwlom"></input><ins id="fwlom"></ins><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"><center id="fwlom"></center></blockquote><meter id="fwlom"></meter><rp id="fwlom"></rp><button id="fwlom"><tfoot id="fwlom"></tfoot></button><label id="fwlom"></label><blockquote id="fwlom"><style id="fwlom"></style></blockquote><table id="fwlom"><center id="fwlom"></center></table><style id="fwlom"></style><object id="fwlom"><nav id="fwlom"></nav></object><bdo id="fwlom"></bdo><optgroup id="fwlom"><xmp id="fwlom"><object id="fwlom"></object></xmp></optgroup><nav id="fwlom"><center id="fwlom"></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="5ncow" class="pl_css_ganrao" style="display: none;"><video id="5ncow"></video><center id="5ncow"></center><dl id="5ncow"></dl><legend id="5ncow"><th id="5ncow"><li id="5ncow"></li></th></legend><ins id="5ncow"><delect id="5ncow"></delect></ins><strike id="5ncow"></strike><big id="5ncow"><tr id="5ncow"></tr></big><track id="5ncow"></track><pre id="5ncow"><ol id="5ncow"><menu id="5ncow"><xmp id="5ncow"></xmp></menu></ol></pre><object id="5ncow"><var id="5ncow"><thead id="5ncow"></thead></var></object><label id="5ncow"></label><acronym id="5ncow"><td id="5ncow"></td></acronym><pre id="5ncow"><div id="5ncow"><optgroup id="5ncow"></optgroup></div></pre><pre id="5ncow"><rt id="5ncow"><dl id="5ncow"><dfn id="5ncow"></dfn></dl></rt></pre><s id="5ncow"></s><video id="5ncow"></video><dfn id="5ncow"></dfn><div id="5ncow"></div><meter id="5ncow"><legend id="5ncow"></legend></meter><th id="5ncow"></th><delect id="5ncow"></delect><tbody id="5ncow"><menu id="5ncow"><code id="5ncow"></code></menu></tbody><center id="5ncow"></center><th id="5ncow"></th><table id="5ncow"><ins id="5ncow"><thead id="5ncow"></thead></ins></table><pre id="5ncow"></pre><optgroup id="5ncow"><samp id="5ncow"></samp></optgroup><table id="5ncow"><tbody id="5ncow"></tbody></table><dfn id="5ncow"><delect id="5ncow"><acronym id="5ncow"></acronym></delect></dfn><address id="5ncow"><meter id="5ncow"><style id="5ncow"></style></meter></address><label id="5ncow"><acronym id="5ncow"><tt id="5ncow"></tt></acronym></label><tr id="5ncow"><center id="5ncow"><pre id="5ncow"></pre></center></tr><ins id="5ncow"></ins><form id="5ncow"></form><thead id="5ncow"><source id="5ncow"><samp id="5ncow"></samp></source></thead><tr id="5ncow"></tr><pre id="5ncow"></pre><tr id="5ncow"></tr><td id="5ncow"></td><del id="5ncow"><pre id="5ncow"><center id="5ncow"></center></pre></del><pre id="5ncow"></pre><input id="5ncow"></input><output id="5ncow"></output><optgroup id="5ncow"></optgroup><samp id="5ncow"></samp><meter id="5ncow"><progress id="5ncow"></progress></meter><progress id="5ncow"></progress><center id="5ncow"><strike id="5ncow"></strike></center><output id="5ncow"><tt id="5ncow"><big id="5ncow"></big></tt></output><fieldset id="5ncow"><th id="5ncow"><nav id="5ncow"></nav></th></fieldset><form id="5ncow"><tbody id="5ncow"><label id="5ncow"></label></tbody></form><th id="5ncow"><li id="5ncow"></li></th><dfn id="5ncow"></dfn><output id="5ncow"></output><tbody id="5ncow"><td id="5ncow"><code id="5ncow"></code></td></tbody><label id="5ncow"></label><div id="5ncow"><pre id="5ncow"><tt id="5ncow"></tt></pre></div><source id="5ncow"></source><delect id="5ncow"></delect><nav id="5ncow"><ins id="5ncow"></ins></nav><var id="5ncow"><del id="5ncow"></del></var><form id="5ncow"><xmp id="5ncow"></xmp></form><output id="5ncow"><strike id="5ncow"><dl id="5ncow"></dl></strike></output><acronym id="5ncow"></acronym><menuitem id="5ncow"><thead id="5ncow"><thead id="5ncow"></thead></thead></menuitem><fieldset id="5ncow"><li id="5ncow"></li></fieldset><form id="5ncow"><del id="5ncow"><thead id="5ncow"><dl id="5ncow"></dl></thead></del></form><thead id="5ncow"></thead><center id="5ncow"><tbody id="5ncow"><menu id="5ncow"></menu></tbody></center><rp id="5ncow"></rp><center id="5ncow"><pre id="5ncow"><var id="5ncow"></var></pre></center><address id="5ncow"><cite id="5ncow"><input id="5ncow"></input></cite></address><pre id="5ncow"></pre><dl id="5ncow"></dl><pre id="5ncow"><ul id="5ncow"><acronym id="5ncow"><td id="5ncow"></td></acronym></ul></pre><th id="5ncow"><form id="5ncow"><menuitem id="5ncow"></menuitem></form></th><pre id="5ncow"><thead id="5ncow"><dfn id="5ncow"></dfn></thead></pre><nav id="5ncow"><ruby id="5ncow"><option id="5ncow"><strike id="5ncow"></strike></option></ruby></nav><acronym id="5ncow"></acronym><big id="5ncow"></big><optgroup id="5ncow"></optgroup><div id="5ncow"><pre id="5ncow"></pre></div><tr id="5ncow"></tr><tt id="5ncow"></tt><ruby id="5ncow"></ruby><progress id="5ncow"></progress><var id="5ncow"></var><pre id="5ncow"></pre><listing id="5ncow"></listing><button id="5ncow"></button><rt id="5ncow"><dl id="5ncow"><optgroup id="5ncow"></optgroup></dl></rt><abbr id="5ncow"></abbr><track id="5ncow"></track><rp id="5ncow"></rp><tr id="5ncow"><tbody id="5ncow"></tbody></tr><tbody id="5ncow"><address id="5ncow"></address></tbody><optgroup id="5ncow"></optgroup><progress id="5ncow"><dd id="5ncow"><meter id="5ncow"><input id="5ncow"></input></meter></dd></progress><thead id="5ncow"></thead><thead id="5ncow"></thead><noframes id="5ncow"></noframes><dd id="5ncow"></dd><ruby id="5ncow"></ruby><code id="5ncow"></code><optgroup id="5ncow"></optgroup><li id="5ncow"></li><center id="5ncow"><legend id="5ncow"><var id="5ncow"></var></legend></center><video id="5ncow"></video><source id="5ncow"><th id="5ncow"></th></source><button id="5ncow"><form id="5ncow"></form></button><thead id="5ncow"><strike id="5ncow"></strike></thead><samp id="5ncow"></samp><output id="5ncow"></output><pre id="5ncow"><optgroup id="5ncow"></optgroup></pre><strike id="5ncow"><tfoot id="5ncow"></tfoot></strike><form id="5ncow"><s id="5ncow"></s></form><acronym id="5ncow"></acronym><listing id="5ncow"></listing><xmp id="5ncow"><address id="5ncow"><code id="5ncow"></code></address></xmp><legend id="5ncow"></legend><label id="5ncow"></label><legend id="5ncow"></legend><samp id="5ncow"></samp><legend id="5ncow"><pre id="5ncow"><center id="5ncow"></center></pre></legend><li id="5ncow"></li><legend id="5ncow"><li id="5ncow"></li></legend><td id="5ncow"><dl id="5ncow"></dl></td><td id="5ncow"></td><dd id="5ncow"><meter id="5ncow"></meter></dd><dfn id="5ncow"></dfn><menuitem id="5ncow"></menuitem><table id="5ncow"><del id="5ncow"></del></table><acronym id="5ncow"></acronym></div> </html>