1.css選擇器有哪些,優先級如何計算
- 類別選擇器、ID選擇器、標籤選擇器、通用選擇(*)、後代選擇器、僞類選擇器
- !important>行內樣式>ID選擇器>類選擇器>標籤>通配符>繼承>瀏覽器默認屬性
- 同一級別中後寫的會覆蓋先寫的樣式。
子選擇器和後代選擇器的區別
子選擇器是選擇元素的直接後代,即做用於第一個後代;後代選擇器則可做用於孫子代、曾孫子代等。
後代選擇器經過空格來進行選擇,而子選擇器是經過「>」進行選擇。
2.display: block, inline, inline-block的區別
行內元素:a,span,img,input,select,strong,em,b(標記性元素)
塊元素:div,p,ul,li,ol,dd,dt,dl,h1-h6
空元素:hr,br,input,img,link,meta
- display:block將元素顯示爲塊級元素,能夠設置元素的寬高,每個塊級元素都是重新的一行開始(帶換行符)。
- display : inline將元素顯示爲行內元素,高度,行高以及底邊距不可進行設置,高度就是內容文字或者圖片的寬度,不能夠改變。多個相鄰的行內元素排在同一行裏。(不帶換行符)
- display:inline-block將元素顯示爲行內塊狀元素,設置該屬性後,其餘的行內塊級元素會排列在同一行。既有block的寬度高度特性,又有inline的同行特性。
3.用純css實現底邊爲10px的三角形
position: absolute;
width: 0px;
border-bottom: 5px solid red;
border-left: 5px solid transparent;
border-right: 5px solid transparent
4.position值有哪些,分別相對於那個定位
- absolute:生成絕對定位元素,相對於值不爲static的第一個父元素進行定位
- fixed:生成絕對定位,相對於瀏覽器窗口進行定位
- relative:生成相對定位元素,相對於其正常位置進行定位
- static:沒有定位,元素出如今正常的流中(忽略偏移聲明:top、left、right、bottom、z-index)
- inherit:從父元素繼承position屬性的值
5.用js實現千分位分割(每3位用,隔開)
/* 方式一 */
function formatNumber(num) {
let array = num.toString().split('');
let length = array.length-1;
while(length >= 3){
array.splice(length - 2, 0, ',');
length = length -3;
}
let b = array.join('');
return b;
}
/* 方式二 */
function formatNumber(num) {
/* 使用正則表達式,將數字轉化爲字符串後,全局匹配,
* 看是否符合斷言(?=(?:\d{3})+$)部分
* 遇到數字而且該數字後跟着連續的三位數字(能夠出現屢次),
* 若符合,則在該數字('$1')後加入逗號,替換的時候忽略(?:)這連續的三位數
*/
let array = num.indexOf('.') !== -1 ?
num.toLocaleString() : num.toString().replace(/(\d)(?=(?:\d{3})+$)/g, '$1,');
}
6.js用typeof能得到哪些類型
- undefined——這個值未定義
- boolean——這個值是布爾值
- string——這個值是字符串
- number——這個值是數值
- object——這個值是對象或null
- function——這個值是函數
7.用js建立ajax的過程
- 建立XMLHttpRequest對象,也就是建立一個異步調用對象
- 建立一個新的HTTP請求,並指定該HTTP請求的方法、URL及驗證信息
- 設置響應HTTP請求狀態變化的函數
- 發送HTTP請求
- 獲取異步調用返回的數據
- 使用JavaScript和DOM實現局部刷新
let xmlHttp = null;
if(window.XMLHttpRequest) {
/* 除IE五、IE6瀏覽器 */
xmlHttp = new XMLHttpRequest();
} else {
/* 早期的IE五、IE6瀏覽器 參數是規定的 */
xmlHttp = new ActiveXObject('Microsoft.XMLHTTP');
}
/* open請求方式,參數一:表示以什麼方式(POST、GET);
* 參數二:表示服務器的地址;參數三:是否異步,默認是true,false表示同步 */
xmlHttp.open('GET', '地址', true);
/* 若是以post方式請求,必需要添加 */
xmlHttp.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
xmlHttp.send();
xmlHttp.onreadystatechange = function() {
if(xmlHttp.readyState === 4 && xmlHttp.status === 200) {
}
};