前端筆試(二)
來(lái)源:程序員人生 發(fā)布時(shí)間:2016-11-22 09:00:46 閱讀次數(shù):2781次
阿里
AJAX跨域
設(shè)置 async:true即異步履行,設(shè)置async:false即同步履行
jquery中ajax處理跨域的3大方式 http://www.jb51.net/article/77470.htm
ajax本身不可以跨域,遇到跨域,用JSONP,即添加dataType:'jsonp' http://www.cnblogs.com/sunxucool/p/3433992.html
比較1下json與jsonp格式的區(qū)分:
json格式:
{ "message":"獲得成功", "state":"1", "result":{"name":"工作組1","id":1,"description":"11"}
}
jsonp格式:
callback({
"message":"獲得成功",
"state":"1",
"result":{"name":"工作組1","id":1,"description":"11"}
})
jsonp比json多了個(gè)callback
jsonp方法是1種非官方方法,只支持GET方式,不如POST方式安全。即便使用jQuery的jsonp方法,type設(shè)為POST,也會(huì)自動(dòng)變成GET
官方方法:通過(guò)設(shè)置Access-Control-Allow-Origin來(lái)實(shí)現(xiàn)跨域訪(fǎng)問(wèn) http://blog.csdn.net/fdipzone/article/details/46390573/
ajax用JSON來(lái)傳數(shù)據(jù),靠JSONP來(lái)跨域 http://kb.cnblogs.com/page/139725/
JSON是1種數(shù)據(jù)交換格式,描寫(xiě)信息的格式
JSONP是1種非官方跨域數(shù)據(jù)交互協(xié)議,信息傳遞雙方約定的方法
凡是具有”src”這個(gè)屬性的標(biāo)簽都具有跨域的能力,比如、
![]()
、
如何終止正在在發(fā)送的ajax要求 ?http://www.cnblogs.com/siqi/archive/2012/12/02/2798093.html
服務(wù)器支持跨域 ?http://blog.csdn.net/james_wade63/article/details/50772041
跨域 ?CORS(跨域資源同享,Cross-Origin Resource Sharing)
http://blog.csdn.net/suhenhappy/article/details/18043241
代理的方法 ??http://www.jb51.net/article/80881.htm
xhr2 ?http://www.th7.cn/web/html-css/201502/82375.shtml
地址欄hash ?http://www.tuicool.com/articles/6neUbeY? ? 錨點(diǎn)
閱讀器的同源策略
?http://www.cnblogs.com/net2012/p/3481993.html
同源策略規(guī)定:不同域的客戶(hù)端腳本在沒(méi)有明確授權(quán)的情況下,不能讀寫(xiě)對(duì)方的資源
同域要求兩個(gè)站點(diǎn)同協(xié)議、同域名、同端口
客戶(hù)端腳本指JS、ActionScript(Flash的腳本語(yǔ)言)、JS與ActionScript都遵守的ECMAScript腳本標(biāo)準(zhǔn)
HTTP要求頭里的Referer(表示要求來(lái)源)只可讀
同源策略中的資源指Web客戶(hù)真?zhèn)€資源
window.postMessage?http://www.webhek.com/window-postmessage-api/
window.postMessage功能是允許程序員跨域在兩個(gè)窗口/frames間發(fā)送數(shù)據(jù)信息。類(lèi)似AJAX,但是在兩個(gè)客戶(hù)端之間通訊
js設(shè)置document.domain實(shí)現(xiàn)跨域的注意點(diǎn)分析 ?http://www.3lian.com/edu/2015/05⑵2/215443.html
meta viewport
http://blog.csdn.net/xiebaochun/article/details/17579107
主要參數(shù)有下面幾個(gè):
maximum-scale:用戶(hù)可以縮放的最大值
minimum-scale:用戶(hù)可以縮放的最小值
initial-scale:viewport的默許縮放大小
width:固定viewport的寬度
height:固定viewport的高度
user-scalable:是不是允許用戶(hù)縮放
移動(dòng)端和桌面端不1樣,它有2個(gè)視口(viewport):可見(jiàn)視口(visual viewport)和 布局視口(layout viewport).
關(guān)于2者的區(qū)分,stack overflow有這樣的解釋?zhuān)?
想象下現(xiàn)在有1張不會(huì)改變尺寸和形狀的大的圖片,你手里拿著1個(gè)中空的框子(想象下砸空你手機(jī)的屏幕),透過(guò)它你可以看到這張圖片,并且這個(gè)框框的周?chē)怯貌煌该鞯牟牧献龀傻模阒荒芡ㄟ^(guò)中間的洞去看這張圖片。你可以移動(dòng)這個(gè)框子,靠近自己的眼睛的話(huà)可以看到更多的圖片區(qū)域,也能夠使它闊別自己的眼睛,從而只看到這張圖片的1部份小區(qū)域。
那張不可改變形狀和尺寸的圖片=布局視口(layout viewport)
你手中的中空的框子=可見(jiàn)視口(visual viewport)
也就是說(shuō)我們?cè)谝苿?dòng)端用手指來(lái)縮放屏幕,其實(shí)改變的是可見(jiàn)視口(visual viewport)的尺寸,而布局視口(layout viewport)總是保持不變。
箭頭函數(shù) ?http://www.jb51.net/article/50770.htm
簡(jiǎn)明扼要,禁用new操作,this不可變,沒(méi)有arguments對(duì)象
搜狗
頁(yè)面跳轉(zhuǎn)
window.location.assign和window.location.href區(qū)分?https://blog.tanteng.me/2015/06/window-location-assign-href/
window.location.assign(url)和window.location.href=url都是實(shí)現(xiàn)跳轉(zhuǎn)到網(wǎng)頁(yè),但assign會(huì)添加記錄到閱讀歷史,點(diǎn)擊后退可以返回之前頁(yè)面
location.assign 與 location.replace的區(qū)分? ?
http://blog.sina.com.cn/s/blog_694c144f01016e15.html
location.replace(url)通過(guò)加載URL指定的文檔替換當(dāng)前文檔,替換當(dāng)前窗口頁(yè)面,前后兩個(gè)頁(yè)面共用1個(gè)窗口,沒(méi)有后退返回上1頁(yè)
window.location和window.open的區(qū)分
window.location="url"跳轉(zhuǎn)后沒(méi)有后退功能
window.open(url)要新的窗口打開(kāi)連接
jQuery
jQuery選擇器總結(jié) ? ?http://www.cnblogs.com/onlys/articles/jQuery.html
層疊選擇器、基本過(guò)濾選擇器、內(nèi)容過(guò)濾選擇器、可視化過(guò)濾選擇器、屬性過(guò)濾選擇器、子元素過(guò)濾選擇器、表單元素選擇器、表單元素過(guò)濾選擇器
ajax() 方法通過(guò) HTTP 要求加載遠(yuǎn)程數(shù)據(jù)。$.ajax(opts);opts為json格式,常見(jiàn)參數(shù)url、type、data等。
load() 方法從
服務(wù)器加載數(shù)據(jù),并把返回的數(shù)據(jù)放入被選元素中。$(selector).load(URL,data,callback);
? ? 必須的 URL 參數(shù)規(guī)定您希望加載的 URL。
? ? 可選的 data 參數(shù)規(guī)定與要求1同發(fā)送的查詢(xún)字符串鍵/值對(duì)集合。
? ? 可選的 callback 參數(shù)是 load() 方法完成后所履行的函數(shù)名稱(chēng)。
$.get() 方法通過(guò) HTTP GET 要求從
服務(wù)器上要求數(shù)據(jù)。
$.get(URL,callback);
? ? 必須的 URL 參數(shù)規(guī)定您希望要求的 URL。
? ? 可選的 callback 參數(shù)是要求成功后所履行的函數(shù)名。
getScript() 方法通過(guò) HTTP GET 要求載入并履行 JavaScript 文件。
jQuery.getScript(url,success(response,status));
delete是1種post要求;
empty()是清空該匹配元素的內(nèi)容,但是該匹配元素還是存在;
remove()是清空該匹配元素的內(nèi)容,而且該匹配元素也會(huì)同時(shí)被清空;
$(A).append(content|fn) 在匹配的元素A內(nèi)部結(jié)尾追加內(nèi)容,父子關(guān)系
$(A).appendTo(B) 將A的內(nèi)容追加到B內(nèi)部結(jié)尾,父子關(guān)系
$(A).prepend(content) 在匹配的元素A內(nèi)部的開(kāi)頭插入content內(nèi)容
$(A).prependTo(B) 將匹配到的A元素追加到B的開(kāi)頭
$(A).after(content) 在匹配的元素A以后插入內(nèi)容content,兄弟關(guān)系
$(A).before(content) 在匹配的元素A之前插入內(nèi)容content
$(A).insertAfter(B) 將A的內(nèi)容追加到B以后,兄弟關(guān)系
$(A).insertBefore(B) 將A的內(nèi)容追加到B之前
其他
CSS Display(顯示) 與 Visibility(可見(jiàn)性) ?http://www.runoob.com/css/css-display-visibility.html
? ? visibility:hidden 隱藏的元素仍需占據(jù)未隱藏前1樣的空間
? ? display:none 隱藏的元素原來(lái)占用的空間從頁(yè)面布局中消失
Form表單標(biāo)簽的Enctype屬性的作用及利用示例介紹 ?http://www.jb51.net/web/165444.html
? ? Enctype是指定將數(shù)據(jù)回發(fā)到
服務(wù)器時(shí)閱讀器使用的編碼類(lèi)型
? ? application/x-www-form-urlencoded: 在發(fā)送前編碼所有字符(默許)。這是標(biāo)準(zhǔn)的編碼格式。 不能用于文件上傳
? ? multipart/form-data: 不對(duì)字符編碼,在使用包括文件上傳控件的表單時(shí),必須使用該值。 能完全的傳遞文件數(shù)據(jù),是上傳2進(jìn)制數(shù)據(jù)上去
? ? text/plain: 窗體數(shù)據(jù)以純文本情勢(shì)進(jìn)行編碼,其中不含任何控件或格式字符。
圖片按鈕 ?http://blog.csdn.net/evangel_z/article/details/7069425
table與td邊框堆疊問(wèn)題 ?http://blog.csdn.net/dhj2020/article/details/42564289
避免表單重復(fù)提交與等待頁(yè)面 ?http://www.jb51.net/article/41825.htm
display:table-cell?
HTML5自定義屬性對(duì)象Dataset ?http://www.zhangxinxu.com/wordpress/2011/06/html5自定義屬性對(duì)象dataset簡(jiǎn)介/
data-前綴設(shè)置自定義屬性,進(jìn)行1些數(shù)據(jù)的寄存
禁止a標(biāo)簽?zāi)S事件 ?http://blog.csdn.net/judas_jia/article/details/51166406
stopPropagation禁止JS事件冒泡
preventDefault禁止a標(biāo)簽?zāi)S行動(dòng)的產(chǎn)生
event.returnValue返回窗口值
30類(lèi)CSS選擇器?http://www.oschina.net/news/57107/30-css-selector-you-should-remeber
HTTP/2.0 相比1.0有哪些重大改進(jìn) ?https://www.zhihu.com/question/34074946 ? ??http://www.infoq.com/cn/news/2015/02/https-spdy-http2-comparison/
? ? 1、要求和響應(yīng)頭的大小
? ? http/2.0可使用頭部緊縮,來(lái)提示性能
? ? 2、響應(yīng)消息小
? ? 3、TCP連接數(shù)和頁(yè)面加載時(shí)的SSL握手要求數(shù)
? ? http/2.0通過(guò)使用多路復(fù)用技術(shù)在單獨(dú)的TCP和SSL連接上支持并發(fā),通過(guò)在1個(gè)連接上1次性發(fā)送多個(gè)要求來(lái)發(fā)送或接收數(shù)據(jù)
? ? 4、頁(yè)面加載時(shí)間短
? ? 5、
服務(wù)器推送(Server Push)是1種在客戶(hù)端要求之前發(fā)送數(shù)據(jù)的機(jī)制,
服務(wù)器可以對(duì)客戶(hù)真?zhèn)€1個(gè)要求發(fā)送多個(gè)響應(yīng)
CSS選擇器優(yōu)先級(jí) ?http://www.cnblogs.com/wangfupeng1988/p/4285251.html
ICE id100 class10 element 1
HTTP響應(yīng)頭信息和要求頭信息 ?http://blog.csdn.net/mm2223/article/details/8089645/
http://www.cnblogs.com/smyhvae/p/4005034.html
Cache-Control 通用頭 指定要求和響應(yīng)遵守的緩存機(jī)制
Expires實(shí)體頭 應(yīng)對(duì)頭 應(yīng)當(dāng)在甚么時(shí)候認(rèn)為文檔已過(guò)期,從而不再緩存它
Last-Modified實(shí)體頭 應(yīng)對(duì)頭 指定
服務(wù)器上保存內(nèi)容的最后修訂時(shí)間
Etag實(shí)體頭 1個(gè)對(duì)象(URL)的標(biāo)志值,供WEB
服務(wù)器判斷1個(gè)對(duì)象是不是改變
hasOwnproperty方法能返回1個(gè)布爾值,指出1個(gè)對(duì)象是不是具有指定名稱(chēng)的屬性。此方法沒(méi)法檢查該對(duì)象的原型鏈中是不是具有該屬性,該屬性必須為對(duì)象本身的屬性。
語(yǔ)法 object.hasOwnProperty(propertyName);
substr,substring,indexOf,lastIndexOf ?http://www.jb51.net/article/44921.htm
js中contains ?判斷元素包括關(guān)系 ??http://www.kuqin.com/shuoit/20131123/336498.html
DOMElement.contains(DOMNode);
charCodeAt() ?返回1個(gè)數(shù)字,表示給定索引處的字符的Unicode值? ?http://www.jb51.net/article/67338.htm
語(yǔ)法:string.charCodeAt(index);
charAt()?http://www.jb51.net/article/46938.htm
返回指定位置的字符
語(yǔ)法:stringObject.charAt(index);
cookie ??http://www.nowcoder.com/ta/front-end-interview/review?tpId=10&tqId=11077&query=&asc=true&order=&page=1
? ? 優(yōu)點(diǎn):在持久保存客戶(hù)端數(shù)據(jù)提供了方便,分擔(dān)了
服務(wù)器存儲(chǔ)的負(fù)擔(dān)
? ? 缺點(diǎn):
? ? 1、cookie數(shù)量和長(zhǎng)度的限制,每一個(gè)特定的域名下最多生成20個(gè)cookie,1般不能超過(guò)4095字節(jié)
? ? 2、安全性問(wèn)題
? ? 3、有些狀態(tài)不可能保存在客戶(hù)端
({}+{}).length的大小 ?30
({}+{}).length 等價(jià)于 ({}.toString() + {}.toString()).length,{}.toString()的值為[object Object],所以最后結(jié)果為30。
Array.prototype.slice.call(arguments)能將具有l(wèi)ength屬性的對(duì)象轉(zhuǎn)成數(shù)組 ?http://www.cnblogs.com/littledu/archive/2012/05/19/2508672.html
[].slice.call(arguments)相當(dāng)于Array.slice.call(arguments),目的是將arguments對(duì)象的數(shù)組提出來(lái)轉(zhuǎn)化為數(shù)組,arguments本身其實(shí)不是數(shù)組而是對(duì)象
HTML網(wǎng)頁(yè)的閱讀器標(biāo)題欄顯示小圖標(biāo)的方法 ? ?http://www.jb51.net/web/163883.html
Javascript實(shí)現(xiàn)閱讀器標(biāo)題欄文字轉(zhuǎn)動(dòng)效果 ??http://blog.csdn.net/chenjinping123/article/details/7971541
改變鼠標(biāo)樣式:
10大排序算法 ?http://gold.xitu.io/post/57dcd394a22b9d00610c5ec8