Home  >  Article  >  Web Front-end  >  Introduction to the differences between name, id and class in html

Introduction to the differences between name, id and class in html

黄舟
黄舟Original
2017-07-19 11:57:052856browse

In a page, there are many controls (elements or labels). In order to operate these tags more conveniently, it is necessary to mark these tags with an identity tag.

Directory

1. name: Specify the name of the label.

2. id: Specify the unique identifier of the tag.

3. class: Specify the class name of the label.

1. name

Specify the name of the label.

1.1 Format

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

1.2 Application Scenario

①form form: name can be used as the variable name transferred to the server form list; such as The name passed to the server above is: username='text value'.

②input type='radio'radio label: When the names of several radio label names are set to the same value, a radio selection operation will be performed.


<input type="radio" name=&#39;sex&#39;/>男<input type="radio" name=&#39;sex&#39;/>女

③Quickly obtain a group of tags with the same name: Get tags with the same name and perform operations together, such as: changing attributes and registering events wait.


function changtxtcolor() {    var txts = document.getElementsByName(&#39;txtcolor&#39;); //获取所有name=txtcolor 的标签
    for (var i = 0; i < txts.length; i++) { //循环遍历标签,并把背景色改为red
        txts[i].style.backgroundColor = &#39;red&#39;;
    }
}

1.3 Features The value of the

name attribute is not unique in the current page.

2. id

specifies the unique identifier of the tag.

2.1 Format

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


##2.2 Application scenario

①According to the unique ID number, quickly obtain the label object. For example: document.getElementById(id)

② Used as the value of the label label for attribute: Example: d305c5282d143dd49e6374acc3c8c7aa User name:

2.3 Features

The value of the id attribute must be unique in the current page.

3. class

Specifies the class name of the label.

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


3.2 Application Scenario

①CSS operation, put some specific styles into a class. If you need tags of this style, you can add this class.

3.3 Features

You can put multiple classes in one class attribute, but they must be separated by spaces; such as:

class
=
&#39;btnsubmit btnopen&#39;


The above is the detailed content of Introduction to the differences between name, id and class in html. For more information, please follow other related articles on the PHP Chinese website!

Statement:
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn