Web前端常見面試題及答案
1、盒子模型
盒子模型包括四部分：內容（content）勋又、填充（padding）苦掘、邊框（border）、邊界（margin）
盒子模型可以分為兩種：IE盒子模型和W3C標準盒子模型
區(qū)別：兩者對于width的計算方式不同楔壤，前者width=border+padding+內容寬度鹤啡，后者width=內容寬度。
2蹲嚣、position包含幾種屬性递瑰？absolute和relative的區(qū)別祟牲？
static：默認狀態(tài)、沒有定位泣矛、正常流
inherit：從父元素集成position屬性的值
fixed：生成絕對定位的元素（相對于瀏覽器窗口進行定位）
absolute：生成絕對定位的元素（相位與static定位以外的第一個父元素定位）
relative：生成相對定位的元素（相對于其正常位置定位）
absolute和relative區(qū)別：父元素的padding對relative的子元素布局有影響疲眷，absolute的子元素不受影響
3、前端性能優(yōu)化
減少HTTP請求您朽、使用內容發(fā)布網絡、壓縮組件换淆、使用Expire頭哗总、JS放底部、CSS放頂部倍试、避免CSS表達式等讯屈。
具體可以參考：http://www.reibang.com/p/4bd6bb0bb49e
4、JSONP是什么县习？它是如何實現跨域的涮母？為什么它可以實現跨域？
JSONP(JSON with Padding)是一個非官方的協議躁愿，它允許在服務器端集成Script tags返回至客戶端叛本，通過javascript callback的形式實現跨域訪問。
由于同源策略的限制彤钟，XmlHttpRequest只允許請求當前源（域名来候、協議、端口）的資源逸雹，為了實現跨域請求营搅，可以通過script標簽實現跨域請求（因為同源策略不阻止動態(tài)腳本插入，并且將腳本看作是從提供 Web 頁面的域上加載的）梆砸，然后在服務端輸出JSON數據并執(zhí)行回調函數转质，從而解決了跨域的數據請求。
跨域的4種方式：
①通過動態(tài)添加script標簽帖世，然后指定callback函數休蟹，可以獲取到傳過來的json數據，這時候要自己寫一個callback函數來處理數據狮暑；
②使用jquery封裝好的getJson方法鸡挠，傳入不同域的url?callback=?,好處是不需要手動的插入script標簽以及定義回掉函數。jquery會自動生成一個全局函數來替換callback=?中的問號搬男，之后獲取到數據后又會自動銷毀拣展，實際上就是起一個臨時代理函數的作用。$.getJSON方法會自動判斷是否跨域缔逛，不跨域的話备埃，就調用普通的ajax方法姓惑；跨域的話，則會以異步加載js文件的形式來調用jsonp的回調函數按脚。
③通過設置window.domain來處理跨域于毙，但是只適用于不同子域的框架間的交互。所以使用的時候可以用一個隱藏的iframe來做一個代理辅搬，讓這個iframe載入一個與你想要通過ajax獲取數據的目標頁面處在相同的域的頁面唯沮。
④window.name是可以跨域的。window.name的值只能是字符串的形式堪遂，這個字符串的大小最大能允許2M左右甚至更大的一個容量介蛉，具體取決于不同的瀏覽器，但一般是夠用了溶褪。所以可以轉化成字符串的數據都可以使用window.name來傳遞币旧，比如json數據。
5猿妈、瀏覽器兼容問題
css兼容性問題：①不同瀏覽器的標簽默認的外補丁和內補丁不同吹菱，解決方案：用通配符*來設置各個標簽的內外補丁是0（即設置margin和padding為0）；②div的垂直居中問題 vertical-align：middle彭则；文字居中：將行距增加到和整個div一樣鳍刷，高line-height=行高；③margin加倍問題：設置為float的div在ie下的margin會加倍贰剥。解決方案：為這個div設置樣式：display:inline;
js兼容性問題：①在標準的事件綁定中綁定事件的方法函數為addEventListener倾剿，而IE使用的是attachEvent；②事件處理中event屬性的獲取不同蚌成。標準瀏覽器是作為參數帶入前痘，然后通過e.target獲取目標元素；而IE是通過window.event方式獲得担忧，通過e.srcElement獲取目標元素芹缔；
6、JS和JAVA的作用域有什么區(qū)別
java是塊級作用域瓶盛，js是函數作用域最欠，沒有塊級作用域。
var name="global"; if(true){ var name="local"; console.log(name) } console.log(name);這段都輸出是“l(fā)ocal",如果有塊級作用域惩猫，明顯if語句將創(chuàng)建局部變量name,并不會修改全局name,可是沒有這樣芝硬，所以Js沒有塊級作用域。
7轧房、閉包問題
閉包：函數能被外部調用到拌阴，則該作用連上的所有變量都會被保存下來。
作用：①可以讀取函數內部的變量奶镶；②相當于劃出了一塊私有作用域迟赃，避免數據污染陪拘；③讓變量始終保存在內存中
使用全局變量被認為是不好的習慣，而且容易造成錯誤并且維護成本較高纤壁，所以js可以采用閉包的方式讀取函數的內部變量左刽。但是如果大量使用閉包就會造成過多的變量始終保存在內存中，會造成內存泄漏酌媒。
一個簡單的閉包例子：
function f1(){
var n=999;
function f2(){
alert(n);
}
return f2;
}
var result=f1();
result(); // 999
8欠痴、js中this的工作原理
①全局范圍內：指向全局對象；
this;
②函數調用：指向全局對象
foo();
③方法調用：this指向test對象
test.foo();
④調用構造函數：this指向新創(chuàng)建的對象
new foo();
⑤顯示的設置this：使用call或者apply方法時馍佑，this指向第一個參數
function foo(a, b, c) {}
var bar = {};
foo.apply(bar, [1, 2, 3]); // 數組將會被擴展斋否，如下所示
foo.call(bar, 1, 2, 3); // 傳遞到foo的參數是：a = 1, b = 2, c = 3
10、模塊化編程
①AMD（異步模塊定義） requirejs
defined(id,deps,factory)
require([dependency],function(){})
異步加載拭荤，瀏覽器不會失去響應
它指定的回調函數，只有前面的模塊都加載完成后疫诽，才會運行舅世，解決了依賴性問題
②CMD（通用模塊定義） seajs
模塊定義方式和模塊加載時機處理不同
defined(id,deps,factory)
function(require,exports,module)
module.exports = ______;
③區(qū)別：AMD依賴前置，在定義模塊的時候就要聲明其依賴的模塊奇徒；CMD就近依賴雏亚，只有在用到哪個模塊的時候再去require；
11摩钙、JS繼承與原型問題
Js所有的函數都有一個prototype屬性罢低，這個屬性引用了一個對象，即原型對象胖笛，也簡稱原型网持。每一個對象都有原型，在瀏覽器中它體現在一個隱藏的proto屬性上长踊。
當一個對象需要調用某個方法時功舀，它回去最近的原型上查找該方法，如果沒有找到身弊，它會再次往下繼續(xù)查找辟汰。這樣逐級查找，一直找到了要找的方法阱佛。 這些查找的原型構成了該對象的原型鏈條帖汞。原型最后指向的是null。我們說的原型繼承凑术，就是將父對像的方法給子類的原型翩蘸。子類的構造函數中不擁有這些方法和屬性。
12麦萤、少用float鹿鳖？
①使用float可能會造成兼容性問題扁眯，比如在ie6以下，float元素margin加倍問題翅帜；②使用float之后會影響左右元素姻檀，有可能造成錯位問題（float之后都要clear）
解決：可用display、position轉化
①無序鏈接（ul涝滴、li）绣版，設定li標簽屬性：display:inline
②div左右結構，比如在右側要放一個more（更多）來顯示更多信息的時候用到了float:right歼疮，可以用定位來做杂抽。給包裹more的div設定position：relative，然后more這個標簽right：0即可韩脏。結構更為清晰一點缩麸。
13、一個頁面從URL到加載顯示完成赡矢，都發(fā)生了什么杭朱？
①通過DNS將該地址解析成IP地址；
②發(fā)起網絡連接吹散，進行http協議會話：客戶端發(fā)送報頭（請求報頭）弧械，服務端回饋報頭（響應報頭）
③返回一個頁面（根據頁面上的外鏈的URL重新發(fā)送請求獲取）
④接收文件完畢空民，對加載到的資源進行語法解析刃唐，以及相應的內部數據結構（網頁渲染）
14、隊列界轩、堆画饥、棧的區(qū)別？
隊列是先進先出：就像一條路耸棒，有一個入口和一個出口荒澡，先進去的就可以先出去。而棧就像一個箱子与殃，后放的在上邊单山，所以后進先出。堆是在程序運行時幅疼，而不是在程序編譯時米奸，申請某個大小的內存空間。即動態(tài)分配內存爽篷，對其訪問和對一般內存的訪問沒有區(qū)別悴晰。
棧(Stack)是操作系統在建立某個進程時或者線程為這個線程建立的存儲區(qū)域。在編程中，例如C/C++中铡溪，所有的局部變量都是從棧中分配內存空間漂辐，實際上也不是什么分配，只是從棧頂向上用就行棕硫，在退出函數的時候髓涯，只是修改棧指針就可以把棧中的內容銷毀，所以速度最快哈扮。
堆（Heap)是應用程序在運行的時候請求操作系統分配給自己內存纬纪，一般是申請/給予的過程。由于從操作系統管理的內存分配所以在分配和銷毀時都要占用時間滑肉，所以用堆的效率低的多包各！但是堆的好處是可以做的很大，C/C++對分配的Heap是不初始化的靶庙。
在Java中除了簡單類型（int,char等）都是在堆中分配內存问畅，這也是程序慢的一個主要原因。但是跟C/C++不同六荒，Java中分配Heap內存是自動初始化的按声。在Java中所有的對象（包括int的wrapper Integer）都是在堆中分配的，但是這個對象的引用卻是在Stack中分配恬吕。也就是說在建立一個對象時從兩個地方都分配內存，在Heap中分配的內存實際建立這個對象须床，而在Stack中分配的內存只是一個指向這個堆對象的指針（引用）而已铐料。
15、如何居中div豺旬？如何居中一個浮動元素钠惩？
給div設置一個寬度，然后添加margin:0 auto;
div{
width:200px;
margin:0 auto;
}
居中一個浮動元素
div{
width:500px;
height:500px;
magin:-150px 0 0 -250px;
position:relative;
left:50%;
top:50%;
}
16族阅、什么是線程篓跛？進程和線程的關系是什么？
線程可定義為進程內的一個執(zhí)行單位坦刀，或者定義為進程內的一個可調度實體愧沟。 在具有多線程機制的操作系統中，處理機調度的基本單位不是進程而是線程鲤遥。一個進程可以有多個線程沐寺，而且至少有一個可執(zhí)行線程。
打個比喻:進程好比工廠(計算機)里的車間盖奈，一個工廠里有多個車間(進程)在運轉,每個車間里有一個或多個工人（線程）在協同工作混坞，這些工人就可以理解為線程。
線程和進程的關系:
1.線程是進程的一個組成部分.
2.進程的多個線程都在進程地址空間活動.
3.系統資源是分配給進程的，線程需要資源時究孕，系統從進程的資源里分配給線程.
4.處理機調度的基本單位是線程.
17啥酱、React為什么這么火？
18厨诸、CSS3中的transform屬性和transition屬性镶殷？
transform：
功能：使元素變形的屬性，其配合rotate（旋轉角度）泳猬、scale（縮放倍數）批钠、skew（扭曲元素）等參數一起使用
語法：
transform:rotate(旋轉角度)；//正數為順時針得封、負數為逆時針埋心；
transform:rotate(30deg);//順時針旋轉30度
transform:rotate(-20deg);//逆時針旋轉20度
transform:scale(縮放倍數)；
transform:scale(1.20);//放大1.2倍
transition：
功能：設置元素由樣式一變?yōu)闃邮蕉枰囊恍┳兓Ч?br> 語法：transition: property duration timing-function delay;
|值|描述|
|:---:|:---:|
|transition-property|規(guī)定設置過渡效果的 CSS 屬性的名稱忙上。|
|transition-duration|規(guī)定完成過渡效果需要多少秒或毫秒拷呆。|
|transition-timing-function|規(guī)定速度效果的速度曲線。|
|transition-delay|定義過渡效果何時開始疫粥。|
注：使用這兩個屬性時應考慮到瀏覽器的兼容性茬斧，所以要針對不同的瀏覽器都添加一次樣式，如下：
-webkit-transform:rotate(0deg) scale(1.20);
-moz-transform:rotate(0deg) scale(1.20);
transform:rotate(0deg) scale(1.20);
19梗逮、什么是MVVM框架项秉？
MVVM是Model-View-ViewModel的簡寫。
MVVM 是 Web 前端一種非常流行的開發(fā)模式慷彤，利用 MVVM 可以使我們的代碼更專注于處理業(yè)務邏輯而不是去關心 DOM 操作娄蔼。目前著名的 MVVM 框架有 vue, avalon, angular 等，這些框架各有千秋底哗，但是實現的思想大致上是相同的：數據綁定 + 視圖刷新岁诉。跟MVC一樣，主要目的是分離視圖（View）和模型（Model）跋选。View可以獨立于Model變化和修改涕癣，一個ViewModel可以綁定到不同的"View"上，當View變化的時候Model可以不變前标，當Model變化的時候View也可以不變坠韩。
在MVVM中，數據是核心候生，由于VIewModel與View之間的雙向綁定同眯，操作了ViewModel中的數據（當然只能是監(jiān)控屬性），就會同步到DOM唯鸭，我們透過DOM事件監(jiān)控用戶對DOM的改動须蜗，也會同步到ViewModel。
<div id="mobile-list">
<h1 v-text="title"></h1>
<ul>
<li v-for="item in brands">
<b v-text="item.name"></b>
<span v-show="showRank">Rank: {{item.rank}}</span>
</li>
</ul>
</div>
var element = document.querySelector('#mobile-list');
var vm = new MVVM(element, {
'title' : 'Mobile List',
'showRank': true,
'brands' : [
{'name': 'Apple', 'rank': 1},
{'name': 'Galaxy', 'rank': 2},
{'name': 'OPPO', 'rank': 3}
]
});
vm.set('title', 'Top 3 Mobile Rank List'); // => <h1>Top 3 Mobile Rank List</h1>
以上這段如此簡潔的代碼，就是MVVM框架的一個簡單的實現效果明肮。在HTML代碼里面菱农，可能會嵌入很多自定義的屬性（標記），以此來實現數據的綁定柿估，而且還可以進行一些簡單的邏輯處理循未，比如if和循環(huán)等。
react應該也算是MVVM框架秫舌，但是與傳統的MVVN框架不同的是的妖，react默認數據綁定方式是單向綁定，而vue及angular都是雙向綁定足陨；react使用虛擬DOM配合JSX嫂粟，而vue及angular直接將數據通過屬性綁定在真實DOM上的。
MVVM框架的優(yōu)點：
1墨缘、方便測試
在MVC下星虹，Controller基本是無法測試的，里面混雜了個各種邏輯镊讼，而且分散在不同的地方宽涌。有了MVVM我們就可以測試里面的viewModel，來驗證我們的處理結果對不對蝶棋。
2卸亮、便于代碼的移植
可以把一些視圖邏輯放在一個ViewModel里面，讓很多view重用這段視圖邏輯玩裙。比如iOS里面有iPhone版本和iPad版本嫡良，除了交互展示不一樣外，業(yè)務邏輯的model是一致的献酗。這樣，我們就可以以很小的代價去開發(fā)另一個app坷牛。
3罕偎、獨立開發(fā)
開發(fā)人員可以專注于業(yè)務邏輯和數據的開發(fā)（ViewModel），設計人員可以專注于頁面設計京闰，使用Expression Blend可以很容易設計界面并生成xml代碼颜及。
20、利用@media screen實現網頁布局的自適應蹂楣。
判斷媒體類型俏站，執(zhí)行不同的css樣式屬性
重要屬性：min-width：設置最小分辨率大小痊土；max-width：設置最大分辨率大小肄扎。
①方式一：通過css
///1280分辨率以上（大于1200px）
@media screen and (min-width:1200px){
#content{ width: 1100px; }
#mian,.div1{width: 730px;}
#secondary{width:310px;}
}
//1100分辨率（大于960px，小于1199px）
@media screen and (min-width: 960px) and (max-width: 1199px) {
#content{ width: 960px; }
#main,.div1{width: 650px;}
#secondary{width:250px}
}
②方式二：通過link引入不同的css文件
//意思是當屏幕的寬度大于600小于800時，應用styleB.css
<link rel="stylesheet" type="text/css" href="styleB.css" media="screen and (min-width: 600px) and (max-width: 800px)">
優(yōu)點:無需插件和手機主題,對移動設備友好,能夠適應各種窗口大小犯祠。只需在CSS中添加@media screen屬性,根據瀏覽器寬度判斷并輸出不同的長寬值旭等。
21、使用原生js實現ajax
創(chuàng)建一個 XMLHttpRequest 對象衡载。如果不支持創(chuàng)建該對象的瀏覽器搔耕，則需要創(chuàng)建 ActiveXObject，具體方法如下：
var xmlHttpRequest;
function createXmlHttpRequest(){
if(window.XMLHttpRequest)//非IE
xmlHttpRequest = new XMLHttpRequest();
else if(window.ActiveObject)//IE6+
xmlHttpRequest = new ActiveObject("Msxml2.XMLHTTP");
else//IE6-
xmlHttpRequest = new ActiveObject("Microsoft.XMLHTTP");
}
提交請求的方法：
open(method,url);//分別為提交的方法（GET或者POST）和提交的url
send(content);
onreadystatechange(){
if(xmlHttpRequest.readyState == 4){
if(xmlHttpRequest.state == 200){
//請求成功
}
}else{
//請求失敗
}
}
22痰娱、前端安全方面有沒有了解弃榨？XSS和CSRF如何攻防？
XSS(Cross Site Scripting)是跨站腳本攻擊梨睁，為了區(qū)分CSS鲸睛，所以縮寫為XSS。惡意攻擊者往Web頁面里插入惡意Script代碼而姐，當用戶瀏覽該頁之時腊凶，嵌入其中Web里面的Script代碼會被執(zhí)行，從而達到惡意攻擊用戶的目的拴念。
在網頁的一些公共區(qū)域（例如钧萍，建議提交表單或消息公共板的輸入表單）輸入一些文本，這些文本被其它用戶看到政鼠，但這些文本不僅僅是他們要輸入的文本风瘦，同時還包括一些可以在客戶端執(zhí)行的腳本。如：
"/> <script>alert(document.cookie);</script><!--
在文本框中輸入以上代碼公般，然后點擊提交万搔，就會把用戶的cookie彈出來。
XSS漏洞修復
1.將重要的cookies標記為HTTP ONLY官帘。
2.只允許用戶輸入我們期望的數據瞬雹。如年齡框只能輸入數字。
3.對數據進行HTTP Encode處理刽虹。
4.過濾或者移除特殊的HTML標簽酗捌。
5.過濾JS事件的標簽。
CSRF（Cross-site request forgery）是跨站請求偽造涌哲。XSS利用站點內的信任用戶胖缤，而CSRF則通過偽裝來自受信任用戶的請求來利用受信任的網站。其實就是攻擊者盜用了你的身份阀圾，以你的名義發(fā)送惡意請求哪廓。
CSRF攻擊的思想
用戶瀏覽并登陸信任網站A；通過驗證初烘，在用戶處產生X的cookie涡真；用戶在沒有登出X的時候分俯，瀏覽危險網站B；B要求訪問第三方網站A综膀，發(fā)出一個請求澳迫；根據這個請求，瀏覽器使用剛才產生的cookie直接訪問A剧劝。
一個簡單的實例
銀行網站A橄登，它以GET請求來完成銀行轉賬的操作，如：http://www.mybank.com/Transfer.php?toBankId=11&money=1000
危險網站B讥此，它里面有一段HTML的代碼如下：
<img src=http://www.mybank.com/Transfer.php?toBankId=11&money=1000>
首先拢锹，你登錄了銀行網站A，然后訪問危險網站B萄喳，噢卒稳，這時你會發(fā)現你的銀行賬戶少了1000塊......
CSRF的防御
1.在表單里增加Hash值，以認證這確實是用戶發(fā)送的請求他巨，然后在服務器端進行Hash值驗證充坑。
2.驗證碼：每次的用戶提交都需要用戶在表單中填寫一個圖片上的隨機字符串。
20染突、說說你對HTML5認識?（是什么,為什么）
HTML5指的是包括 HTML 捻爷、 CSS 和 JavaScript 在內的一套技術組合。 HTML5 是 HTML 最新版本份企， 2014 年 10 月由萬維網聯盟（ W3C ）完成標準制定也榄。
HTML4陳舊不能滿足日益發(fā)展的互聯網需要，特別是移動互聯網司志。為了增強瀏覽器功能 Flash 被廣泛使用甜紫，但安全與穩(wěn)定堪憂，不適合在移動端使用（耗電骂远、觸摸囚霸、不開放）。
HTML5增強了瀏覽器的原生功能激才，符合 HTML5 規(guī)范的瀏覽器功能將更加強大邮辽，減少了 Web 應用對插件的依賴，讓用戶體驗更好贸营，讓開發(fā)更加方便，另外 W3C 從推出 HTML4.0 到 5.0 之間共經歷了 17 年岩睁， HTML 的變化很小钞脂，這并不符合一個好產品的演進規(guī)則。
21捕儒、什么是WebGL,它有什么優(yōu)點?
WebGL（全寫 Web Graphics Library ）是一種 3D 繪圖標準冰啃，這種繪圖技術標準允許把 JavaScript 和 OpenGL ES 2.0 結合在一起邓夕，通過增加OpenGL ES 2.0 的一個 JavaScript 綁定， WebGL 可以為 HTML5 Canvas 提供硬件 3D 加速渲染阎毅，這樣 Web 開發(fā)人員就可以借助系統顯卡來在瀏覽器里更流暢地展示 3D 場景和模型了焚刚，還能創(chuàng)建復雜的導航和數據視覺化。顯然扇调， WebGL 技術標準免去了開發(fā)網頁專用渲染插件的麻煩矿咕，可被用于創(chuàng)建具有復雜 3D 結構的網站頁面，甚至可以用來設計 3D 網頁游戲等等狼钮。
WebGL完美地解決了現有的 Web 交互式三維動畫的兩個問題：
第一碳柱，它通過HTML腳本本身實現 Web 交互式三維動畫的制作，無需任何瀏覽器插件支持 ;
第二熬芜，它利用底層的圖形硬件加速功能進行的圖形渲染莲镣，是通過統一的、標準的涎拉、跨平臺的OpenGL接口實現的瑞侮。
通俗說WebGL中 canvas 繪圖中的 3D 版本。因為原生的 WebGL 很復雜鼓拧，我們經常會使用一些三方的庫半火，如 three.js 等，這些庫多數用于HTML5 游戲開發(fā)毁枯。
22慈缔、說說你對SVG理解?
SVG可縮放矢量圖形（ Scalable Vector Graphics ）是基于可擴展標記語言（ XML ），用于描述二維矢量圖形的一種圖形格式种玛。 SVG 是W3C('World Wide Web ConSortium' 即 ' 國際互聯網標準組織 ') 在 2000 年 8 月制定的一種新的二維矢量圖形格式藐鹤，也是規(guī)范中的網絡矢量圖形標準。 SVG 嚴格遵從 XML 語法赂韵，并用文本格式的描述性語言來描述圖像內容娱节，因此是一種和圖像分辨率無關的矢量圖形格式。 SVG 于 2003 年 1 月14 日成為 W3C 推薦標準祭示。
特點：
(1)任意放縮
用戶可以任意縮放圖像顯示肄满，而不會破壞圖像的清晰度、細節(jié)等质涛。
(2)文本獨立
SVG圖像中的文字獨立于圖像稠歉，文字保留可編輯和可搜尋的狀態(tài)。也不會再有字體的限制汇陆，用戶系統即使沒有安裝某一字體怒炸，也會看到和他們制作時完全相同的畫面。
(3)較小文件
總體來講毡代，SVG文件比那些 GIF 和 JPEG 格式的文件要小很多阅羹，因而下載也很快勺疼。
(4)超強顯示效果
SVG圖像在屏幕上總是邊緣清晰，它的清晰度適合任何屏幕分辨率和打印分辨率捏鱼。
(5)超級顏色控制
SVG圖像提供一個 1600 萬種顏色的調色板执庐，支持 ICC 顏色描述文件標準、 RGB 导梆、線 X 填充轨淌、漸變和蒙版。
(6)交互 X 和智能化问潭。 SVG 面臨的主要問題一個是如何和已經占有重要市場份額的矢量圖形格式 Flash 競爭的問題猿诸，另一個問題就是 SVG 的本地運行環(huán)境下的廠家支持程度。
是否了解什么前沿的技術狡忙、或者你自己有什么技術特長梳虽、在哪方便有優(yōu)勢？
持續(xù)更新中灾茁。窜觉。。
