判斷當前元素匹配的css選擇器，class是什么元素？
定義和用法
class 屬性規定元素的類名（classname）。
class 屬性大多數時候用于指向樣式表中的類（class）。不過，也可以利用它通過 JavaScript 來改變帶有指定 class 的 HTML 元素。
你為什么選擇React而不選擇Vue？
前端領域，選擇框架是根據使用場景、業務需求、技術實現等綜合因素考慮的，選擇最適合的才能發揮最大效果。
目前前端三大主流框架有：React、Vue、Angular，他們在各自特定的場景下使用都非常出色。其中，Vue是不錯的漸進式JavaScript庫，更易于樣式開發構建UI。而我更傾向于選擇React，因為React具有獨特優勢：
React函數式編程理念使代碼更優雅和合理嚴謹的單向數據流設計，方便構建大型復雜穩定的單頁面應用豐富的技術生態圈，擁有世界范圍內各大技術社區支持方便配合ReactNative開發跨終端應用React的函數式編程理念使代碼更優雅和合理函數式編程設計思想。函數式編程是用函數的組合來進行編程。先聲明函數，然后調用函數，每一步都有返回值，通過抽出每一步邏輯運算抽象，封裝在函數中。再將函數組合來編寫程序。例如：計算平均值百分比，我們可以拆分為三個函數，一個是計算平均值，一個是計算百分比，一個是綜合調用的函數，通過函數嵌套函數的方式，使得代碼更優雅，更有利于復用。
React使用函數式編程思想使代碼更優雅和合理，更有利于組件化、模塊化開發。React的每個組件就是函數生成，頁面的渲染過程本質就是函數的嵌套調用過程。React的這種設計對于使用來說非常方便，例如以下子組件嵌套子組件再嵌套子組件示例：子組件中嵌套子組件調用模式始終都是相同的。父組件調用子組件都只需要考慮傳遞的參數props，而子組件只需要考慮傳入的參數。
嚴謹的單向數據流設計，方便構建大型復雜穩定的單頁面應用React的數據流始終是單向設計的，嚴格遵照數據驅動DOM。這樣的好處是，降低了組件互相通信的代碼耦合度，數據流更清晰，調試更方便。大型復雜單頁面應用一直是企業的難題，傳統方式開發都不能夠很好的維護。而使用React為基礎的技術棧，能夠方便地拆分模塊、組件，再配合Redux數據流管理，能夠高效構建應用。事實證明，這種React、Redux的大型復雜單頁面項目構建方案，已經在各大互聯網公司得到應用和發展。
豐富的技術生態圈，擁有世界范圍內各大技術社區支持React是由Facebook公司開發的高品質現代化前端框架，具有很高的權威性和專業性，在世界范圍內得到各大技術社區支持，包括國內的技術社區。比如，npm官網、淘寶cnpm社區等都有很豐富的生態。眾多的開發者共同添磚加瓦，開源共享，豐富了技術生態圈，讓我們方便學習和使用基于React的組件、插件，減少開發成本，提高開發效率。在國內，由阿里巴巴公司開發的基于React基礎開發的Antd組件庫深受各大互聯網企業好評，開箱即用，為加速國內中小企業的中臺化、信息化推進起到了重要作用。
方便配合ReactNative開發跨終端應用當前互聯網公司的一個重要難題問題是：如何減少成本、高效的進行跨終端應用開發。也就是說，互聯網公司都希望能夠開發iOS、Android、H5應用。React配合ReactNative庫能夠方便地開發跨終端應用。ReactNative設計原理上和React一致，使用了React技術棧，就已經有了基礎，再配合ReactNative就能一套代碼，編譯生成多端應用。ReactNative方便眾多公司快速高效開發App，降低研發成本，提高了生產力，減少了開發時間。
React、Vue發展趨勢React的發展趨勢更注重函數式編程。當前從16.7版本以后，出現了Hook函數鉤子的思想，只能是React函數式的組件才能使用。這一特性很明顯，React希望將函數式編程發揮極致，更優更好地項目開發。有趣的是，這里出現了useMemo函數，像極了Vue中的computed的作用，這里React就是借鑒了Vue的動態監聽變量的模式。
Vue的發展趨勢為更注重了項目標準化、嚴謹化。在Vue3中已經開始使用了TypeScript替代不夠嚴格的JavaScript寫法。而引入TypeScript這一點是借鑒了React的能夠深度融合TypeScript更嚴謹開發的經驗。
React、Vue發展趨勢表明，兩種框架互相汲取，取長補短，都是為了能夠更好地進行應用開發。
如何正確選擇框架面對React、Vue，我們應該怎么選。這里提供一些思路：
小型偏重于項目如果是偏重于UI展現，更多的樣式開發，推薦使用Vue。發揮Vue模板樣式的優勢。具有復雜的數據邏輯應用如中臺化項目，建議使用React。單向數據流的模式能夠避免數據邏輯錯誤。大型復雜單頁面項目，推薦React。再配合如Redux、Mbox等狀態管理庫，組件化、模塊化開發，有效管理。寫在最后React、Vue都是出色的前端框架，都有各自的一席之地。React框架的函數式編程理念、嚴謹的單向數據流設計、豐富的技術生態圈以及方便開發跨終端應用具有更大優勢。我們只有根據使用場景、業務需求、技術實現等綜合因素選擇最適合的框架，才能發揮最大的優勢，提高生產力。
以上是我的觀點，希望對你有所幫助。
template跟html的區別？
Vue template和html5的template用法比較1.html5中的template標簽
html中的template標簽中的內容在頁面中不會顯示。但是在后臺查看頁面DOM結構存在template標簽。這是因為template標簽天生不可見，它設置了display:none;屬性。
2.template標簽操作的屬性和方法
content屬性:在js中template標簽對應的dom對象存在content屬性，對應的屬性值是一個dom節點，節點的nodeName是#document-fragment。通過該屬性可以獲取template標簽中的內容，template對象.content可以調用getElementById、querySelector、querySelectorAll方法來獲取里面的子節點。
innerHTML:可以獲取template標簽中的html
3.vue中的template
(1)template標簽在vue實例綁定的元素內部
它是可以顯示template標簽中的內容，但是查看后臺的dom結構不存在template標簽。如果template標簽不放在vue實例綁定的元素內部默認里面的內容不能顯示在頁面上，但是查看后臺dom結構存在template標簽。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>template</title>
<script src="https://cdn.staticfile.org/vue/2.2.2/vue.min.js"></script>
</head>
<body>
<template id="tem">
<div id="mdiv">
<h1 id="title">hello world! tem</h1>
</div>
</template>
<div id="app">
<template>
<div>
<h1 id="title">hello world! app</h1>
</div>
</template>
</div>
<script type="text/javascript">
var tem =document.getElementById("tem");//獲取template標簽
console.log(tem);
console.log(tem.innerHTML); //
var title = tem.content.getElementById("title"); //在template標簽內部內容，必須要用.content屬性才可以訪問到
console.log(title);`在這里插入代碼片`
</script>
<script>
new Vue({
el : '#app',
})
</script>
</body>
</html>
(2)vue實例中的template屬性
將實例中template屬性值進行編譯，并將編譯后的dom替換掉vue實例綁定的元素，如果該vue實例綁定的元素中存在內容，這些內容會直接被覆蓋。
特點：
1）如果vue實例中有template屬性，會將該屬性值進行編譯，將編譯后的虛擬dom直接替換掉vue實例綁定的元素（即el綁定的那個元素）；
2）template屬性中的dom結構只能有一個根元素，如果有多個根元素需要使用v-if、v-else、v-else-if設置成只顯示其中一個根元素；
3）在該屬性對應的屬性值中可以使用vue實例data、methods中定義的數據。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>template</title>
<script src="https://cdn.staticfile.org/vue/2.2.2/vue.min.js"></script>
</head>
<body>
<template id = "first">
<div v-if = "flag">第一個{{msg}}</div>
<div v-else>第二個</div>
</template>
<div id = "app"></div>
<abc id="second">
<div v-if="flag">{{msg}}</div>
<div v-else>111</div>
</abc>
</script>
<script>
new Vue({
el:"#app",
data:{
msg:"hello",
flag:true
},
template:"#first"//通過該屬性可以將自定義的template屬性中的內容全部替換app的內容,并且會覆蓋里面原有的內容，并且在查看dom結構時沒有template標簽
});
</script>
</body>
</html>
如果將上面的template:"#first"改為template:"#second"，則標簽中的內容也會顯示在頁面上。所以此處利用template標簽來定義vue實例中需要設置的template屬性。(?)
行元素和塊元素有什么區別呢？
這個行元素和塊元素，應該是指css中的行元素和塊元素；對于css初學者有時會混淆行元素和塊元素，那么下面我來回答一下這兩者的區別；
行元素1、可以和其他元素在同一行，不需要另起一行；
2、不能設置width和height屬性，寬高由內容決定；
3、上邊距和下邊距不可設置；
常見行元素有:<span>、<a>、<i>、<label>等；
塊元素1、每個塊元素都是獨占一行顯示；
2、寬高、內外邊距都可以設置；
常見塊元素有:<div>、<p>、<ol>、<ul>、<dl>等；
總結：
行元素和塊元素之間是可以通過display屬性相互轉換的，如：將行元素的display屬性設置為block，就可以使行元素轉換成塊元素；將塊元素的display屬性設置為inline;，就可以使塊元素轉換成行元素；