Use the id attribute to identify elements for style and scripting purposes. Use the name attribute only for form elements.
Other than forms, there’s really no reason to use the name attribute now that the id attribute is universally compatible. The only practical use that name has left is for submitting your form values.
Some differences can be:
Id Attribute
Valid on any element
Each Id should be unique
Can be used as anchor reference in URL
Is referenced in CSS or URL with # sign
Is referenced in JS with getElementById()
Shares same name space as name attribute
Must begin with a letter
Is case sensitive
Name Attribute
Valid only on a, form, iframe, img, map, input, select, textarea
Name does not have to be unique
Can not be referenced in CSS or URL
Is referenced in JS with getElementsByName()
Shares same name space as id attribute
Must begin with a letter
Is case sensitive
Used on form elements to submit information