時間:2023-09-08 21:06:01 | 來源:網(wǎng)站運營
時間:2023-09-08 21:06:01 來源:網(wǎng)站運營
重學前端系列之 HTML面試題(更新中......):JS
引擎 CSS
等),以及計算網(wǎng)頁的顯示方式,然后會輸出至顯示器或打印機。瀏覽器內(nèi)核的不同對于網(wǎng)頁的語法解釋會有不同,所以渲染的效果也不相同。所有網(wǎng)頁瀏覽器、電子郵件客戶端以及其他需要編輯、顯示網(wǎng)絡內(nèi)容的應用程序都需要內(nèi)核。js
引擎:解析和執(zhí)行javascript
來實現(xiàn)網(wǎng)頁的動態(tài)效果。JS
引擎并沒有區(qū)分的很明確,后來JS
引擎越來越獨立,內(nèi)核就傾向于只指渲染引擎。Edge:EdgeHTML
IE:Trident
firefox:Gecko
chrom、safari:webkit
Opera:Presto
html
語義化讓頁面的內(nèi)容結(jié)構(gòu)化,結(jié)構(gòu)更加清晰,便于對瀏覽器、搜索引擎解析。CSS
的情況下也以一種文檔格式顯示,并且是容易閱讀的。SEO
。html
語義化主要指的是我們應該使用合適的標簽來劃分網(wǎng)頁內(nèi)容的結(jié)構(gòu)。html
的本質(zhì)作用其實就是定義網(wǎng)頁文檔的結(jié)構(gòu)。html
標簽來確定上下文和各個關(guān)鍵字的權(quán)重,一個語義化的文檔對爬蟲來說是友好的。有利于爬蟲對文檔內(nèi)容的解讀,從而有利于我們網(wǎng)站的seo
,從html5
可以看出,標準是傾向于以語義化的方式來構(gòu)建網(wǎng)頁的,新增語義標簽,刪除沒有語義的標簽。css
------->合適的標簽來表達正確的含義的頁面結(jié)構(gòu)Doctype
你知道是干什么的么·<!DOCTYPE>
聲明位于文檔最前面的位置,處于標簽之前。此標簽可告知瀏覽器文檔使用哪種HTML規(guī)范。(重點:告訴瀏覽器按照何種規(guī)范解析頁面)css
的布局較table布局有什么優(yōu)點css
文件。seo
)搜索引擎更友好,排名更容易靠前。img
的alt與title有何異同?strong與em的異同? 首先:CSS規(guī)范規(guī)定,每個元素都有display屬性,確定該元素的類型,每個元素都有默認的display值,如div的display默認值為“block”,則為“塊級”元素;span默認display屬性值為“inline”,是“行內(nèi)”元素。常用的塊狀元素有:<div>、<p>、<h1>...<h6>、<ol>、<ul>、<dl>、<table>、<address>、<blockquote> 、<form>常用的內(nèi)聯(lián)元素有:<a>、<span>、<br>、<i>、<em>、<strong>、<label>、<q>、<var>、<cite>、<code>常用的內(nèi)聯(lián)塊狀元素有:<img>、<input> 知名的空元素:<br/> <hr/> <img/> <input/> <link/><meta/> 鮮為人知的是:<area> <base> <col> <command> <embed><keygen> <param> <source> <track> <wbr>
src
和 href
的區(qū)別href
是超文本引用,它是指向資源的位置,建立與目標文件的聯(lián)系;src
目的是把資源下載到頁面中;瀏覽器解析 href
不會阻塞對文檔的處理(這就是官方建議使用 link 引入而不是 @ import 的原因),src
會阻塞對文檔的處理。HTML5
為什么只需要寫 <doctype>
? HTML5 不基于 SGML,因此不需要對DTD進行引用,但是需要doctype來規(guī)范瀏覽器的行為(讓瀏覽器按照它們應該的方式來運行); 而HTML4.01基于SGML,所以需要對DTD進行引用,才能告知瀏覽器文檔所使用的文檔類型。
(1)link屬于XHTML標簽,除了加載CSS外,還能用于定義RSS, 定義rel連接屬性等作用;而@import是CSS提供的,只能用于加載CSS; (2)頁面被加載的時,link會同時被加載,而@import引用的CSS會等到頁面被加載完再加載; (3)import是CSS2.1 提出的,只在IE5以上才能被識別,而link是XHTML標簽,無兼容問題; (4)link支持使用js控制DOM去改變樣式,而@import不支持;
html5
有哪些新特性、移除了那些元素?如何處理HTML5
新標簽的瀏覽器兼容問題?如何區(qū)分 HTML 和 HTML5
? * HTML5 現(xiàn)在已經(jīng)不是 SGML 的子集,主要是關(guān)于圖像,位置,存儲,多任務等功能的增加。 繪畫 canvas; 用于媒介回放的 video 和 audio 元素; 本地離線存儲 localStorage 長期存儲數(shù)據(jù),瀏覽器關(guān)閉后數(shù)據(jù)不丟失; sessionStorage 的數(shù)據(jù)在瀏覽器關(guān)閉后自動刪除; 語意化更好的內(nèi)容元素,比如 article、footer、header、nav、section; 表單控件,calendar、date、time、email、url、search; 新的技術(shù)webworker, websocket, Geolocation; 移除的元素: 純表現(xiàn)的元素:basefont,big,center,font, s,strike,tt,u; 對可用性產(chǎn)生負面影響的元素:frame,frameset,noframes; * 支持HTML5新標簽: IE8/IE7/IE6支持通過document.createElement方法產(chǎn)生的標簽, 可以利用這一特性讓這些瀏覽器支持HTML5新標簽, 瀏覽器支持新標簽后,還需要添加標簽默認的樣式。 當然也可以直接使用成熟的框架、比如html5shim; <!--[if lt IE 9]> <script> src="http://html5shim.googlecode.com/svn/trunk/html5.js"</script> <![endif]--> * 如何區(qū)分HTML5: DOCTYPE聲明/新增的結(jié)構(gòu)元素/功能元素
HTML5
的離線儲存怎么使用,工作原理能不能解釋一下? 在用戶沒有與因特網(wǎng)連接時,可以正常訪問站點或應用,在用戶與因特網(wǎng)連接時,更新用戶機器上的緩存文件。 原理:HTML5的離線存儲是基于一個新建的.appcache文件的緩存機制(不是存儲技術(shù)),通過這個文件上的解析清單離線存儲資源,這些資源就會像cookie一樣被存儲了下來。之后當網(wǎng)絡在處于離線狀態(tài)下時,瀏覽器會通過被離線存儲的數(shù)據(jù)進行頁面展示。 如何使用: 1、頁面頭部像下面一樣加入一個manifest的屬性; 2、在cache.manifest文件的編寫離線存儲的資源; CACHE MANIFEST #v0.11 CACHE: js/app.js css/style.css NETWORK: resourse/logo.png FALLBACK: / /offline.html 3、在離線狀態(tài)時,操作window.applicationCache進行需求實現(xiàn)。
HTML5
的離線儲存資源進行管理和加載的呢? 在線的情況下,瀏覽器發(fā)現(xiàn)html頭部有manifest屬性,它會請求manifest文件,如果是第一次訪問app,那么瀏覽器就會根據(jù)manifest文件的內(nèi)容下載相應的資源并且進行離線存儲。如果已經(jīng)訪問過app并且資源已經(jīng)離線存儲了,那么瀏覽器就會使用離線的資源加載頁面,然后瀏覽器會對比新的manifest文件與舊的manifest文件,如果文件沒有發(fā)生改變,就不做任何操作,如果文件改變了,那么就會重新下載文件中的資源并進行離線存儲。 離線的情況下,瀏覽器就直接使用離線存儲的資源。
sessionStorage
和 localStorage
的區(qū)別? cookie是網(wǎng)站為了標示用戶身份而儲存在用戶本地終端(Client Side)上的數(shù)據(jù)(通常經(jīng)過加密)。 cookie數(shù)據(jù)始終在同源的http請求中攜帶(即使不需要),記會在瀏覽器和服務器間來回傳遞。 sessionStorage和localStorage不會自動把數(shù)據(jù)發(fā)給服務器,僅在本地保存。 存儲大小: cookie數(shù)據(jù)大小不能超過4k。 sessionStorage和localStorage 雖然也有存儲大小的限制,但比cookie大得多,可以達到5M或更大。 有期時間: localStorage 存儲持久數(shù)據(jù),瀏覽器關(guān)閉后數(shù)據(jù)不丟失除非主動刪除數(shù)據(jù); sessionStorage 數(shù)據(jù)在當前瀏覽器窗口關(guān)閉后自動刪除。 cookie 設置的cookie過期時間之前一直有效,即使窗口或瀏覽器關(guān)閉
iframe
有那些缺點? *iframe會阻塞主頁面的Onload事件; *搜索引擎的檢索程序無法解讀這種頁面,不利于SEO; *iframe和主頁面共享連接池,而瀏覽器對相同域的連接有限制,所以會影響頁面的并行加載。 使用iframe之前需要考慮這兩個缺點。如果需要使用iframe,最好是通過javascript 動態(tài)給iframe添加src屬性值,這樣可以繞開以上兩個問題。
Label
的作用是什么?是怎么用的? label標簽來定義表單控制間的關(guān)系,當用戶選擇該標簽時,瀏覽器會自動將焦點轉(zhuǎn)到和標簽相關(guān)的表單控件上。 <label for="Name">Number:</label> <input type=“text“name="Name" id="Name"/> <label>Date:<input type="text" name="B"/></label>
HTML5
的form如何關(guān)閉自動完成功能? 給不想要提示的 form 或某個 input 設置為 autocomplete=off。
WebSocket、SharedWorker; 也可以調(diào)用localstorge、cookies等本地存儲方式; localstorge另一個瀏覽上下文里被添加、修改或刪除時,它都會觸發(fā)一個事件, 我們通過監(jiān)聽事件,控制它的值來進行頁面信息通信; 注意quirks:Safari 在無痕模式下設置localstorge值時會拋出 QuotaExceededError 的異常;
1、map+area或者svg 2、border-radius 3、純js實現(xiàn) 需要求一個點在不在圓上簡單算法、獲取鼠標坐標等等
1px
高的線,在不同瀏覽器的標準模式與怪異模式下都能保持一致的效果。 <div style="height:1px;overflow:hidden;background:red"></div>
區(qū)分用戶是計算機還是人的公共全自動程序。可以防止惡意破解密碼、刷票、論壇灌水; 有效防止黑客對某一個特定注冊用戶用特定程序暴力破解方式進行不斷的登陸嘗試。
title
與h1
的區(qū)別、b與strong的區(qū)別、i與em的區(qū)別? title屬性沒有明確意義只表示是個標題,H1則表示層次明確的標題,對頁面信息的抓取也有很大的影響; strong是標明重點內(nèi)容,有語氣加強的含義,使用閱讀設備閱讀網(wǎng)絡時:<strong>會重讀,而<B>是展示強調(diào)內(nèi)容。 i內(nèi)容展示為斜體,em表示強調(diào)的文本; Physical Style Elements -- 自然樣式標簽 b, i, u, s, pre Semantic Style Elements -- 語義樣式標簽 strong, em, ins, del, code 應該準確使用語義樣式標簽, 但不能濫用, 如果不能確定時首選使用自然樣式標簽。
w3c
的理解和認識css
和js
,使結(jié)構(gòu)、樣式、行為分離HTML、XHTML
有什么區(qū)別html
是一種基于web網(wǎng)頁的設計語言,xhtml
是一種基于xml
、語法嚴格、標準的設計語言XHTML
元素必須正確的嵌套,元素必須關(guān)閉,標簽必須小寫,必須有根元素,html
沒有這些限制iframe
有哪些優(yōu)點<a href="www.xxx.com">ssss</a>
<a href="mailo:123456@qq.com">ssss</a>
關(guān)鍵詞:試題,更新,系列
微信公眾號
版權(quán)所有? 億企邦 1997-2025 保留一切法律許可權(quán)利。