前端總結

**實現左右中間自適應,左右固定,css

1,利用浮動去實現。html

2,利用定位去實現,css3

3,利用flexbox去實現es6

4,利用表格佈局去實現 table-cellweb

5,grid網格佈局json

對象windows

1,對象就是一個實例跨域

new 操做符。以這種方式調用構造函數實際上會經歷如下 4數組

個步驟:瀏覽器

a,建立一個新對象,

b,改變改變構造函數的this指向,

b,執行這個構造函數中的代碼,爲對象添加屬性,

d,返回新對象

跨域請求

jsonp

cors

websocket

postMessage

提高頁面性能

資源壓縮合並,減小http請求

非核心代碼時間異步加載,

利用瀏覽器緩存,

使用cdn

瀏覽器預解析dns

實現水平垂直居中

第一種方法已知元素寬高

使用absolute,而且給給寬高設置50%,

第二種方法未知元素寬高

用css3的方法,使用transform translate(-50%,-50%)

第三種方法使用flex佈局

用display:flexrnhou justify-centent:center

align-items:center

css3動畫內容

css3動畫有三個重要屬性animation和動畫綁定,須要@keyframes去配合 transform(通常我須要用來改旋轉之類) transition(改寬高透明度之類的)

構造函數不須要顯示的返回值。使用new來建立對象(調用構造函數)時,若是return的是非對象(數字、字符串、布爾類型等)會忽 而略返回值;若是return的是對象,則返回該對象。

刪除數組,splice

img高度問題

父元素設置寬度之後img設置100%是生效的,而父元素設置max寬度,100%不生效

js做用域問題

JavaScript的函數做用域是指在在函數內聲明的全部變量在函數體內始終是可見的,也就是說在函數體內變量聲明以前就已經可用了。

es6經常使用功能總結

let、const

多行字符串,模板變量 (``和${})

塊級做用域

函數形參能夠聲明默認參數

箭頭函數

區分判斷document.body和document.documentElement前者值得是body,後者指的是html元素節點

windows.location.href是舊的寫法,新的標準推薦用document.URL替代。

history.scrollRestoration = "manual" 爲是否記錄用戶頁面滾動條,因此致使在頁面加載的時候沒法使用scrollTo

document.title,訪問頁面的title並能夠修改

css3新屬性object-fit,改變圖片縮放

position:sticky 粘性定位

**

相關文章
相關標籤/搜索