Difference between id and name attributes in HTML

Question

What is the difference between the id and name attributes? They both seem to serve the same purpose of providing an identifier.

I would lik

Answer 1

The name attribute is used when sending data in a form submission. Different controls respond differently. For example, you may have several radio buttons with different id attributes, but the same name. When submitted, there is just the one value in the response - the radio button you selected.

Of course, there's more to it than that, but it will definitely get you thinking in the right direction.

Answer 2

The id will give an element a id, so once you write real code, (like JavaScript) you can use the id to read elements. The name is just a name so the user can see the name of the element, I guess.

Example:

<h1 id="heading">text</h1>
<script>
  document.getElementById("heading"); //Reads the element that has the id "heading".
</script>

//You can also use something like this:
document.getElementById("heading").value; //Reads the value of the selected element.

Is it helpful? Let me know if there is some problems.

Answer 3

See this http://mindprod.com/jgloss/htmlforms.html#IDVSNAME

What’s the difference? The short answer is, use both and don’t worry about it. But if you want to understand this goofiness, here’s the skinny:

id= is for use as a target like this: <some-element id="XXX"></some-element> for links like this: <a href="#XXX".

name= is also used to label the fields in the message send to a server with an HTTP (HyperText Transfer Protocol) GET or POST when you hit submit in a form.

id= labels the fields for use by JavaScript and Java DOM (Document Object Model). The names in name= must be unique within a form. The names in id= must be unique within the entire document.

Sometimes the name= and id= names will differ, because the server is expecting the same name from various forms in the same document or various radio buttons in the same form as in the example above. The id= must be unique; the name= must not be.

JavaScript needed unique names, but there were too many documents already out here without unique name= names, so the W3 people invented the id tag that was required to be unique. Unfortunately older browsers did not understand it. So you need both naming schemes in your forms.

NOTE: attribute "name" for some tags like <a> is not supported in HTML5.

Answer 4

The way I think about it and use it is simple:

id is used for CSS and JavaScript/jQuery (has to be unique in a page)

name is used for form handling in PHP when a form is submitted via HTML (has to be unique in a form - to some extent, see Paul's comment below)

Answer 5

ID tag - used by CSS, define a unique instance of a div, span or other elements. Appears within the Javascript DOM model, allowing you to access them with various function calls.

Name tag for fields - This is unique per form -- unless you are doing an array which you want to pass to PHP/server-side processing. You can access it via Javascript by name, but I think that it does not appear as a node in the DOM or some restrictions may apply (you cannot use .innerHTML, for example, if I recall correctly).

Answer 6

ID is used to uniquely identify an element.

Name is used in forms.Although you submit a form, if you dont give any name, nothing will will be submitted. Hence form elements need a name to get identified by form methods like "get or push".

And the ones only with name attribute will go out.