HTML ID의 실제 최대 길이는 얼마입니까?

88

ID와 NAME 토큰 문자로 시작한다 ([A-ZA-Z])과이어서 수있다 임의의 수 문자, 숫자 (0-9), 하이픈 ( "-"), 밑줄 ( "_") , 콜론 ( ":") 및 마침표 ( ".").

그리고 HTML 4 의 SGML 선언 은 NAMELEN에 65536 값을 사용 하지만 "고정 된 제한을 피하십시오"라고 표시합니다.

그러나 브라우저, CSS 구현 및 JavaScript 툴킷은 지원하는 길이에 약간의 제한이 있어야합니다 . HTML / CSS / JS 애플리케이션에서 사용하기에 안전한 가장 작은 제한은 무엇입니까?

javascript html css

3

감사합니다. 신분증은 문자로 시작해야한다는 점을 알려 주셔서 +1합니다. 예전에 '1', '2', '3', '4', '5'와 같은 아이디를 문제없이 사용했습니다. 나는 많은 설문 조사 관련 위젯과 상호 작용 요소를 수행하고 이와 같은 IDS를 사용하여 편리한 '점수'속성과 ID 참조를 위해 만들어졌습니다. 오늘은 정말 효과가 있었어야하는 CSS 작업을하려고했습니다. 나는 심지어 W3C 유효성 검사기를 지나서 실행했지만이 문제에 대해 경고하지 않았습니다. 그리고 이제 id = '5'를 'x5x'로 변경하면 css가 작동합니다. 이제 x를 제거하기 위해 스코어링 서브 루틴을 변경해야합니다! 다시 Thx.

— Ben A. Hilleli 2014

216

그냥 테스트 : 1M은 모든 현대적인 브라우저에서 문자 작품 : Chrome1, FF3, IE7, Konqueror3, Opera9, Safari3.

더 긴 ID는 기억하기 어려워 질 수 있다고 생각합니다.

— 피하 그
소스

15

이 녀석은 천만개의 캐릭터를 만들었습니다! stackoverflow.com/a/1496150/74585

— Matthew Lock

1

죄송 해요. 1M? 백만에서와 같이?

— beliha

8

@phihag 토론토에서 CS를 공부하고 강사가 "물론 1582 년 10 월 그레고리력에 10 일이 빠진 이유를 누구나 알고있다"고 말했을 때, 동료에게 물어보아야했다. 그레고리력이 채택 되었기 때문에 초등학교에 다닌 적이 없습니까? " 나는하지 않았다. 캐나다에는 없습니다. 나는 이집트의 초등학교에 다니고 대신 이슬람 력에 대해 배웠습니다. SI 접두사도 마찬가지입니다. 서양 교육의 혜택을 누릴 수도 있지만 저는 그렇지 않았습니다. 그럼에도 불구하고 겸손한 태도에 감사드립니다.

— beliha

2

@beliha 적어도 여기 포르투갈에서는 1582 년 10 월에 그레고리력에 10 일이 빠졌다는 소식을 들어 본 적이 없는데, 제가 유일한 사람이 아니라고 생각합니다. 나는 학교가 내가 기억할 수있는 것으로부터 그것을 가르친 적이 없다고 생각한다. 그래서 모든 사람이 그것을 알기를 기대하는 것은 누구에게나 대담 할 것이다.

— user7393973

1

@beliha 나는 서부 학교에 갔고 우리가 그레고리력을 사용한다는 것을 배우지 못했습니다 (적어도이 이름으로는), 우리는 표준 달력 용어를 사용했습니다. 누락 된 10 일에 대해 YouTube에서 배웠습니다.

— Tinaira

15

나에게 실질적인 한계는 HTML / CSS로 작업하는 동안 머리에 저장할 수있는 ID의 길이입니다.

이 제한은 일반적으로 내가 일한 시간과 요소의 맥락에서 이름이 의미가 있는지에 따라 8 ~ 13 자 사이입니다.

— 닉 프레 스타
소스

5

필요한 경우 접두사를 사용하여 "내부 버퍼"를 확장 할 수 있다고 덧붙입니다. :-)

— Ben Blank

12

이 질문은 여전히 매우 중요합니다. RIA에서는 종종 ID가 코드에 의해 생성되고 고유하기 위해 길 수 있기 때문입니다. 예를 들어 : window_2_panel_12_group_6_label_2 _...

— 조쉬

3

때로는 매우 긴 ID로 끝날 수도 있지만 정확한 목적과 일치하도록 일관되게 이름을 지정합니다.

예를 들면 ...

<div id="page">
    <div id="primary-content"></div>
    <div id="secondary-content"></div>
    <div id="search-form-and-primary-nav-wrapper">
        <form id="search-form"></form>
        <ul id="primary-nav">
            <li id="primary-nav-about-us"></li>
        </ul>
    </div>
    <a id="logo"><img /></a>
</div><!-- /#page -->

보시다시피 선택기는 때때로 꽤 길다. 그러나 #doc, #bd, # yui-main 등과 같은 ID로 끝나는 YUI grids.css와 같은 작업보다 IMHO가 훨씬 쉽습니다.

— 마크 허드
소스

3

내가 많이하는 일은 상속 적으로 이름을 지정하는 것이므로 div id = 'user'를 사용하면 그 안에 세 개의 div, id = 'user-stats', id = 'user-inventory', id = 'user-가있을 수 있습니다. spells ', 그런 다음 user-stats 내에서 id ='user-stats-strength ', id ='user-stats-agility ', id ='user-stats-defence ', id ='user- stats-intellect ', id ='user-stats-heath '등, 이름 지정 규칙을 유지하는 한 ID를 기억하는 데 매우 유용합니다.

— Psytronic 2010

2

이것이 학문적 질문이라면 꽤 흥미 롭습니다 ...하지만 모범 사례에 관한 한 이러한 질문을 확장 할 필요가 없습니다. HTML 요소에 대한 데이터를 저장해야하는 경우 DOM 개체의 속성에 넣는 것이 좋습니다.

— 매트 하웰
소스