ความยาวสูงสุดที่ใช้ได้จริงสำหรับ HTML id คืออะไร?

89

ข้อกำหนดHTMLกล่าว

ID และ NAME ราชสกุลจะต้องเริ่มต้นด้วยตัวอักษร ([A-Za-z]) และอาจจะตามด้วยหมายเลขของตัวอักษรตัวเลข ([0-9]) ยัติภังค์ ( "-"), ขีดล่าง ( "_") , เครื่องหมายทวิภาค (":") และจุด (".")

และแม้ว่าการประกาศ SGMLของ HTML 4 จะใช้ค่า 65536 สำหรับ NAMELEN แต่ก็ระบุว่า "หลีกเลี่ยงขีด จำกัด คงที่"

แต่เบราว์เซอร์แน่นอนการใช้งาน CSS และ JavaScript ชุดเครื่องมือต้องมีบางข้อ จำกัด เกี่ยวกับระยะเวลาที่พวกเขาสนับสนุน ขีด จำกัด ที่เล็กที่สุดที่ปลอดภัยสำหรับใช้ในแอปพลิเคชัน HTML / CSS / JS คืออะไร

javascript html css

— ระบบหยุดชั่วคราว
แหล่งที่มา

3

ขอบคุณและ +1 ที่ชี้ให้เห็นว่า ID ต้องขึ้นต้นด้วยตัวอักษร ฉันเคยใช้ ID เช่น '1', '2', '3', '4', '5' โดยไม่มีปัญหา ฉันทำวิดเจ็ตที่เกี่ยวข้องกับการสำรวจและองค์ประกอบเชิงโต้ตอบมากมายและการใช้ IDS เช่นนี้สร้างขึ้นเพื่อให้ได้แอตทริบิวต์ 'คะแนน' ที่สะดวกและการอ้างอิง ID วันนี้ฉันพยายามทำให้ CSS ทำงานได้ซึ่งควรจะใช้งานได้จริง ฉันวิ่งผ่านตัวตรวจสอบ W3C และมันไม่ได้แจ้งเตือนฉันเกี่ยวกับปัญหานี้ ... แต่โพสต์นี้ทำ และตอนนี้เมื่อฉันเปลี่ยน id = '5' เป็น 'x5x' css ก็ใช้งานได้ ... ตอนนี้ฉันต้องเปลี่ยนรูทีนย่อยการให้คะแนนเพื่อดึง x ออก! ขอบคุณอีกครั้ง

— Ben A.Hilleli

218

เพิ่งทดสอบ: อักขระ1 ล้านตัวใช้งานได้กับทุกเบราว์เซอร์สมัยใหม่: Chrome1, FF3, IE7, Konqueror3, Opera9, Safari3

ฉันสงสัยว่า ID ที่ยาวขึ้นอาจจำได้ยาก

— phihag
แหล่งที่มา

15

ผู้ชายคนนี้ทำ 10 "ล้าน" ตัวอักษร! stackoverflow.com/a/1496150/74585

— Matthew Lock

1

ฉันขอโทษ. 1 ล้าน? ใน 1 ล้าน?

— beliha

8

@phihag ตอนที่ฉันเรียน CS ในโตรอนโตและผู้สอนพูดว่า "ทุกคนรู้ดีว่าทำไมปฏิทินเกรกอเรียนถึง 10 วันหายไปในเดือนตุลาคมปี 1582" ฉันต้องถามเพื่อนร่วมงานคนหนึ่งที่มองฉันอย่างเต็มใจและพูดว่า " เนื่องจากการใช้ปฏิทินเกรกอเรียนคุณไม่เคยไปโรงเรียนประถมเลย " ฉันไม่ได้ ไม่ได้อยู่ในแคนาดา ฉันไปโรงเรียนประถมในอียิปต์และเรียนเกี่ยวกับปฏิทินอิสลามแทน สิ่งเดียวกันกับคำนำหน้า SI: คุณอาจได้รับประโยชน์จากการศึกษาแบบตะวันตกฉันไม่ได้ทำ แต่ต้องขอบคุณสำหรับทัศนคติที่เอื้ออาทรอย่างไรก็ตาม

— beliha

2

@beliha ค่อนข้างแน่ใจว่าอย่างน้อยที่นี่ในโปรตุเกสฉันไม่เคยได้ยินมาก่อนว่าปฏิทินเกรกอเรียนขาดไป 10 วันในเดือนตุลาคมปี 1582 และฉันเดาว่าฉันไม่ใช่คนเดียว ฉันไม่คิดว่าโรงเรียนไม่เคยสอนสิ่งนั้นจากสิ่งที่ฉันจำได้ดังนั้นมันจะเป็นเรื่องที่ชัดเจนสำหรับใครก็ตามที่คาดหวังให้ทุกคนรู้

— user7393973

1

@beliha ฉันไปโรงเรียนตะวันตกและไม่ได้เรียนรู้ด้วยซ้ำว่าเราใช้ปฏิทินเกรกอเรียน (ไม่ใช่อย่างน้อยก็ใช้ชื่อนี้) เราเพิ่งใช้คำศัพท์ปฏิทินมาตรฐาน และประมาณ 10 วันที่ขาดหายไปฉันเรียนรู้จาก youtube

— Tinaira

15

ขีด จำกัด ในทางปฏิบัติสำหรับฉันคือ ID ที่ฉันสามารถเก็บไว้ในหัวได้นานแค่ไหนในช่วงเวลาที่ฉันทำงานกับ HTML / CSS

โดยปกติขีด จำกัด นี้จะอยู่ระหว่าง 8 ถึง 13 อักขระขึ้นอยู่กับว่าฉันใช้งานมานานแค่ไหนและชื่อนั้นเหมาะสมกับบริบทขององค์ประกอบหรือไม่

— Nick Presta
แหล่งที่มา

5

ฉันจะเพิ่มว่าอาจเป็นไปได้ที่จะขยาย "บัฟเฟอร์ภายใน" โดยใช้คำนำหน้าหากจำเป็น :-)

— Ben Blank

12

คำถามนี้ยังคงสำคัญมากเพราะด้วย RIA บ่อยครั้งที่รหัสถูกสร้างขึ้นโดยรหัสและเพื่อให้ไม่ซ้ำกันอาจมีความยาวได้ ดังตัวอย่าง: window_2_panel_12_group_6_label_2 _...

— Josh

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 -->

อย่างที่คุณเห็นตัวเลือกบางครั้งค่อนข้างยาว แต่ IMHO นั้นง่ายกว่าการทำงานกับบางอย่างเช่นกริด YUI.css ซึ่งคุณจะลงเอยด้วย ID เช่น #doc, #bd, # yui-main เป็นต้น

— มาร์คเฮิร์ด
แหล่งที่มา

3

สิ่งที่ฉันทำมากคือตั้งชื่อพวกเขาตามลำดับดังนั้นให้มี div id = 'ผู้ใช้' จากนั้นภายในนั้นฉันอาจมีสาม divs id = 'user-stats', id = 'user-Inventory', id = 'user- spells 'แล้วพูดภายใน user-stats ฉันอาจมี 5 divs, id =' user-stats-strength ', id =' user-stats-agility ', id =' user-stats-defense ', id =' user- stats-intellect ', id =' user-stats-heath 'ฯลฯ เป็นต้นซึ่งฉันพบว่ามีประโยชน์มากในการจดจำรหัสของพวกเขาตราบเท่าที่ฉันยังคงรูปแบบการตั้งชื่อไว้เช่น -'s หรือ _ สำหรับช่องว่างหรือ camelCase

— Psytronic

2

หากนี่เป็นคำถามเชิงวิชาการก็น่าสนใจทีเดียว ... แต่สำหรับแนวทางปฏิบัติที่ดีที่สุดนั้นเกี่ยวข้องกันคุณไม่จำเป็นต้องหรือต้องการยืดประเด็นเหล่านี้ออกไป หากคุณต้องการเก็บข้อมูลเกี่ยวกับองค์ประกอบ HTML คุณควรใส่ลงในแอตทริบิวต์บนวัตถุ DOM

— Matt Howell
แหล่งที่มา