HTML에서 properties과 attributes의 차이점

질문 : HTML에서 속성과 속성의 차이점은 무엇입니까?

---

jQuery 1.6.1에서 변경 한 후 HTML에서 속성과 속성의 차이를 정의하려고했습니다.

jQuery 1.6.1 릴리스 노트 (하단 근처)의 목록을 보면 다음과 같이 HTML 속성과 속성을 분류 할 수있는 것 같습니다.

• 속성 : boolean값이 있거나 selectedIndex와 같이 계산 된 UA 인 모든 항목입니다.
• 속성 : boolean이 아니거나 UA 생성 값을 포함하지 않는 HTML 요소에 추가 할 수있는 '속성'입니다.

 

답변

---

HTML 소스 코드를 작성할 때 HTML 요소에 속성을 정의 할 수 있습니다. 그런 다음 브라우저가 코드를 구문 분석하면 해당 DOM 노드가 생성됩니다. 이 노드는 객체이므로 속성 이 있습니다.

예를 들어이 HTML 요소는 다음과 같습니다.

<input type="text" value="Name:">

2 개의 속성 ( type 및 value )이 있습니다.

브라우저가이 코드를 구문 분석하면 HTMLInputElement 객체가 생성되고이 객체에는 accept, accessKey, align, alt, attributes, autofocus, baseURI, checked, childElementCount, childNodes, children, classList, className, clientHeight 등

주어진 DOM 노드 객체의 경우 속성은 해당 객체의 속성이고 속성은 해당 객체의 attributes 속성의 요소입니다.

주어진 HTML 요소에 대해 DOM 노드가 생성 될 때 많은 속성이 동일하거나 유사한 이름을 가진 속성과 관련되지만 일대일 관계는 아닙니다. 예를 들어이 HTML 요소의 경우 :

<input id="the-input" type="text" value="Name:">

해당 DOM 노드에는 id , type 및 value 속성이 있습니다.

• id 속성은 id 속성에 대해 반영된 속성 입니다. id 속성 값을 읽고 속성을 설정하면 속성 값이 기록됩니다. id 는 순수한 반사 속성이며 값을 수정하거나 제한하지 않습니다.
• type 속성에 대한 반사 속성입니다 type 속성 : 속성을 얻는 것은 속성 값을 읽고 속성을 설정하면 속성 값을 기록합니다. type 은 알려진 값 (예 : 유효한 입력 유형)으로 제한되기 때문에 순수 반사 속성이 아닙니다. <input type="foo"> 가있는 경우 theInput.getAttribute("type") 는 "foo" 제공하지만 theInput.type "text" 제공합니다.
• 반대로 value value 속성을 반영하지 않습니다. 대신 입력의 현재 값 입니다. 사용자가 입력 상자의 값을 수동으로 변경하면 value 속성에이 변경 사항이 반영됩니다. 따라서 사용자가 입력 상자에 "John"

  theInput.value // returns "John"

  이므로:

  theInput.getAttribute('value') // returns "Name:"

  value 반면, 속성은, 입력 상자 안에 현재의 텍스트 내용을 반영하는 value 속성이의 초기 텍스트 내용이 들어 value HTML 소스 코드에서 속성을. 따라서 현재 텍스트 상자 안에 무엇이 있는지 알고 싶다면 속성을 읽으십시오. 그러나 텍스트 상자의 초기 값이 무엇인지 알고 싶다면 속성을 읽으십시오. value 속성을 순수하게 반영한 defaultValue 속성을 사용할 수 있습니다.

  theInput.value                 // returns "John"
  theInput.getAttribute('value') // returns "Name:"
  theInput.defaultValue          // returns "Name:"

 

 

rel , id )을 직접 반영하는 몇 가지 속성이 있으며, 일부는 약간 다른 이름을 가진 직접 반영입니다 ( htmlFor 는 for 속성을 반영하고 className class 속성을 반영), 많은 속성은 속성을 반영하지만 제한 / 수정 ( src , href , disabled , multiple ) 등. 사양 은 다양한 종류의 반사를 다룹니다.

출처 : https://stackoverflow.com/questions/6003819/what-is-the-difference-between-properties-and-attributes-in-html