北京
很多人以為HTML和CSS就是搭積木，直到面試官開(kāi)始追問(wèn)細(xì)節(jié)。以下是八個(gè)常被忽略的基礎(chǔ)考點(diǎn)，看完你可能要重新翻文檔。
一、div與span的本質(zhì)區(qū)別
div是塊級(jí)容器，用來(lái)劃分文檔的大塊區(qū)域；span是行內(nèi)容器，標(biāo)記文本片段。關(guān)鍵差異不在外觀(guān)，而在默認(rèn)的display屬性——前者獨(dú)占一行，后者跟隨文本流。兩者都靠class或id掛樣式，但選擇用誰(shuí)，取決于你要包裹的是結(jié)構(gòu)還是語(yǔ)義化的文本片段。
二、class的命名與調(diào)用規(guī)則
CSS里用點(diǎn)號(hào)前綴選中class，比如.write{}。一個(gè)元素可以?huà)於鄠€(gè)class，空格分隔。但id是身份證，class是類(lèi)別標(biāo)簽——這是面試常考的區(qū)分點(diǎn)。
三、id的三條硬約束
id名稱(chēng)區(qū)分大小寫(xiě)；至少一個(gè)字符；不能以數(shù)字開(kāi)頭；不能含空格或制表符。文檔中id必須唯一，這是很多人寫(xiě)代碼時(shí)隨手打破的規(guī)則。
四、label的for屬性給誰(shuí)用
for屬性關(guān)聯(lián)input的id，讓屏幕閱讀器在輸入框聚焦時(shí)朗讀標(biāo)簽文本。這不是給開(kāi)發(fā)者看的，是給視障用戶(hù)的輔助技術(shù)用的。忽略它，你的表單在無(wú)障礙檢測(cè)里會(huì)直接掛掉。
五、name屬性的真正場(chǎng)景
name不是給CSS用的，是表單提交時(shí)的數(shù)據(jù)鍵名。沒(méi)有name，后端收不到這個(gè)字段的值。這是前端新手最容易混淆name和id的地方。
六、GET與POST的邊界
用外賣(mài)App舉例：瀏覽菜單是GET，參數(shù)拼在URL里；下單支付是POST，數(shù)據(jù)放在請(qǐng)求體。GET有長(zhǎng)度限制且暴露參數(shù)，POST適合敏感或大量數(shù)據(jù)的傳輸。
七、value與readonly的隱藏行為
value給輸入框預(yù)設(shè)初始值。readonly鎖住用戶(hù)編輯，但表單提交時(shí)這個(gè)值照樣發(fā)往后端。disabled則是完全禁用，數(shù)據(jù)不會(huì)進(jìn)入提交隊(duì)列。一字之差，行為天差地別。
這八條沒(méi)有一條涉及框架或工程化，但面試卡人往往就卡在這里。基礎(chǔ)不牢，地動(dòng)山搖。
特別聲明：以上內(nèi)容(如有圖片或視頻亦包括在內(nèi))為自媒體平臺(tái)“網(wǎng)易號(hào)”用戶(hù)上傳并發(fā)布，本平臺(tái)僅提供信息存儲(chǔ)服務(wù)。
Notice: The content above (including the pictures and videos if any) is uploaded and posted by a user of NetEase Hao, which is a social media platform and only provides information storage services.
