摘要:復(fù)習(xí)整理有什么新特性新增語義化標(biāo)簽等新增用于繪畫的元素用于媒介回放的和元素本地緩存有更好支持和是什么,文檔是什么是用來描述網(wǎng)頁的一種超文本標(biāo)記語言,文檔也被成為網(wǎng)頁,它包含標(biāo)簽和純文本是什么它不是標(biāo)簽,它為瀏覽器提供一種信息聲明,告訴瀏覽器
復(fù)習(xí)整理 html 1.html5有什么新特性?
新增語義化標(biāo)簽、等
? 新增用于繪畫的
? 用于媒介回放的video和audio元素
? 本地緩存有更好支持(localStorage和sessionStorage)
2.html是什么,html文檔是什么?html是用來描述網(wǎng)頁的一種超文本標(biāo)記語言,html文檔也被成為網(wǎng)頁,它包含html標(biāo)簽和純文本
3.是什么?它不是html標(biāo)簽,它為瀏覽器提供一種信息聲明,告訴瀏覽器html是用什么版本編寫的,用來表示html的版本
4.html文檔的類型有html、html+、html2.0、html、3.2、html4.01、xhtml 1.0、html5等
css 1.簡(jiǎn)述flex布局flex布局:彈性布局,設(shè)置間距相同的布局、單行單列布局的時(shí)候相當(dāng)好用
display可以設(shè)置為flex、inline-flex。
設(shè)置display:flex的時(shí)候,子元素的float、clear、vertical-align屬性都將全部失效。
容器屬性:
flex-direction設(shè)置主軸的排列方向,有 row(豎直向下排列)、row-reverse(豎直向上排列)、column(垂直向右排列)、column-reverse(垂直向左排列)
flex-wrap 設(shè)置是否排列在一條線上,有nowrap、wrap和warp-reverse三個(gè)選項(xiàng)
flex-flow是flex-direction和flex-wrap的簡(jiǎn)寫
justify-content定義項(xiàng)目在主軸上的對(duì)齊方式有 flex-start | flex-end | center | space-between | space-around
align-items定義交叉軸的對(duì)齊方式 flex-start | flex-end | center | baseline | stretch
align-content定義多跟軸線的對(duì)齊方式
項(xiàng)目屬性:
align-self(改項(xiàng)目的對(duì)齊方式)
order (項(xiàng)目排列順序)
flex-grow(項(xiàng)目放大比例)
flex-shrink(項(xiàng)目縮小比例)
flex-basis(在分配多余空間時(shí),項(xiàng)目占據(jù)的主軸空間)
flex(flex-grow,flex-shrink,flex-basis的縮寫)
2. 簡(jiǎn)述grid布局? 網(wǎng)格布局
3. 幾種實(shí)現(xiàn)水平垂直居中的方法使用display:flex,justify-content:center,align-item: center實(shí)現(xiàn)
確定高寬情況下
.test {
position: absolute; margin:auto; left:0; top:0; right:0; bottom:0; },或者 .test { position: absolute; margin:auto; left:50%; top:50%; margin-top: -height/50; margin-left: -width/50; },
不確定高寬
.test {
position: absolute; margin:auto; left:50%; top:50%; transform: translate(-50%,-50%) },4. 常見塊級(jí)元素和內(nèi)聯(lián)元素
塊級(jí)元素: div、form、table、p、h1-h6、dl、li、ul、ol等
內(nèi)聯(lián)元素: a、strong、br、img、i、span、label、input、textarea、select等
? absolute(絕對(duì)定位,相對(duì)于值不為static的第一個(gè)父元素進(jìn)行定位)
relative(相對(duì)定位,相對(duì)于其正常位置進(jìn)行定位) fixed(相對(duì)于瀏覽器窗口進(jìn)行定位) static(默認(rèn)值,沒有定位,元素出現(xiàn)在正常的流中) inherit(繼承父元素position屬性的值) sticky(relative和fixed的結(jié)合體,當(dāng)元素在屏幕內(nèi)飾relative,滾出屏幕時(shí)顯示為fixed)6. css3的新屬性
1. transfrom(對(duì)元素進(jìn)行旋轉(zhuǎn)、縮放、移動(dòng)或傾斜)、animation(動(dòng)畫效果)和transition(添加過渡效 果) 2. 三個(gè)邊框效果: border-radius(創(chuàng)建圓角邊框)、border-shadow(陰影)、border-image(使用圖片繪制邊框) 3. 文字效果新增word-wrap、text-overflow和text-shadow,以上等等7.block、inline和inline-block的區(qū)別
display:block
block元素又叫做塊級(jí)元素,它獨(dú)占一行,多個(gè)block元素各占一行。默認(rèn)情況下block元素 寬度自動(dòng)填滿父元素寬度
可以設(shè)置weight和width屬性,塊級(jí)元素設(shè)置了width還是獨(dú)占一行
可以設(shè)置padding和margin屬性
display:inline
1.inline元素又叫內(nèi)聯(lián)元素,不會(huì)占一行,多個(gè)內(nèi)聯(lián)元素會(huì)排列在一行,一行排列不下去才會(huì) 行,,寬度隨元素的內(nèi)容變化
2.設(shè)置width和weight屬性無效
3.inline元素的margin和padding屬性,水平方向上都能產(chǎn)生邊距效果,豎直方向上不會(huì)產(chǎn)生 效果
display: inline-block
內(nèi)聯(lián)塊級(jí)元素?fù)碛衖nline元素的多個(gè)占據(jù)同行特性和block元素的設(shè)置高度寬度特性和設(shè)置 padding和margin特性
8. display:none和visiblity:hidden的區(qū)別? 為none的時(shí)候不占空間,為hidden的時(shí)候隱藏元素依然占據(jù)空間
? 為none的會(huì)產(chǎn)生回流和重繪,visiblity:hidden的時(shí)候只產(chǎn)生重繪
? visiblity:hidden的子孫元素設(shè)置visiblity:hidden時(shí)會(huì)失效
9. 什么是BFC, BFC用來解決什么問題格式化上下文:特點(diǎn)是內(nèi)部的子元素不會(huì)影響外部的元素,可以用來解決margin穿透和清除浮動(dòng)
一個(gè)塊格式化上下文由以下之一創(chuàng)建:
1)根元素或其它包含它的元素 2)浮動(dòng)元素 (元素的 float 不是 none) 3)絕對(duì)定位元素 (元素具有 position 為 absolute 或 fixed) 4)內(nèi)聯(lián)塊 (元素具有 display: inline-block) 5)表格單元格 (元素具有 display: table-cell,HTML表格單元格默認(rèn)屬性) 6)表格標(biāo)題 (元素具有 display: table-caption, HTML表格標(biāo)題默認(rèn)屬性) 7)具有overflow 且值不是 visible 的塊元素, 8)display: flow-root 9)column-span: all 應(yīng)當(dāng)總是會(huì)創(chuàng)建一個(gè)新的格式化上下文,即便具有 column-span: all 的元素并不被包裹在一個(gè)多列容器中。10.盒子模型有哪些,如何設(shè)置
iE盒子模型: 內(nèi)容(content+padding+border)+邊界margin 高寬包含padding和border
標(biāo)準(zhǔn)盒子模型: content+padding+border+邊界margin 高寬指的是content
通過box-sizing:content-box設(shè)置標(biāo)準(zhǔn)盒子模型,box-sizing:border-box設(shè)置ie盒子模型
11.css選擇器有哪些選擇器有id選擇器、元素選擇器、屬性選擇器、類選擇器、后代選擇器、子元素選擇器、相鄰兄弟選擇器、偽類和偽元素。
12.清除浮動(dòng)的四種方式在浮動(dòng)的元素樣式中加入clear:both
在浮動(dòng)元素下面插入清除浮動(dòng)的塊級(jí)元素
給浮動(dòng)元素設(shè)置偽類,偽類樣式設(shè)置display為block,clear:both
設(shè)置BFC(格式化上下文),如浮動(dòng)父元素設(shè)置overflow:auto
13.如何用css實(shí)現(xiàn)一個(gè)三角形? 定義一個(gè)div元素,讓它的內(nèi)容高寬為0,通過border來實(shí)現(xiàn)
div { width: 0; height: 0; border: 40px solid; border-color: transparent transparent red; }
以上css樣式通過設(shè)置底部border邊為紅色,其他邊為透明色,實(shí)現(xiàn)了一個(gè)底部寬40,高20的紅色的三角形
js 1. addEventListener的第三個(gè)參數(shù)的作用指定事件是否在捕獲或者冒泡階段執(zhí)行,true為在捕獲階段執(zhí)行,false默認(rèn),在冒泡階段執(zhí)行
2.什么是事件冒泡,什么是事件捕獲事件冒泡指事件從發(fā)生的目標(biāo)開始,沿著文檔逐層向上冒泡,到documnent為止,事件捕獲則相反,從documnet開始,沿著文檔向下,直到目標(biāo)事件為止,
3.如何阻止事件冒泡和事件捕獲ie下設(shè)置e.cancelBubble = true,在符合w3c的瀏覽器設(shè)置e.stopProgation()阻止事件冒泡,也可以通過preventDefault阻止默認(rèn)行為,因?yàn)槭录幚淼哪J(rèn)行為就是冒泡或者通過return false
使用stopImmediatePropagation() 阻止事件捕獲,需要注意的是stopImmediatePropagation() 也能阻止事件冒泡,調(diào)用后,不僅父類元素冒泡被阻止,同時(shí)該元素綁定的同類事件也會(huì)執(zhí)行
4.typeof返回的數(shù)據(jù)類型string、number、boolean、undefined、object、function
5.列舉三種強(qiáng)制類型轉(zhuǎn)換和2種隱式類型轉(zhuǎn)換強(qiáng)制(parseInt、parseFloat、number)
隱式(== ===)
6.split() join()區(qū)別前者將字符串切割成數(shù)組形式,后者將數(shù)組轉(zhuǎn)為字符串
7. ajax請(qǐng)求get和post方法的區(qū)別get主要是獲取資源,post請(qǐng)求服務(wù)器端資源
get傳輸數(shù)據(jù)通過url,post通過http的post機(jī)制,將要傳輸?shù)臄?shù)據(jù)放在請(qǐng)求實(shí)體中發(fā)送給服務(wù)器
get傳輸數(shù)據(jù)量小,post傳輸數(shù)據(jù)量大
get不安全,post安全性較高
get只能支持ASCII字符傳輸,傳遞中午字符會(huì)亂打;post支持標(biāo)準(zhǔn)字符集,可以傳遞中文字符
8.call、apply和bind的區(qū)別call和apply都可以改變this的指向,區(qū)別在于傳入apply的第二個(gè)參數(shù)是一個(gè)數(shù)組,call后面是對(duì)象
bind后面的參數(shù)也是對(duì)象,但是bind不會(huì)立即執(zhí)行
9.ajax請(qǐng)求時(shí),如何解析json數(shù)據(jù)使用JSON.parse()把json數(shù)據(jù)轉(zhuǎn)化為js對(duì)象,使用JSON.Stringify()把js對(duì)象轉(zhuǎn)化為json字符串
10.閉包是什么,有什么特性閉包就是能夠讀取函數(shù)內(nèi)部變量的函數(shù),使得函數(shù)不被GC回收,如果過多使用,就會(huì)造成內(nèi)存泄露
11.添加 刪除 替換 插入到某個(gè)節(jié)點(diǎn)的方法創(chuàng)建新節(jié)點(diǎn)
createElement() // 創(chuàng)建一個(gè)具體元素
createTextNode() // 創(chuàng)建一個(gè)文本節(jié)點(diǎn)
添加、移除、替換、插入
appendChild() // 添加
removeChild() // 移除
replaceChild() // 替換
insertBefore() // 插入
12.document onload和doucment ready的區(qū)別onload是在結(jié)構(gòu)和樣式、外部js及圖片加載好后執(zhí)行js,ready是在dom樹創(chuàng)建完成后就執(zhí)行,是jquery里面的方法
13.函數(shù)聲明和函數(shù)表達(dá)式的區(qū)別函數(shù)聲明在js解析時(shí)就會(huì)進(jìn)行函數(shù)提升,因此在同一作用域中,不管函數(shù)聲明在哪定義,該函數(shù)都可以調(diào)用,函數(shù)表達(dá)式只有在執(zhí)行到那一塊后,才可以調(diào)用
14. null和undefined的區(qū)別? null表示‘空’的對(duì)象,轉(zhuǎn)化為數(shù)值是0,undefined是一個(gè)表示無的原始值,轉(zhuǎn)化為數(shù)值是NAN,
? 變量為聲明,默認(rèn)是undefined,null表示尚不存在的對(duì)象
? undefined表示為未初始化的變量返回的值,null表示一個(gè)尚不存在的對(duì)象返回的值,undefined可以看做空的變量,null看做空的對(duì)象
15. new操作符干了什么創(chuàng)建了一個(gè)空對(duì)象。
把所創(chuàng)建的空對(duì)象的_ proto _指向構(gòu)造函數(shù)的prototype
執(zhí)行構(gòu)造函數(shù)中的代碼,構(gòu)造函數(shù)中的this指向?qū)ο?/p>
返回該對(duì)象(除非構(gòu)造函數(shù)中返回一個(gè)對(duì)象或者函數(shù))
16.實(shí)現(xiàn)深度克隆JSON.parse(JSON.stringify());
17.什么是同源策略它是瀏覽器的一種約定,腳本只允許訪問同一站點(diǎn)的資源,協(xié)議相同,域名相同,端口號(hào)相同,就是同一站點(diǎn)
在瀏覽器中,
19.js如何獲取dom元素通過ID獲取(getElementById,只獲取一個(gè)元素,沒找到則為null)
通過name獲?。╣etElementByName, 返回一個(gè)類數(shù)組,沒有找到則為空數(shù)組)
通過標(biāo)簽名(getElementsByTagName,返回一個(gè)類數(shù)組,沒有找到則為空數(shù)組)
通過類名(getElementByClassName,返回一個(gè)類數(shù)組,沒找到則為空數(shù)組)
通過選擇器獲取一個(gè)元素(querySelector,返回值只取到第一個(gè)元素)
通過選擇器獲取所有元素(querySelectorAll,返回一個(gè)類數(shù)組)
20.原生ajax請(qǐng)求步驟有哪些// 創(chuàng)建XMLHttpRequest對(duì)象 var ajax = new XMLHttpRequest(); // 規(guī)定請(qǐng)求的類型,url及是否異步處理請(qǐng)求 ajax.open("GET", url,true); // 設(shè)置發(fā)送信息至服務(wù)器時(shí)內(nèi)容編碼格式 ajax.setRequestHeader("Content-type", "application/x-www-from-urlencoded"); //接受服務(wù)器響應(yīng)數(shù)據(jù) ajax.onreadystatechange = function() { if(ajax.readyState === 4 && ajax.status === 200 || ajax.status === 304 ) { } } //發(fā)送請(qǐng)求 ajax.send(null);21.列舉數(shù)組的對(duì)象方法
方法 | 描述 |
---|---|
push() | 添加元素到數(shù)組末尾 |
splice( ) | 刪除元素,并向數(shù)組添加新元素 |
unshift() | 向數(shù)組頭部添加一個(gè)元素 |
pop() | 刪除數(shù)組末尾元素 |
shift() | 刪除數(shù)組頭部元素 |
slice() | 從數(shù)組中返回特定的元素 |
sort() | 對(duì)數(shù)組進(jìn)行排序 |
join() | 把數(shù)組所有元素放入一個(gè)字符串,元素通過指定分割符進(jìn)行分隔 |
concat() | 合并兩個(gè)或多個(gè)數(shù)組,并合并 |
reverse() | 顛倒數(shù)組中元素的順序 |
toString() | 把數(shù)組轉(zhuǎn)化為字符串,返回結(jié)果 |
valueOf() | 返回?cái)?shù)組對(duì)象的原始值 |
1.es6實(shí)現(xiàn)
function deRep( arr ) { return [...new Set(arr)]; }
2.遍歷數(shù)組
function deRep (arr) { var a = []; for(let i = 0; i< arr.length;i++) { if(a.indexOf(arr[i]) == -1) { a.push(arr[i]); } } return a; }
3.優(yōu)化數(shù)組遍歷,(雙層循環(huán))
function deRep(arr) { var a = []; for (let i = 0; i < arr.length; i++) { for(let j = i+1; j < arr.length; j++ ) { if(arr[i] === arr[j]) { ++i; } } a.push(arr[i]); } return a; }
4.排序后相鄰去重
function deRep(arr) { var a = [arr[0]]; arr.sort(); for(let i = 0; i < arr.length; i++ ) { if(arr[i] !== a[a.length - 1]) { a.push(arr[i]); } } return a; }
利用map的key值不能重復(fù)
function deReq(arr) { let map = new Map(); let a = []; for (let i =0 ; i< arr.length; i++) { if(map.has(arr[i])) { map.set(arr[i], true); } else { map.set(arr[i],false) a.push(arr[i]); } } return a; }
6.利用reduce()方法
function deReq(arr) { return arr.reduce((prev,cur) => { prev.includes(cur) || prev.push(cur); return prev; },[]); }23.數(shù)組求和
1.使用遞歸
function sum(arr) { let len = arr.length; if(len === 0) { return 0; } else if(len === 1) { return arr[0]; } else { return arr[0] + sum(arr.slice(1)) } }
2.forEach迭代
function sum(arr) { let sumArr = arr; let sum = 0; sumArr.forEach((val,index,arr) => { sum += val; },0); return sum; }
3.for循環(huán)累加
function sum(arr) { let arr1 = arr; let sum = 0; for(let i = 0; i< arr1.length; i++) { sum += arr[i]; } return sum; }
利用reduce()方法
function sum(arr) { let arr1 = arr; let sum = arr1.reduce((prev,cur,index,arr) => { return prev + cur; }) return sum; }24.數(shù)組排序
1.冒泡排序
function sortArr(arr) { if(arr.length < 1) { return arr; } for(let i = 0; i自定義數(shù)組的sort方法
function sort(a,b) { return a - b; }3.快速排序
function sortArr(arr) { if(arr.length < 1) { return arr; } let num = arr.splice([Math.floor(arr.length / 2)],1)[0]; let left = [], right = []; for(var i = 0; i < arr.length; i++) { if(arr[i] < num) { left.push(arr[i]); } else { right.push(arr[i]); } } return sortArr(left).concat([num], sortArr(right)); }
文章版權(quán)歸作者所有,未經(jīng)允許請(qǐng)勿轉(zhuǎn)載,若此文章存在違規(guī)行為,您可以聯(lián)系管理員刪除。
轉(zhuǎn)載請(qǐng)注明本文地址:http://systransis.cn/yun/116236.html
摘要:復(fù)習(xí)整理有什么新特性新增語義化標(biāo)簽等新增用于繪畫的元素用于媒介回放的和元素本地緩存有更好支持和是什么,文檔是什么是用來描述網(wǎng)頁的一種超文本標(biāo)記語言,文檔也被成為網(wǎng)頁,它包含標(biāo)簽和純文本是什么它不是標(biāo)簽,它為瀏覽器提供一種信息聲明,告訴瀏覽器 復(fù)習(xí)整理 html 1.html5有什么新特性? 新增語義化標(biāo)簽、等 ? 新增用于繪畫的元素 ? 用于媒介回放的video和aud...
摘要:正如我標(biāo)題所說,簡(jiǎn)歷被拒。看了我簡(jiǎn)歷之后說頭條競(jìng)爭(zhēng)激烈,我背景不夠,點(diǎn)到為止。。三準(zhǔn)備面試其實(shí)從三月份投遞簡(jiǎn)歷開始準(zhǔn)備面試到四月份收,也不過個(gè)月的時(shí)間,但這都是建立在我過去一年的積累啊。 本文是 無精瘋 同學(xué)投稿的面試經(jīng)歷 關(guān)注微信公眾號(hào):進(jìn)擊的java程序員K,即可獲取最新BAT面試資料一份 在此感謝 無精瘋 同學(xué)的分享 目錄: 印象中的頭條 面試背景 準(zhǔn)備面試 ...
摘要:正如我標(biāo)題所說,簡(jiǎn)歷被拒。看了我簡(jiǎn)歷之后說頭條競(jìng)爭(zhēng)激烈,我背景不夠,點(diǎn)到為止。。三準(zhǔn)備面試其實(shí)從三月份投遞簡(jiǎn)歷開始準(zhǔn)備面試到四月份收,也不過個(gè)月的時(shí)間,但這都是建立在我過去一年的積累啊。 本文是 無精瘋 同學(xué)投稿的面試經(jīng)歷 關(guān)注微信公眾號(hào):進(jìn)擊的java程序員K,即可獲取最新BAT面試資料一份 在此感謝 無精瘋 同學(xué)的分享目錄:印象中的頭條面試背景準(zhǔn)備面試頭條一面(Java+項(xiàng)目)頭條...
摘要:雖然有了十全的計(jì)劃,但如何高效率去記住上面那么多東西是一個(gè)大問題,看看我是怎么做的。 前言 前一篇文章講述了我在三月份毫無準(zhǔn)備就去面試的后果,一開始心態(tài)真的爆炸,但是又不服氣,一想到每次回來后家人朋友問我面試結(jié)果的期待臉,越覺得必須付出的行動(dòng)來證明自己了。 面經(jīng)傳送門:一個(gè)1年工作經(jīng)驗(yàn)的PHP程序員是如何被面試官虐的? 下面是我花費(fèi)兩個(gè)星期做的準(zhǔn)備,主要分三部分: 有計(jì)劃——計(jì)劃好...
閱讀 1130·2021-11-25 09:43
閱讀 1648·2021-09-13 10:25
閱讀 2613·2021-09-09 11:38
閱讀 3416·2021-09-07 10:14
閱讀 1728·2019-08-30 15:52
閱讀 651·2019-08-30 15:44
閱讀 3587·2019-08-29 13:23
閱讀 1985·2019-08-26 13:33