前言

騰訊的面試涼了，接著開始面試網(wǎng)易

網(wǎng)易的面試體驗(yàn)挺不錯(cuò)。它的微信公眾號會(huì)給你叫號，前臺(tái)小姐姐也會(huì)提醒你，每一面結(jié)束后都可以找前臺(tái)小姐姐查詢面試結(jié)果。而且食堂超級好吃！還可以邊吃飯邊吸貓！面試地點(diǎn)在一樓大廳。環(huán)境舒適，就是座位有點(diǎn)不夠用。

不多說了，下面分享一下我的面試經(jīng)歷

form表單細(xì)節(jié)

一、表單

1.表單 標(biāo)簽用于為用戶輸入創(chuàng)建 HTML 表單

2.表單能夠包含?input 元素，比如文本字段、復(fù)選框、單選框、提交按鈕等等。

3.表單還可以包含?menus、textarea、fieldset、legend?和?label 元素。

4.表單用于向服務(wù)器傳輸數(shù)據(jù)。

二、表單form 的屬性

（一）action屬性

action 屬性規(guī)定當(dāng)提交表單時(shí)，向何處發(fā)送表單數(shù)據(jù)

**屬性值：**url 鏈接的地址

（二）name屬性

name屬性規(guī)定表單的名稱。?name 屬性提供了一種在腳本中引用表單的方法。

（三）method屬性

method 屬性規(guī)定在提交表單時(shí)所用的HTTP方法（GET 或是 POST）

1、什么時(shí)候使用GET？

method屬性的默認(rèn)值是GET，如果表單的提交是被動(dòng)的（比如搜索引擎查詢），并且沒有敏感信息；

當(dāng)使用GET的時(shí)候，表單數(shù)據(jù)是提交到頁面的地址欄中的。

2、什么時(shí)候使用post？

地址欄中可以儲(chǔ)存的數(shù)據(jù)是有限的，如果想要儲(chǔ)存更多數(shù)據(jù)，更安全的儲(chǔ)存數(shù)據(jù)就需要使用 post

表單正在更新數(shù)據(jù)，或是包含敏感信息（例如密碼）最好使用post；

post 安全性更好，因?yàn)樵陧撁娴刂窓谥刑峤坏臄?shù)據(jù)使不可見的（如果上傳的數(shù)據(jù)比較多或是要上傳圖片，就要使用post）。

（四）legend元素

元素為 元素定義標(biāo)簽

標(biāo)簽 可以將表單內(nèi)的相關(guān)元素分組，還可以在相關(guān)表單元素周圍繪制邊框。 <form><fieldset><legend>Personalia:</legend> Name: <input type="text"><br> Email: <input type="text"><br></fieldset> </form>

input元素必須要加上 name 屬性，定義一個(gè)名字，后臺(tái)才會(huì)正常接收輸入的數(shù)據(jù)；

三、表單描述標(biāo)簽的使用

為input元素定義標(biāo)注

<label for="wenzi">文字</label> <input type="text" id='wenz'></pre>

label 元素不會(huì)向用戶呈現(xiàn)任何特殊效果。不過，它為鼠標(biāo)用戶改進(jìn)了可用性。

如果在 label 元素內(nèi)點(diǎn)擊文本，就會(huì)觸發(fā)此控件，使該控件獲得焦點(diǎn)。當(dāng)用戶選擇該標(biāo)簽時(shí)，瀏覽器就會(huì)自動(dòng)將焦點(diǎn)轉(zhuǎn)到和標(biāo)簽相關(guān)的表單控件上。

標(biāo)簽的 for 屬性應(yīng)當(dāng)與相關(guān)元素的 id 屬性相同。

為了實(shí)現(xiàn)同樣的效果，會(huì)有另一種寫法：不需要 for 和 id 屬性；

<label>文字 <input type="text"> </label></pre>

四、表單約束屬性

（一）required 屬性

required?屬性是一個(gè)布爾屬性，規(guī)定必須在提交表單之前填寫輸入字段，必填字段。（required是H5的新屬性）

**注意：**required 屬性適用于下面的 input 類型：text、search、url、tel、email、password、date pickers、number、checkbox、radio 和 file。

（二）placeholder屬性

placeholder?屬性規(guī)定可描述輸入字段預(yù)期值的簡短的提示信息（ 在輸入框里面的提示文字，內(nèi)容不會(huì)被提交），例如一個(gè)樣本值或是預(yù)期格式的簡短的描述。

placeholder 定義的提示會(huì)在用戶輸入值之前顯示在輸入字段中。

**注意：**placeholder 屬性適用于下面的 input 類型：text、search、url、tel、email 和 password。

（三）value屬性

value?屬性為 input 元素設(shè)定值。對于不同的輸入類型，value屬性的用法也不同。

type類型為button、reset、submit。定義按鈕上顯示的文本；

type類型為text、password、hidden。定義輸入字段的初始值（默認(rèn)值）；

type類型為checkbox、radio、image。定義輸入相關(guān)聯(lián)的值；

注意： 和 中必須設(shè)置 value 屬性。

**注意：**value 屬性無法與 一同使用。

（四）maxlength屬性

maxlength?屬性規(guī)定輸入字段的最大長度，以字符個(gè)數(shù)計(jì)算。

maxlength 屬性與? 或 ?配合使用（有輸入長度）

（五）size屬性

size?屬性規(guī)定以字符數(shù)計(jì)的 元素的可見寬度。

size? 限制表單的長度（不建議用，用CSS去設(shè)置更好）

五、表單訪問限制（表單禁用）

（一）readonly 屬性

readonly?屬性規(guī)定輸入字段為只讀，無法輸入，可以使用value來設(shè)置默認(rèn)值，可以提交到后臺(tái)，但是用戶無法修改。

只讀字段無法修改，不過用戶仍然可以使用tab鍵切換到該字段，還可以選中或拷貝其文本。

readonly 屬性可以防止用戶對值進(jìn)行修改，直到滿足某些條件為止（比如選中了一個(gè)復(fù)選框）。然后，需要使用 JavaScript 消除 readonly 值，將輸入字段切換到可編輯狀態(tài)。

readonly 屬性可與**? 或 **?配合使用。

（二）disabled屬性

disabled?屬性定義應(yīng)該禁用input元素（只能看，不能提交到后臺(tái)）

被禁用的 input元素既不可用，也不可點(diǎn)擊。可以設(shè)置 disabled 屬性，直到滿足某些其他的條件為止（比如選擇了一個(gè)復(fù)選框等等）。然后，就需要通過 JavaScript 來刪除 disabled 值，將 input 元素的值切換為可用。

注意：disabled 屬性無法與??一起使用。

六、常用的字段擴(kuò)展類型

值描述

button	定義可點(diǎn)擊按鈕（多數(shù)情況下，用于通過 JavaScript 啟動(dòng)腳本）。
checkbox	定義復(fù)選框。
file	定義輸入字段和 "瀏覽"按鈕，供文件上傳。
hidden	定義隱藏的輸入字段，雖然隱藏了卻依然存在。
image	定義圖像作為提交按鈕。
password	定義密碼字段。該字段中的字符被掩碼。
radio	定義單選按鈕。
reset	定義重置按鈕。重置按鈕會(huì)清除表單中的所有數(shù)據(jù)。
submit	定義提交按鈕。提交按鈕會(huì)把表單數(shù)據(jù)發(fā)送到服務(wù)器。
text	定義單行的輸入字段，用戶可在其中輸入文本。默認(rèn)寬度為 20 個(gè)字符。

H5新標(biāo)簽

值描述

color	定義拾色器
date	定義 date 控件（包括年、月、日，不包括時(shí)間）
datetime	定義 date 和 time 控件（包括年、月、日、時(shí)、分、秒、幾分之一秒，基于 UTC 時(shí)區(qū)）
datetime-local	定義 date 和 time 控件（包括年、月、日、時(shí)、分、秒、幾分之一秒，不帶時(shí)區(qū)）
email	定義用于 e-mail 地址的字段
month	定義 month 和 year 控件（不帶時(shí)區(qū)）
number	定義用于輸入數(shù)字的字段
range	定義用于精確值不重要的輸入數(shù)字的控件（比如 slider 控件）
search	定義用于輸入搜索字符串的文本字段
tel	定義用于輸入電話號碼的字段
time	定義用于輸入時(shí)間的控件（不帶時(shí)區(qū)）
url	定義用于輸入 URL 的字段
week	定義 week 和 year 控件（不帶時(shí)區(qū)）

七、大量文本和列表

（一）文本域

textarea?標(biāo)簽定義一個(gè)多行的文本輸入控件

文本域中可容納無限數(shù)量的文本，其中的文本的默認(rèn)字體是等寬字體（Courier）

文本域中的默認(rèn)值，要放在一對textarea?標(biāo)簽中

可以通過 cols 和 rows 屬性來規(guī)定 textarea 的尺寸大小，不過更好地·辦法是使用CSS的height 和 width屬性

最后

由于篇幅限制，pdf文檔的詳解資料太全面，細(xì)節(jié)內(nèi)容實(shí)在太多啦，所以只把部分知識(shí)點(diǎn)截圖出來粗略的介紹，每個(gè)小節(jié)點(diǎn)里面都有更細(xì)化的內(nèi)容！有需要的程序猿（媛）可以幫忙點(diǎn)贊+點(diǎn)擊【學(xué)習(xí)資料】即可免費(fèi)領(lǐng)取！

實(shí)在太多啦，所以只把部分知識(shí)點(diǎn)截圖出來粗略的介紹，每個(gè)小節(jié)點(diǎn)里面都有更細(xì)化的內(nèi)容！有需要的程序猿（媛）可以幫忙點(diǎn)贊+點(diǎn)擊【學(xué)習(xí)資料】即可免費(fèi)領(lǐng)取！

[外鏈圖片轉(zhuǎn)存中…(img-OkGVC9fD-1623051913928)]

[外鏈圖片轉(zhuǎn)存中…(img-FuCDVadB-1623051913930)]

總結(jié)

以上是生活随笔為你收集整理的CSS常用五类选择器，经典好文的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯(cuò)，歡迎將生活随笔推薦給好友。