當前位置:首頁 » 網頁前端 » 1xweb前端題目
擴展閱讀
webinf下怎麼引入js 2023-08-31 21:54:13
堡壘機怎麼打開web 2023-08-31 21:54:11

1xweb前端題目

發布時間: 2022-12-16 06:33:53

1. 1+xweb前端開發高級刷題能過不

1+xweb前端開發高級刷題不能過。1+xweb前端開發高級屬於前端開發編程的資格證書,編程主要是演算法和思維的集合,光靠刷題是過不了的,編程都不是固定的需求,只靠刷題記住固定模式的話在不同的需求之下就會傻眼,需要在不同的需求下思考怎麼樣才能達成結果才是最有效的,所以1+xweb前端開發高級刷題不能過。

2. Web前端題目

答案是D,
Visual Basic電腦版是一種由微軟公司開發的包含協助開發環境的事件驅動編程語言。

3. web前端面試題@二(Keeplive、V-show和v-if的區別、同源策略及跨域)

            在vue中,我們使用component內置組件或者vue-router切換視圖的時候,由於vue會主動卸載不使用的組件,所以我們不能保存組件之前的狀態,而我們經常能遇到需要保存之前狀態的需求,例如:搜索頁(保存搜索記錄),列表頁(保存之前的瀏覽記錄)等等。

            Keep-alive是一個vue的內置組件,它能將不活動的組件保存下來,而不是直接銷毀,當我們再次訪問這個組件的時候,會先從keep-alive中存儲的組件中尋找,如果有緩存的話,直接渲染之前緩存的,如果沒有的話,再載入對應的組件。

            作為抽象組件,keep-alive是不會直接渲染在DOM中的。

        Keep-alive提供了三種可選屬性

        Include-字元串或數組或正則表達式。只有名稱匹配的組件被緩存。

        Exclude -字元串或數組或正則表達式。名稱匹配的組件不會被緩存。

        Max -數字類型。表示最多可以緩存多少組件實例。

        Keep-alive提供了兩個生命鉤子,分別是activated與 deactivated。

        因為Keep-alive會將組件保存在內存中,並不會銷毀以及重新創建,所以不會重新調用組件的created等方法,需要用activated與deactivated這兩個生命鉤子來得知當前組件是否處於活動狀態。

        V-show有較高的渲染成本,

        V-if有較高的切換成本。

        V-if是真正的條件渲染,確保切換過程中條件內的事件監聽器和子組件適當的被銷毀和重建。

        V-show的元素始終被渲染並保存在dom中,操作的只是display屬性控制演示影藏。

        源(origin)—— 就是協議、域名和埠號。若地址裡面的協議、域名和埠號均相同則屬於同源。

        同源策略——同源策略是瀏覽器的一個安全功能,不同源的客戶端腳本在沒有明確授權的情況下,不能讀寫對方資源。所以a.com下的js腳本採用ajax讀取b.com裡面的文件數據是會報錯的。

    不受同源策略限制的

            1.頁面中的鏈接,重定向以及表單提交是不會受到同源策略限制的。

            2.跨域資源的引入是可以的。但是js不能讀寫載入的內容。如嵌入到頁面中的<script src="..."></script>,<img>,<link>,<iframe>等。

     跨域——只要協議、域名、埠號有一個不同就是跨域。

        跨域的原因?(只做了解)

跨域問題來源於JavaScript的同源策略,即只有 協議+主機名+埠號(如存在)相同,則允許相互訪問。為了防止某域名下的介面被其他域名下的網頁非法調用,是瀏覽器對JavaScript施加的安全限制。也就是說JavaScript只能訪問和操作自己域下的資源,不能訪問和操作其他域下的資源。跨域問題是針對JS和ajax的,html本身沒有跨域問題,比如a標簽、script標簽、甚至form標簽(可以直接跨域發送數據並接收數據)等。

       1、 Jsonp——

                利用script標簽可跨域的特點,在跨域腳本中可以直接回調當前腳本的函數。jsonp是一種常用的跨域手段,和反向代理,服務端做跨域處理相比,jsonp更顯得方便輕巧 jsonp的缺點只能發送get請求。因為script只能發送get請求需要後台配合。此種請求方式應該前後端配合,將返回結果包裝成callback(result)的形式。

       2、 Cors——

                伺服器設置HTTP響應頭中Access-Control-Allow-Origin值,解除跨域限制。CORS 是一個W3C標准,全稱是"跨域資源共享"(Cross-origin resource sharing),他允許瀏覽器向跨源伺服器發送XMLHttpRequest請求,從而克服 AJAX 只能同源使用的限制

                缺點是:目前所有最新瀏覽器都支持該功能,但是萬惡的IE不能低於10

Access-Control-Allow-Origin 這個欄位是必須的,表示接受那些域名的請求(*為所有)、Access-Control-Allow-Credentials 該欄位可選, 表示是否可以發送cookie、Access-Control-Expose-Headers 該欄位可選,XHMHttpRequest對象的方法只能夠拿到六種欄位: Cache-Control、Content-Language、Content-Type、Expires、Last-Modified、Pragma ,如果想拿到其他的需要使用該欄位指定。

       3、反向代理(Reverse Proxy){前端獨立就能解決的跨域方案}——

    指以代理伺服器來接受internet上的連接請求,然後將請求轉發給內部網路上的伺服器,並將從伺服器上得到的結果返回給internet上請求連接的客戶端,此時代理伺服器對外就表現為一個反向代理伺服器。

    

4. WEB前端面試題

第二章 面試題基礎篇

2.1 HTML面試題

面試題:行內元素有哪些?塊級元素有哪些? 空(void)元素有那些?

面試題:頁面導入樣式時,使用link和@import有什麼區別?

面試題:title與h1的區別、b與strong的區別、i與em的區別?

面試題:img標簽的title和alt有什麼區別?

面試題:png、jpg、gif 這些圖片格式解釋一下,分別什麼時候用?

2.2 CSS面試題

面試題:css背景紋路

面試題:介紹一下CSS的盒子模型

面試題:CSS選擇符有哪些?哪些屬性可以繼承?

面試題:CSS優先順序演算法如何計算?

面試題:用CSS畫一個三角形

面試題:一個盒子不給寬度和高度如何水平垂直居中?

面試題:display有哪些值?說明他們的作用。

面試題:對BFC規范(塊級格式化上下文:block formatting context)的理解?

面試題:清除浮動有哪些方式?

面試題:在網頁中的應該使用奇數還是偶數的字體?為什麼呢?

面試題:寫一個左中右布局占滿屏幕,其中左、右倆塊固定寬200,中間自適應寬,要求先載入中間塊,請寫出結構及樣式。

面試題:什麼是CSS reset?

面試題:css sprite是什麼,有什麼優缺點

面試題:display: none;與visibility: hidden;的區別

面試題:position有哪些值?有什麼作用? 【特別多公司問】

面試題:line-height和height有什麼區別?

面試題:opacity 和 rgba區別

2.3 JavaScript基礎面試題

面試題:延遲載入JS有哪些方式?

面試題:JS數據類型有哪些?

面試題:null和undefined的區別

面試題:JS數據類型考題

面試題:==和===有什麼不同

面試題:JS微任務和宏任務

面試題:JS作用域考題

面試題:JS對象考題

面試題:JS作用域+this指向+原型 考題

面試題:JS判斷變數是不是數組,你能寫出哪些方法?

面試題:slice是幹嘛的、splice是否會改變原數組

面試題:JS數組去重

面試題:找出多維數組最大值

面試題:給字元串新增方法實現功能

面試題:找出字元串出現最多次數的字元以及次數

2.4 真正移動端 —— H5/C3面試題

面試題:什麼是語義化標簽

面試題:::before 和 :after中雙冒號和單冒號 有什麼區別?解釋一下這2個偽元素的作用。

面試題:如何關閉iOS鍵盤首字母自動大寫

面試題:怎麼讓Chrome支持小於12px 的文字?

面試題:rem和em有什麼樣區別

面試題:ios系統中元素被觸摸時產生的半透明灰色遮罩怎麼去掉

面試題:webkit表單輸入框placeholder的顏色值能改變嗎?

面試題:禁止ios 長按時不觸發系統的菜單,禁止ios&android長按時下載圖片

面試題:禁止ios和android用戶選中文字

面試題:自適應 [淘寶無線適配]

面試題:響應式

第三章 面試題進階篇

3.1 JavaScript進階面試題

面試題:new操作符具體做了什麼

面試題:閉包 【必須會】

面試題:原型鏈 【必須會】

面試題: JS繼承有哪些方式

面試題:說一下call、apply、bind區別

面試題:sort背後原理是什麼?

面試題:深拷貝和淺拷貝

面試題:localstorage、sessionstorage、cookie的區別

3.2 ES6面試題

面試題:var、let、const區別

面試題:作用域考題

面試題:將下列對象進行合並

面試題:箭頭函數和普通函數有什麼區別?

面試題:Promise有幾種狀態

面試題:find和filter的區別 【大廠】

面試題:some和every的區別 【大廠】

3.3 webpack面試題

面試題:webpack插件

3.4 Git面試題

面試題:git常用命令

面試題:解決沖突

面試題:GitFlow

第四章 面試題框架篇

4.1 區分初中高級的 —— Vue面試題

面試題:Vue2.x 生命周期有哪些?

1.系統自帶八個

2.當一旦進入到某個組件會執行哪些生命周期

3.$el和$data在哪個階段有

4.如果使用keep-alive會多倆個生命周期

5.如果加入keep-alive第一次進入組件會執行哪些生命周期

6.如果加入keep-alive第二次或者第N進入該組件會執行哪些生命周期

面試題:談談你對keep-alive的了解

面試題:v-if和v-show區別

面試題:v-if和v-for優先順序 2.x

面試題:ref是什麼?

面試題:nextTick是什麼?

面試題:Vue中如何做樣式穿透

面試題:scoped原理

面試題:Vuex是單向數據流還是雙向數據流?

面試題:講一下MVVM

面試題:雙向綁定原理

面試題:什麼是虛擬DOM

面試題:key是干什麼?

面試題:diff演算法

面試題:Vue組件傳值

面試題:props和data優先順序誰高?

面試題:computed、methods、watch有什麼區別?

面試題:Vuex

面試題:Vue路由

面試題:Vue項目打包後出現空白頁

4.2 微信小程序面試題

面試題:如何自定義頭部?

面試題:如何自定義底部?

4.3 uni-app面試題

面試題:生命周期

面試題:條件編譯

第五章 面試題性能優化篇

5. 誰能給我出一兩道 web前端筆試題 上機題啥的,呵呵,比較常考的

[面試題] 某企業前端開發面試題

【HTML & CSS】

1. Doctype? 嚴格模式與混雜模式-如何觸發這兩種模式,區分它們有何意義?

2. 行內元素有哪些?塊級元素有哪些?CSS的盒模型?

3. CSS引入的方式有哪些? link和@import的區別是?

4. CSS選擇符有哪些?哪些屬性可以繼承?優先順序演算法如何計算?內聯和important哪個優先順序高?

5. 前端頁面有哪三層構成,分別是什麼?作用是什麼?

6. css的基本語句構成是?

7. 你做的頁面在哪些流覽器測試過?這些瀏覽器的內核分別是什麼?經常遇到的瀏覽器的兼容性有哪些?怎麼會出現?解決方法是什麼?

8. 如何居中一個浮動元素?

9. 有沒有關注HTML5和CSS3?如有請簡單說一些您對它們的了解情況!

10. 你怎麼來實現下面這個設計圖,主要講述思路 (效果圖省略)

11. 如果讓你來製作一個訪問量很高的大型網站,你會如何來管理所有CSS文件、JS與圖片?

12. 你對前端界面工程師這個職位是怎麼樣理解的?它的前景會怎麼樣?

【Javascript】

1. js是什麼,js和html 的開發如何結合?

2. 怎樣添加、移除、移動、復制、創建和查找節點

3. 怎樣使用事件以及IE和DOM事件模型之間存在哪些主要差別

4. 面向對象編程:b怎麼繼承a

5. 看看下面alert的結果是什麼
view sourceprint?1.function b(x, y, a) {
.arguments[2] = 10;
.alert(a);
}
b(1, 2, 3);
如果函數體改成下面,結果又會是什麼?
a = 10;
alert(arguments[2] );

6. 請編寫一個JavaScript函數 parseQueryString,它的用途是把URL參數解析為一個對象
var obj = parseQueryString(url);
alert(obj.key0) // 輸出0

7. ajax是什麼? ajax的交互模型? 同步和非同步的區別? 如何解決跨域問題?

8. 什麼是閉包?下面這個ul,如何點擊每一列的時候alert其index?
<ul id=」test」>
<li>這是第一條</li><li>這是第二條</li><li>這是第三條</li>
</ul>

9. 最近看的一篇Javascript的文章是?

10. 常使用的庫有哪些?常用的前端開發工具?開發過什麼應用或組件?

11.說說YSlow(可以詳細一點)

答案在參考資料裡面可以找到,答案在參考資料裡面可以找到,答案在參考資料裡面可以找到

6. 常見的web前端面試題及答案分享

1、 說下行內元素和塊級元素的區別?行內塊元素的兼容性使用?(IE8 以下)


答:行內元素:會在水平方向排列,不能包含塊級元素,設置width無效,height無效(可以設置line-height),margin上下無效,padding上下無效。塊級元素:各占據一行,垂直方向排列。從新行開始結束接著一個斷行。兼容性:display:inline-block;*display:inline;*zoom:1。



2、box-sizing常用的屬性有哪些?分別有什麼作用?


答:box-sizing: content-box|border-box|inherit。content-box:寬度和高度分別應用到元素的內容框。在寬度和高度之外繪制元素的內邊距和邊框(元素默認效果)。


border-box:元素指定的任何內邊距和邊框都將在已設定的寬度和高度內進行繪制。通過從已設定的寬度和高度分別減去邊框和內邊距才能得到內容的寬度和高度。


3、Doctype作用?標准模式與兼容模式各有什麼區別?


答:告知瀏覽器的解析器用什麼文檔標准解析這個文檔。DOCTYPE不存在或格式不正確會導致文檔以兼容模式呈現。


標准模式的排版和JS運作模式都是以該瀏覽器支持的最高標准運行。在兼容模式中,頁面以寬松的向後兼容的方式顯示,模擬老式瀏覽器的行為以防止站點無法工作。


4、html5有哪些新特性?如何處理HTML5新標簽的瀏覽器兼容問題?如何區分 HTML 和 HTML5?


答:HTML5 現在已經不是 SGML 的子集,主要是關於圖像,位置,存儲,多任務等功能的增加。


(1)繪畫 canvas;


(2)用於媒介回放的 video 和 audio 元素;


(3)本地離線存儲 localStorage 長期存儲數據,瀏覽器關閉後數據不丟失;


(4)sessionStorage 的數據在瀏覽器關閉後自動刪除;


(5)語意化更好的內容元素,比如 article、footer、header、nav、section;


(6)表單控制項,calendar、date、time、email、url、search;


(7)新的技術webworker, websocket, Geolocation;


IE8/IE7/IE6支持通過document.createElement方法產生的標簽,可以利用這一特性讓這些瀏覽器支持HTML5新標簽,瀏覽器支持新標簽後,還需要添加標簽默認的樣式。當然也可以直接使用成熟的框架、比如html5shim。


以上就是環球青藤小編關於web前端面試題的相關分享,希望對大家有所幫助,想要了解更多相關內容,請及時關注本平台並進行查看!