HTML 태그 ID에 대해 UUID를 사용해도 문제가 있습니까?

Question

측면 창에서 색인을 통해 액세스 할 수있는 동적 콘텐츠가 있습니다. 사용자가 측면 창 요소를 선택하면 해당 ID를 참조하는 데이터를 파악하는 메커니즘으로 ID를 사용하므로 동적으로 메인 창에 대한 적절한 데이터.

숫자가 붙은 미리 형식화 된 ID를 사용했습니다. 여기서 번호는 배열의 색인 이었으므로 html 태그에 고유 ID를 사용했습니다. 그러나 특정 시나리오에서는 숫자와 충돌이 있으므로 UUID를 사용하면 문제를 해결할 수있는 방법이라고 생각했습니다.

그러나 HTML 태그 ID에 대해 UUID를 사용하는 데 문제가 있는지 여부는 알 수 없습니다.

유효한 문자와 길이 제한에 대한 지식을 바탕으로 즉각적이고 신속한 답변이 효과가 있다고 생각합니다. 버전 4는 0-9, a-z and - 인 문자를 사용합니다. afaict는 HTML 태그 ID에 유효한 문자입니다. 또한 길이는 issue이 아닙니다.

내 관심사는 ID의 유효 크기를 제한하는 브라우저 문제입니까? 테스트를 실행하고 값이 2d1b8447-e37a-43d8-9f7c-075eac7d9bcc 인 단일 ID를 작성하거나 여러 개의 테스트를 작성하는 것이 좋습니다. 하지만 앱을 사용할 모든 브라우저를 테스트 할 수는 없으며 시간이 지남에 따라 성능을 테스트하기가 어렵습니다. 내 콘텐츠가 매우 동적이며이 ID를 가진 태그는 시간이 지남에 따라 제거되고 추가 될 수 있습니다.

큰 태그 ID로보고 된 문제를 검색했지만 아무 것도 발견되지 않았지만 Google을 통한 문제의 부재는 모든 문제.

그래서 ... HTML 태그에 대한 ID에 UIID를 사용하는 사람이 있습니까? 그렇다면 경험 한 것을 피할 수있는 문제가 있습니까?

UUID에 indexing (InnoDB)의 성능 문제가 있다는 증거가 있으며 DOM 조작 및 UUID 인 ID가있는 jQuery를 사용하면 비슷한 문제가 발생할 수 있다는 점에 유의해야합니다.

건배.

Answer 1

data- 속성을 사용하여 동일한 작업을 수행 할 수 있습니다.

예 :

<a href="#" data-UUID="2d1b8447-e37a-43d8-9f7c-075eac7d9bcc" class="product_link">Some product</a> 

읽기 data- jQuery로 속성 :

$('.product_link').click(function(){ 
    var UUID=$(this).data('UUID'); 
    /* do something with UUID*/ 
})