明輝手游網(wǎng)中心:是一個(gè)免費(fèi)提供流行視頻軟件教程、在線學(xué)習(xí)分享的學(xué)習(xí)平臺(tái)!

html中對(duì)于name與id以及class的區(qū)別說明

[摘要]在一個(gè)頁面中,有許多的控件(元素或標(biāo)簽)。為了更方便的操作這些標(biāo)簽,就需要給這些標(biāo)簽標(biāo)識(shí)一個(gè)身份牌。目錄1. name :指定標(biāo)簽的名稱。2. id :指定標(biāo)簽的唯一標(biāo)識(shí)。3. class :指定標(biāo)簽的類名。 1. name指定標(biāo)簽的名稱。1.1 格式<input type="te...
  在一個(gè)頁面中,有許多的控件(元素或標(biāo)簽)。為了更方便的操作這些標(biāo)簽,就需要給這些標(biāo)簽標(biāo)識(shí)一個(gè)身份牌。

目錄

1. name :指定標(biāo)簽的名稱。

2. id :指定標(biāo)簽的唯一標(biāo)識(shí)。

3. class :指定標(biāo)簽的類名。

1. name

指定標(biāo)簽的名稱。

1.1 格式

<input type="text" name="username" />

1.2 應(yīng)用場(chǎng)景

①form表單:name可作為轉(zhuǎn)遞給服務(wù)器表單列表的變量名;如上面的傳到服務(wù)器的名稱為:username='text的值'。

②input type='radio'單選標(biāo)簽:把幾個(gè)單選標(biāo)簽的 name設(shè)為一個(gè)相同值時(shí),將會(huì)進(jìn)行單選操作。


<input type="radio" name='sex'/>男<input type="radio" name='sex'/>女

③快速獲取一組name相同的標(biāo)簽:獲取擁有相同name的標(biāo)簽,一起進(jìn)行操作,如:更改屬性、注冊(cè)事件等。


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';
    }
}

1.3 特性

name屬性的值,在當(dāng)前page頁面中并非唯一性。

2. id

指定標(biāo)簽的唯一標(biāo)識(shí)。

2.1 格式

<input type=password 
id
="userpwd" />


2.2 應(yīng)用場(chǎng)景

①根據(jù)提供的唯一id號(hào),快速獲取標(biāo)簽對(duì)象。如:document.getElementById(id)

②用于充當(dāng)label標(biāo)簽for屬性的值:示例:<label for='userid'>用戶名:</label>,表示單擊此label標(biāo)簽時(shí),id為userid的標(biāo)簽獲得焦點(diǎn)。

2.3 特性

id屬性的值,在當(dāng)前的page頁面要是唯一的。

3. class

指定標(biāo)簽的類名。

3.1 格式

<input type=button 
class
="btnsubmit" />


3.2 應(yīng)用場(chǎng)景

①CSS操作,把一些特定樣式放到一個(gè)class類中,需要此樣式的標(biāo)簽,可以在添加此類。

3.3 特性

可以把多個(gè)類,放在一個(gè)class屬性里,但必須用空格隔開;如:

class
=
'btnsubmit btnopen'

以上就是html中關(guān)于name和id以及class的區(qū)別介紹的詳細(xì)內(nèi)容,更多請(qǐng)關(guān)注php中文網(wǎng)其它相關(guān)文章!


網(wǎng)站建設(shè)是一個(gè)廣義的術(shù)語,涵蓋了許多不同的技能和學(xué)科中所使用的生產(chǎn)和維護(hù)的網(wǎng)站。