大家好，我是IT修真院北京總院第24期的學(xué)員，一枚正直純潔善良的web程序員
今天給大家分享一下，修真院官網(wǎng)JS任務(wù)10，深度思考中的知識(shí)點(diǎn)——談?wù)勔郧岸私嵌瘸霭l(fā)做好SEO需要考慮什么？
1.背景介紹
JavaScript 可在數(shù)據(jù)被送往服務(wù)器前對(duì) HTML 表單中的這些輸入數(shù)據(jù)進(jìn)行驗(yàn)證。以減輕后臺(tái)數(shù)據(jù)傳送壓力，提高數(shù)據(jù)傳送的質(zhì)量和效率。
HTML5自帶的表單驗(yàn)證屬性
js代碼
js第三方插件
2.知識(shí)剖析
驗(yàn)證時(shí)間
輸入時(shí)進(jìn)行實(shí)時(shí)驗(yàn)證(.onchange)京東注冊(cè)
退出焦點(diǎn)時(shí)驗(yàn)證(.onblur)修真院官網(wǎng)
提交表單時(shí)進(jìn)行本地驗(yàn)證亞馬遜登錄
H5自帶的表單驗(yàn)證屬性
JS代碼
if/switch，或者正則表達(dá)式，DOM操作
缺點(diǎn)：代碼量大，耗時(shí)多
優(yōu)點(diǎn)：相比于第三方庫(kù)，可以減少加載的js文件大小，樣式靈活
如果網(wǎng)站的表但很少，或者格式簡(jiǎn)單，或者對(duì)性能的要求高，可以手工寫
利用JS第三方插件
優(yōu)點(diǎn)：全站適用，手工代碼量少
缺點(diǎn)：有可能加重服務(wù)器負(fù)擔(dān)，樣式相對(duì)固定
3.常見問(wèn)題
1.表單驗(yàn)證常見的驗(yàn)證信息
2.不同的方法分別是什么寫法?
4.解決方案
表單驗(yàn)證常見信息
是否為空（必填/選填）
字符長(zhǎng)度（用戶名，密碼，姓名，電話，郵編，身份證）
大小寫
標(biāo)點(diǎn)，符號(hào)
是否支持中文
格式（郵箱，手機(jī)，銀行卡）
兩次密碼
主要介紹三大類寫法，分別是：js原生寫法、angular js的表單驗(yàn)證寫法、angular插件ng-message寫法。
5.編碼實(shí)戰(zhàn)
1.js原生寫法
2.angularJs ng-show寫法
3.angularjs ng-message(angular表單驗(yàn)證插件）（推薦）
6.擴(kuò)展思考
其他的插件
BootstrapValidator
7.參考文獻(xiàn)
8.更多討論
不同驗(yàn)證時(shí)間的優(yōu)缺點(diǎn)是什么？
第一種輸入時(shí)進(jìn)行實(shí)時(shí)驗(yàn)證，獲取焦點(diǎn)時(shí)顯示提示，隨著輸入的過(guò)程，符合要求后給予用戶通過(guò)驗(yàn)證的反饋，缺點(diǎn)是會(huì)影響一些性能，這個(gè)缺點(diǎn)也是很小的，一般情況下注冊(cè)頁(yè)都是單獨(dú)出現(xiàn)的，所以只是執(zhí)行幾個(gè)keydown這種小函數(shù)應(yīng)該也談不上影響性能。
第二種失去焦點(diǎn)驗(yàn)證，會(huì)導(dǎo)致用戶輸入完賬號(hào)后發(fā)現(xiàn)上邊不符合標(biāo)準(zhǔn)，還要點(diǎn)回去進(jìn)行修改，也是會(huì)影響一些用戶體驗(yàn)。
第三種提交時(shí)才驗(yàn)證，這種就有些故意為了降低服務(wù)器而設(shè)置的表單驗(yàn)證了，考慮機(jī)器的成分大，對(duì)用戶體驗(yàn)不夠重視，是不被推薦的驗(yàn)證方式。
為什么要做表單驗(yàn)證？
減少后端的壓力，提高頁(yè)面性能，提高用戶體驗(yàn)性，減少不必要的數(shù)據(jù)交互。
自己寫判斷還是用正則好？
如果是常用的，簡(jiǎn)單一些，非特殊的條件，可以用正則來(lái)進(jìn)行判斷，減少代碼量，但有些時(shí)候用正則無(wú)法適用，或者用正則會(huì)出現(xiàn)報(bào)錯(cuò)，就需要我們自己來(lái)寫。
感謝大家觀看
今天的分享就到這里啦，歡迎大家點(diǎn)贊、轉(zhuǎn)發(fā)、留言、拍磚~
技能樹.IT修真院
“我們相信人人都可以成為一個(gè)工程師，現(xiàn)在開始，找個(gè)師兄，帶你入門，掌控自己學(xué)習(xí)的節(jié)奏，學(xué)習(xí)的路上不再迷?！?。
這里是技能樹.IT修真院，成千上萬(wàn)的師兄在這里找到了自己的學(xué)習(xí)路線，學(xué)習(xí)透明化，成長(zhǎng)可見化，師兄1對(duì)1免費(fèi)指導(dǎo)?？靵?lái)與我一起學(xué)習(xí)吧~
我的邀請(qǐng)碼：12361358，或者你可以直接點(diǎn)擊此鏈接：http://www.jnshu.com/login/1/12361358
