DIV CSS 佈局教程網

 DIV+CSS佈局教程網 >> 網頁腳本 >> WEB網站前端 >> 前端技巧 >> HTML name、id、class 的(格式/應用場景/特性)等區別介紹
HTML name、id、class 的(格式/應用場景/特性)等區別介紹
編輯:前端技巧     
在一個頁面中,有許多的控件(元素或標簽)。為了更方便的操作這些標簽,就需要給這些標簽標識一個身份牌。

所需用到的屬性有:name、id、class

1. name

指定標簽的名稱。

1.1 格式:<input type="text" name="username" />

1.2 應用場景

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

②input type='radio'單選標簽:把幾個單選標簽的 name設為一個相同值時,將會進行單選操作。

復制代碼代碼如下:
<input type="radio" name='sex'/>男
<input type="radio" name='sex'/>女
③快速獲取一組name相同的標簽:獲取擁有相同name的標簽,一起進行操作,如:更改屬性、注冊事件等;
[code]
function changtxtcolor() {
var txts = document.getElementsByName('txtcolor'); //獲取所有name=txtcolor 的標簽
for (var i = 0; i < txts.length; i++) { //循環遍歷標簽,並把背景色改為red
txts[i].style.backgroundColor = 'red';
}
}

1.3 特性

name屬性的值,在當前page頁面中並非唯一性。

2. id

指定標簽的唯一標識。

2.1 格式:<input type=password id="userpwd" />

2.2 應用場景:

①根據提供的唯一id號,快速獲取標簽對象。如:document.getElementById(id)

②用於充當label標簽for屬性的值:示例:<label for='userid'>用戶名:</label>,表示單擊此label標簽時,id為userid的標簽獲得焦點。

2.3 特性

id屬性的值,在當前的page頁面要是唯一的。

3. class

指定標簽的類名。

3.1 格式:<input type=button class="btnsubmit" />

3.2 應用場景:

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

3.3 特性:

可以把多個類,放在一個class屬性裡,但必須用空格隔開;如:class='btnsubmit btnopen'
XML學習教程| jQuery入門知識| AJAX入門| Dreamweaver教程| Fireworks入門知識| SEO技巧| SEO優化集錦|
Copyright © DIV+CSS佈局教程網 All Rights Reserved