前端面試題--打卡day1

今天在牛客網上刷了一組題,易錯分析
在這裏插入圖片描述
display屬性 :

block : CSS 塊對象的默認值。將對象強制作爲塊對象呈遞,爲對象之後添加新行 可以定義高度和寬度
none : CSS 隱藏對象。與 visibility 屬性的hidden值不同,其不爲被隱藏的對象保留其物理空間
inline : CSS 內聯對象的默認值。將對象強制作爲內聯對象呈遞,從對象中刪除行
inherit 規定應該從父元素繼承 display 屬性的值。

在這裏插入圖片描述
參數是scroll時候,必會出現滾動條。
參數是auto時候,子元素內容大於父元素時出現滾動條。
參數是visible時候,溢出的內容出現在父元素之外。
參數是hidden時候,溢出隱藏。

在這裏插入圖片描述
在html中通過< a>標籤打開一個鏈接,通過 < a> 標籤的 target 屬性規定在何處打開鏈接文檔。
如果在標籤< a>中寫入target屬性,則瀏覽器會根據target的屬性值去打開與其命名或名稱相符的 框架< frame>或者窗口.
在target中還存在四個保留的屬性值如下,

_blank 在新窗口中打開被鏈接文檔。
_self 默認。在相同的框架中打開被鏈接文檔。
_parent 在父框架集中打開被鏈接文檔。
_top 在整個窗口中打開被鏈接文檔。
framename 在指定的框架中打開被鏈接文檔。

這些 target 的所有 4 個值都以下劃線開始。任何其他用一個下劃線作爲開頭的窗口或者目標都會被瀏覽器忽略,因此,不要將下劃線作爲文檔中定義的任何框架 name 或 id 的第一個字符。

在這裏插入圖片描述
此處個人認爲題目不嚴謹,onclick是js事件,jq是click

onfocus 獲得焦點 onblur 失去焦點

在這裏插入圖片描述
Flash提供了ExternalInterface接口與JavaScript通信,ExternalInterface有兩個方法,call和addCallback,call的作用是讓Flash調用js裏的方法,addCallback是用來註冊flash函數讓js調用

在這裏插入圖片描述
alt是html標籤的屬性,而title既是html標籤,又是html屬性。
title標籤這個不用多說,網頁的標題就是寫在

這對標籤之內的。
title作爲屬性時,用來爲元素提供額外說明信息。例如,給超鏈接標籤a添加了title屬性,把鼠標移動到該鏈接上面是,就會顯示title的內容,以達到補充說明或者提示的效果。
而alt屬性則是用來指定替換文字,只能用在img、area和input元素中(包括applet元素),用於網頁中圖片無法正常顯示時給用戶提供文字說明使其瞭解圖像信息。

在這裏插入圖片描述

#0000 是不正確的寫法,至少要爲六位,應該是#FF0000
A寫法是正確的,有兩種寫法:
document.getElementById(“input”).style.backgroundColor = “red”;
inputElement.style.backgroundColor = “#FF0000”;

在這裏插入圖片描述

這裏考察HTML標籤的使用:
< audio> 標籤定義聲音,比如音樂或其他音頻流。 A正確。
< canvas> 標籤定義圖形,比如圖表和其他圖像。< canvas> 標籤只是圖形容器,您必須使用腳本來繪製圖形。 B錯誤,< article>標籤定義外部的內容。比如來自一個外部的新聞提供者的一篇新的文章,或者來自 blog 的文本,或者是來自論壇的文本。亦或是來自其他外部源內容。
< menu> 標籤定義命令的列表或菜單。< menu> 標籤用於上下文菜單、工具欄以及用於列出表單控件和命令。 C正確
command 元素表示用戶能夠調用的命令。< command> 標籤可以定義命令按鈕,比如單選按鈕、複選框或按鈕。只有當 command 元素位於 menu 元素內時,該元素纔是可見的。否則不會顯示這個元素,但是可以用它規定鍵盤快捷鍵。 D正確。

在這裏插入圖片描述
CSS中Position屬性有四個可選值,它們分別是:static、absolute、fixed、relative。

◆position:static 無定位
該屬性值是所有元素定位的默認情況,在一般情況下,我們不需要特別的去聲明它,但有時候遇到繼承的情況,我們不願意見到元素所繼承的屬性影響本身,從而可以用position:static取消繼承,即還原元素定位的默認值。
◆position:absolute 絕對定位
使用position:absolute,能夠很準確的將元素移動到你想要的位置,
◆position:fixed 相對於窗口的固定定位
這個定位屬性值是什麼意思呢?元素的定位方式同absolute類似,但它的包含塊是視區本身。在屏幕媒體如WEB瀏覽器中,元素在文檔滾動時不會在瀏覽器視察中移動。例如,它允許框架樣式佈局。在頁式媒體如打印輸出中,一個固定元素會出現於第一頁的相同位置。這一點可用於生成流動標題或腳註。我們也見過相似的效果,但大都數效果不是通過CSS來實現了,而是應用了JS腳本。
請特別注意,IE6不支持CSS中的position:fixed屬性。真的非常遺憾,要不然我們就可以試試這種酷酷的效果了。
◆position:relative 相對定位
所謂相對定位到底是什麼意思呢,是基於哪裏的相對呢?我們需要明確一個概念,相對定位是相對於元素默認的位置的定位。既然是相對的,我們就需要設置不同的值來聲明定位在哪裏,top、bottom、left、right四個數值配合,來明確元素的位置。

在這裏插入圖片描述

完全一致的意思是,域名要相同(www.example.com和example.com不同),協議要相同(http和https不同),端口號要相同(默認是:80端口,它和:8080就不同)。有的瀏覽器口子鬆一點,允許端口不同,大多數瀏覽器都會嚴格遵守這個限制。
詳情:廖雪峯的教程

在這裏插入圖片描述在這裏插入圖片描述
首先返回的function函數賦值給全局變量f1,因此function函數就被儲存在了內存中,因爲foo函數是function函數的父函數,於是foo函數和局部變量i也被存在了內存。之後f1()被調用了兩次,第一次調用時i=0,因爲是i++,先輸出i的值0,然後再++;第二次調用是i=1,所以先輸出1;而f2是一個新的變量,因此i的值初始化爲0。

在這裏插入圖片描述在這裏插入圖片描述
函數體內,bb並沒有使用var來定義,按理說這個bb在預處理的時候應該是window的屬性。但在這裏,函數聲明的時候,帶了一個參數bb,也就是相當於在函數體內聲明瞭var bb。所以,函數裏的bb就是函數活動對象的屬性。所以函數執行時會輸出2。函數執行完後,函數的活動對象被銷燬,也就是局部的這個bb被刪除了,執行流進入到window,再輸出bb,值就是1了。

在這裏插入圖片描述
A正確;
B是關鍵字;
C有空格;
D開頭爲數字;
第一個字符必須是一個 ASCII 字母(大小寫均可),或一個下劃線(_)。注意第一個字符不能是數字。
後續的字符必須是字母、數字或下劃線。
變量名稱一定不能是 保留字。

在這裏插入圖片描述
此題選B

NaN,即非數值(Not a Number)是一個特殊的數值,這個數值用來表示一個本來要返回數值的操作數未返回數值的情況(這樣就不會拋出錯誤了)。

針對NaN的特點,ECMAScript定義了isNaN()函數。這個函數接受一個參數,該參數可以是任何類型,而函數會幫我們確定這個參數是否“不是數值”。isNaN()在接受一個值後,會嘗試將這個值轉換爲數值。某些不是數值的值會直接轉換爲數值,例如字符串“10”或Boolean值。而任何不能被轉換爲數值的值都會導致這個函數返回true。

在這裏插入圖片描述

常見事件:
1. 點擊事件:
1. onclick:單擊事件
2. ondblclick:雙擊事件
2. 焦點事件
1. onblur:失去焦點
2. onfocus:元素獲得焦點。
3. 加載事件:
1. onload:一張頁面或一幅圖像完成加載。
4. 鼠標事件:
1. onmousedown 鼠標按鈕被按下。
2. onmouseup 鼠標按鍵被鬆開。
3. onmousemove 鼠標被移動。
4. onmouseover 鼠標移到某元素之上。
5. onmouseout 鼠標從某元素移開。
5. 鍵盤事件:
1. onkeydown 某個鍵盤按鍵被按下。
2. onkeyup 某個鍵盤按鍵被鬆開。
3. onkeypress 某個鍵盤按鍵被按下並鬆開。
6. 選擇和改變
1. onchange 域的內容被改變。
2. onselect 文本被選中。
7. 表單事件:
1. onsubmit 確認按鈕被點擊。
2. onreset 重置按鈕被點擊。

在這裏插入圖片描述
1.<!DOCTYPE> 聲明位於文檔中的最前面,處於 標籤之前。告知瀏覽器的解析器,用什麼文檔類型 規範來解析這個文檔。
2.嚴格模式的排版和 JS 運作模式是 以該瀏覽器支持的最高標準運行。在混雜模式中,頁面以寬鬆的向後兼容的方式顯示。模擬老式瀏覽器的行爲以防止站點無法工作。
3.DOCTYPE不存在或格式不正確會導致文檔以混雜模式呈現。

在這裏插入圖片描述
call()方法和apply()方法的作用相同,他們的區別在於接收參數的方式不同。對於call(),第一個參數是this值沒有變化,變化的是其餘參數都直接傳遞給函數。(在使用call()方法時,傳遞給函數的參數必須逐個列舉出來。使用apply()時,傳遞給函數的是參數數組)

如下代碼做出解釋:

function add(c, d){ return this.a + this.b + c + d; } var o = {a:1, b:3};
add.call(o, 5, 7); // 1 + 3 + 5 + 7 = 16
add.apply(o, [10, 20]);// 1 + 3 + 10 + 20 = 34

在這裏插入圖片描述
C,D
C:當定義border:none時,表示無邊框樣式,瀏覽器並不會對邊框進行渲染,也就沒有實際的寬度;
D:定義邊框時,除了設置寬度外,還必須設置邊框的樣式才能顯示出來。

在這裏插入圖片描述
CSS Sprites在國內很多人叫css精靈,是一種網頁圖片應用處理方式。它允許你將一個頁面涉及到的所有零星圖片都包含到一張大圖中去,這樣一來,當訪問該頁面時,載入的圖片就不會像以前那樣一幅一幅地慢慢顯示出來了。
利用CSS的“background-image”,“background- repeat”,“background-position”的組合進行背景定位,background-position可以用數字精確的定位出背景圖片的位置。
利用CSS Sprites能很好地減少網頁的http請求,從而大大的提高頁面的性能,這也是CSS Sprites最大的優點,也是其被廣泛傳播和應用的主要原因;
CSS Sprites能減少圖片的字節,曾經比較過多次3張圖片合併成1張圖片的字節總是小於這3張圖片的字節總和。所以C錯誤
解決了網頁設計師在圖片命名上的困擾,只需對一張集合的圖片上命名就可以了,不需要對每一個小元素進行命名,從而提高了網頁的製作效率。
更換風格方便,只需要在一張或少張圖片上修改圖片的顏色或樣式,整個網頁的風格就可以改變。維護起來更加方便。

在這裏插入圖片描述
Wekbit是一個開源的Web瀏覽器引擎,也就是瀏覽器的內核。Apple的Safari, Google的Chrome, Nokia S60平臺的默認瀏覽器,Apple手機的默認瀏覽器,Android手機的默認瀏覽器均採用的Webkit作爲器瀏覽器內核。Webkit的採用程度由 此可見一斑,理所當然的成爲了當今主流的三大瀏覽器內核之一。另外兩個分別是Gecko和Trident,大名鼎鼎的Firefox便是使用的Gecko 內核,而微軟的IE系列則使用的是Trident內核。
另外,搜狗瀏覽器是雙核的,雙核並不是指一個頁面由2個內核同時處理,而是所有網頁(通常是標準通用標記語言的應用超文本標記語言)由webkit內核處理,只有銀行網站用IE內核

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章