비표준 속성 사용

Question

html/jquery 응용 프로그램을 만들 때 전역 변수를 사용하지 않고 값을 전달하는 데 문제가 있습니다. 간단한 예

1

)은 예컨대 "playersTable"로 클래스

2) "25"

3)으로 고유 ID를 첨부하여 테이블을로드 테이블의 행을 클릭 행 스폰 부모 클래스 및 ID를 기반으로 작업을 수행하는 버튼. 쿼리 플레이어 테이블과 같은 WHERE 행 = 25 등

문제는 내가 개발하는 동안 상위 요소 (또는 이미 클래스와 ID가있는 요소)에 더 많은 값을 연결해야한다는 것입니다. 클래스에 20 가지를 추가하지 않으려합니다.

더 많은 데이터를 요소에 첨부해야 할 때 어떻게해야할지 모르겠습니다. 나는 또한 "가치"라는 속성을 사용했지만, 모든 브라우저가 그것을 지원하는지 궁금하다. 나쁜 습관이라면 나는 궁금해한다. 예 :

<div id = "2" class = "test" myAttr = "foo"></div> 

아니면 일반적으로이 모든 잘못된 방법으로 가고 있습니까?

Answer 1

당신이 그것을 구체적인 조언을 제공하기 어렵다 DOM 요소에 대한 모든 데이터를 첨부해야하는 이유 을 모른 채.

먼저, data- 속성을 사용하는 것이 좋습니다.

둘째, 동적으로 데이터를 첨부하는 경우 jQuery의 data() 메서드를 사용하는 것이 좋습니다.

셋째, 실제로 필요한 데이터와 시간을 고려해 볼 수 있습니다.

넷째, 아마도 가장 중요한 것은 ID 속성이 실제로 설정하고자하는 것이 아닐 것입니다.

data-id 요소를 사용하고 ID를 얻습니다. 간단한 숫자 값은 유효한 ID가 아닙니다. ID로 DOM 요소를 실제로 참조해야하는 경우가 아니면 왜 귀찮은가? 일반적으로 당신이 정말로 필요로하는 것은 가까운 계층 구조를 보거나 (또는 ​​아래로) 부모 행 등을 찾아 data("id")과 같은 단일 값을 추출하는 것입니다.

Answer 2

순수한 JavaScript element.getAttribute('data-some_attr_name') 또는 jQuery element.data('some_attr_name')과 함께 data- * 속성을 사용하는 것이 좋습니다.

브라우저 지원 : http://caniuse.com/dataset

jQuery를 데이터 문서 : http://api.jquery.com/data/