HTML里的name與id與class到底有什么不同
發(fā)表時(shí)間:2023-09-22 來源:明輝站整理相關(guān)軟件相關(guān)文章人氣:
[摘要]這次給大家?guī)鞨TML里的name與id和class到底有什么不同,怎么使用name,id,class?使用name,id,class的注意事項(xiàng)有哪些,下面就是實(shí)戰(zhàn)案例,一起來看一下。name指定標(biāo)簽的名稱。格式<input type="text" name="...
這次給大家?guī)鞨TML里的name與id和class到底有什么不同,怎么使用name,id,class?使用name,id,class的
注意事項(xiàng)有哪些,下面就是實(shí)戰(zhàn)案例,一起來看一下。
name
指定標(biāo)簽的名稱。
格式
<input type="text" name="username" />
應(yīng)用場景
①form表單:name可作為轉(zhuǎn)遞給服務(wù)器表單列表的變量名;如上面的傳到服務(wù)器的名稱為:username='text的值'。
②input type='radio'單選標(biāo)簽:把幾個(gè)單選標(biāo)簽的 name設(shè)為一個(gè)相同值時(shí),將會進(jìn)行單選操作。
<input type="radio" name='sex'/>男
<input type="radio" name='sex'/>女
③快速獲取一組name相同的標(biāo)簽:獲取擁有相同name的標(biāo)簽,一起進(jìn)行操作,如:更改屬性、注冊事件等。
function changtxtcolor() {
var txts = document.getElementsByName('txtcolor'); //獲取所有name=txtcolor 的標(biāo)簽
for (var i = 0; i < txts.length; i++) { //循環(huán)遍歷標(biāo)簽,并把背景色改為red
txts[i].style.backgroundColor = 'red';
}
}
特性
name屬性的值,在當(dāng)前page頁面中并非唯一性。
id
指定標(biāo)簽的唯一標(biāo)識。
格式
<input type=password id="userpwd" />
應(yīng)用場景
①根據(jù)提供的唯一id號,快速獲取標(biāo)簽對象。如:document.getElementById(id)
②用于充當(dāng)label標(biāo)簽for屬性的值:示例:<label for='userid'>用戶名:</label>,表示單擊此label標(biāo)簽時(shí),id為userid的標(biāo)簽獲得焦點(diǎn)。
特性
id屬性的值,在當(dāng)前的page頁面要是唯一的。
class
指定標(biāo)簽的類名。
格式
<input type=button class="btnsubmit" />
應(yīng)用場景
①CSS操作,把一些特定樣式放到一個(gè)class類中,需要此樣式的標(biāo)簽,可以在添加此類。
特性
可以把多個(gè)類,放在一個(gè)class屬性里,但必須用空格隔開;如:class='btnsubmit btnopen'
相信看了這些案例你已經(jīng)掌握了方法,更多精彩請關(guān)注php中文網(wǎng)其它相關(guān)文章!
相關(guān)閱讀:
怎樣在HTML網(wǎng)頁中插入視頻
如何使用HTML+CSS做出鼠標(biāo)劃過就可以顯示二級菜單欄
H5里圖片中有縫隙應(yīng)該如何解決
以上就是HTML里的name與id和class到底有什么不同的詳細(xì)內(nèi)容,更多請關(guān)注php中文網(wǎng)其它相關(guān)文章!
網(wǎng)站建設(shè)是一個(gè)廣義的術(shù)語,涵蓋了許多不同的技能和學(xué)科中所使用的生產(chǎn)和維護(hù)的網(wǎng)站。