Programing

HTML에서 ID와 이름 속성의 차이점

lottogame 2020. 10. 2. 21:21
반응형

HTML에서 ID와 이름 속성의 차이점


idname속성 의 차이점은 무엇입니까 ? 둘 다 식별자를 제공하는 동일한 목적을 수행하는 것 같습니다.

(특히 HTML 양식과 관련하여) 두 가지를 모두 사용하는 것이 어떤 이유로 필요한지 또는 권장되는지 알고 싶습니다.


name속성은 양식 제출에서 데이터를 보낼 때 사용됩니다. 다른 컨트롤은 다르게 반응합니다. 예를 들어 id속성은 다르지만 동일한 name. 제출시 응답에는 선택한 라디오 버튼 하나의 값만 있습니다.

물론 그것보다 더 많은 것이 있지만 확실히 올바른 방향으로 생각하게 할 것입니다.


양식 제출시 발생 하는 또는 호출에 사용되는 식별자이므로 name양식 컨트롤 (예 : <input><select>)에 속성을 사용 합니다 .POSTGET

idCSS, JavaScript 또는 조각 식별자 로 특정 HTML 요소를 처리해야 할 때마다 속성을 사용하십시오 . 이름으로 요소를 조회하는 것도 가능하지만 ID로 조회하는 것이 더 간단하고 안정적 입니다.


다음은 간략한 요약입니다.

  • id문서 객체 모델을 통해 HTML 요소식별하는 데 사용됩니다 (JavaScript 또는 CSS로 스타일 지정). id페이지 내에서 고유해야합니다.

  • name양식 요소에 해당 하며 서버에 다시 게시되는 내용을 식별합니다 .


http://mindprod.com/jgloss/htmlforms.html#IDVSNAME을 참조하십시오 .

차이점이 뭐야? 짧은 대답은 둘 다 사용하고 걱정하지 마십시오. 하지만이 어리 석음을 이해하고 싶다면 여기 스키니가 있습니다.

id =는 다음과 같은 대상으로 사용됩니다 . <some-element id="XXX"></some-element>다음과 같은 링크의 경우 : <a href="#XXX".

name =은 양식에서 제출을 누를 때 HTTP (HyperText Transfer Protocol) GET 또는 POST를 사용하여 서버로 보내는 메시지의 필드에 레이블을 지정하는데도 사용됩니다.

id =는 JavaScript 및 Java DOM (문서 개체 모델)에서 사용할 필드에 레이블을 지정합니다. name =의 이름은 양식 내에서 고유해야합니다. id =의 이름은 전체 문서 내에서 고유해야합니다.

때때로 name = 및 id = 이름은 서버가 동일한 문서의 다양한 양식에서 동일한 이름을 예상하거나 위의 예와 동일한 양식의 다양한 라디오 버튼을 예상하기 때문에 다를 수 있습니다. id =는 고유해야합니다. name =이 아니어야합니다.

JavaScript는 고유 한 이름이 필요했지만 고유 한 이름 = 이름이없는 문서가 너무 많았 기 때문에 W3 사람들은 고유해야하는 id 태그를 발명했습니다. 불행히도 오래된 브라우저는 그것을 이해하지 못했습니다. 따라서 양식에 두 가지 이름 지정 체계가 필요합니다.

참고 : 일부 태그의 "이름"속성 <a>은 HTML5에서 지원되지 않습니다.


내가 그것에 대해 생각하고 사용하는 방법은 간단합니다.

id 는 CSS 및 JavaScript / jQuery에 사용됩니다 (페이지에서 고유해야 함).

name 은 양식이 HTML을 통해 제출 될 때 PHP에서 양식 처리에 사용됩니다 (양식에서 고유해야합니다. 어느 정도는 아래 Paul 의 주석 참조).


ID 태그-CSS에서 사용 하며 div, span 또는 기타 요소 고유 한 인스턴스를 정의합니다 . Javascript DOM 모델에 나타나며 다양한 함수 호출로 액세스 할 수 있습니다.

필드의 이름 태그 -PHP / 서버 측 처리에 전달하려는 배열을 수행하지 않는 한 양식 별로 고유 합니다. 이름으로 Javascript를 통해 액세스 할 수 있지만 DOM에서 노드로 표시되지 않거나 일부 제한이 적용될 수 있다고 생각합니다 (예를 들어 올바르게 기억하면 .innerHTML을 사용할 수 없습니다).


일반적으로 이름은 항상 id로 대체 된다고 가정합니다 . 이것은 어느 정도는 사실이지만 실제로는 폼 필드와 프레임 이름 에는 해당 되지 않습니다 . 예를 들어, 양식 요소의 경우 name속성은 서버 측 프로그램으로 보낼 이름-값 쌍을 결정하는 데 사용되며 제거해서는 안됩니다. Browsers do not use id in that manner. 안전을 위해 양식 요소에 이름 및 ID 속성을 사용할 수 있습니다. 따라서 다음과 같이 작성합니다.

<form id="myForm" name="myForm">
     <input type="text" id="userName" name="userName" />
</form>

호환성을 보장하려면 둘 다 정의 된 경우 이름과 ID 속성 값을 일치시키는 것이 좋습니다. 그러나주의하십시오. 일부 태그, 특히 라디오 버튼에는 고유하지 않은 이름 값이 있어야하지만 고유 한 ID 값이 필요합니다. 다시 한 번, 이것은 id가 단순히 이름을 대체하는 것이 아니라는 것을 참조해야합니다. 목적이 다릅니다. 또한 구식 접근 방식을 무시하지 마십시오. 현대 라이브러리를 자세히 살펴보면 때때로 성능 및 용이성을 위해 사용되는 구문 스타일을 알 수 있습니다. 당신의 목표는 항상 호환성에 유리해야합니다.

Now in most elements, the name attribute has been deprecated in favor of the more ubiquitous id attribute. However, in some cases, particularly form fields (<button>, <input>, <select>, and <textarea>), the name attribute lives on because it continues to be required to set the name-value pair for form submission. Also, we find that some elements, notably frames and links, may continue to use the name attribute because it is often useful for retrieving these elements by name.

There is a clear distinction between id and name. Very often when name continues on, we can set the values the same. However, id must be unique, and name in some cases shouldn’t—think radio buttons. Sadly, the uniqueness of id values, while caught by markup validation, is not as consistent as it should be. CSS implementation in browsers will style objects that share an id value; thus, we may not catch markup or style errors that could affect our JavaScript until runtime.

This is taken from the book JavaScript- The Complete Reference by Thomas-Powell


<form action="demo_form.asp">
<label for="male">Male</label>
<input type="radio" name="sex" id="male" value="male"><br>
<label for="female">Female</label>
<input type="radio" name="sex" id="female" value="female"><br>
<input type="submit" value="Submit">
</form>

name is deprecated for link targets, and invalid in HTML5. It no longer works at least in latest Firefox (v13). Change <a name="hello"> to<a id="hello">

The target does not need to be an <a> tag, it can be <p id="hello"> or <h2 id="hello"> etc. which is often cleaner code.

As other posts say clearly, name is still used (needed) in forms. It is also still used in META tags.


This link has answers to the same basic question, but basically, id is used for scripting identification and name is for server-side.

http://www.velocityreviews.com/forums/t115115-id-vs-name-attribute-for-html-controls.html


name Vs id

name

  • Name of the element. For example used by the server to identify the fields in form submits.
  • Supporting elements are <button>, <form>, <fieldset>, <iframe>, <input>, <keygen>, <object>, <output>, <select>, <textarea>, <map>, <meta>, <param>
  • Name does not have to be unique.

id

  • Often used with CSS to style a specific element. The value of this attribute must be unique.
  • Id is Global attributes, they can be used on all elements, though the attributes may have no effect on some elements.
  • Must be unique in the whole document.
  • This attribute's value must not contain white spaces, in contrast to the class attribute, which allows space-separated values.
  • Using characters except ASCII letters and digits, '_', '-' and '.' may cause compatibility problems, as they weren't allowed in HTML 4. Though this restriction has been lifted in HTML 5, an ID should start with a letter for compatibility.

The ID of a form input element has nothing to do with the data contained within the element. IDs are for hooking the element with JavaScript and CSS. The name attribute, however, is used in the HTTP request sent by your browser to the server as a variable name associated with the data contained in the value attribute.

For instance:

<form>
    <input type="text" name="user" value="bob">
    <input type="password" name="password" value="abcd1234">
</form>

When the form is submitted, the form data will be included in the HTTP header like this:

If you add an ID attribute, it will not change anything in the HTTP header. It will just make it easier to hook it with CSS and JavaScript.


If you're not using the form's own submit method to send information to a server (and are instead doing it using javascript) you can use the name attribute to attach extra information to an input - rather like pairing it with a hidden input value, but looks neater because it's incorporated into the input.

This bit does still currently work in Firefox although I suppose in the future it might not get allowed through.

You can have multiple input fields with the same name value, as long as you aren't planning to submit the old fashioned way.


Below is an interesting use of the id attribute. It is used within the tag and used to identify the form for elements outside of the boundaries so that they will be included with the other fields within the form.

 <form action="action_page.php" id="form1">
 First name: <input type="text" name="fname"><br>
 <input type="submit" value="Submit">
 </form>

 <p>The "Last name" field below is outside the form element, but still part of the form.</p>
 Last name: <input type="text" name="lname" form="form1">

Id : 1) It is used to identify the HTML element through the Document Object Model (via Javascript or styled with CSS). 2) Id is expected to be unique within the page.

Name corresponds to the form element and identifies what is posted back to the server. Example :

<form action="action_page.php" id="Myform">
 First name: <input type="text" name="FirstName"><br>
 <input type="submit" value="Submit">
 </form>

 <p>The "Last name" field below is outside the form element, but still part of the form.</p>
 Last name: <input type="text" name="LastName" form="Myform">

ID i used to uniquely identify an element.

Name is used in forms. when even u submit a form. and if you dont give any name, nothing will will be submitted. And the ones only with name attribute will go out.


Based on personal experiences and according to the W3 Schools description for attributes:

ID is a Global Attribute and applies to virtually all elements in HTML. It is used to uniquely identify elements on the Web page, and its value is mostly accessed from the frontend (typically through JavaScript or jQuery).

name is an attribute that is useful to specific elements (such as form elements, etc) in HTML. Its value is mostly sent to the backend for processing.

https://www.w3schools.com/tags/ref_attributes.asp

참고URL : https://stackoverflow.com/questions/1397592/difference-between-id-and-name-attributes-in-html

반응형