هل من الضروري أن يكون <th> في الجدول ؟

StackOverflow https://stackoverflow.com/questions/2278018

سؤال

هل من الضروري أن يكون <th> في الجدول ؟ حتى إذا كان الجدول لا يحتوي العنوان ؟

الجدول 3 أخرى الوسم <thead> <tbody> <tfoot> هل من الضروري استخدام كل شيء حتى لو كان شيء على طاولة تذييل الصفحة.فايرفوكس بشكل افتراضي إضافة كل هذه في التعليمات البرمجية.

و هو ضروري ، <th> دائما يجب أن يكون في <thead>

وإذا كان لدي عنوان في المحتوى المستلم من العميل ، البند من خارج جدول ولكن المتعلقة الجدول ثم كيف ينبغي وضع هذا البند على جدول

كما في الجدول أعلاه

<h3>Heading of table<h3>
<table>......</table>

كما عنوان الجدول

<table>
<thead><tr rowspan=3><th>Heading of table</th></tr></thead>

أو التسمية التوضيحية الجدول

<table>
<caption> Heading of table</caption>

وهو أمر جيد بالنسبة قارئ الشاشة و لغويا صحيحة ؟

هل كانت مفيدة؟

المحلول

بحسب ال HTML DTD هذا هو نموذج المحتوى لجداول HTML:

<!ELEMENT TABLE - -
     (CAPTION?, (COL*|COLGROUP*), THEAD?, TFOOT?, TBODY+)>
<!ELEMENT CAPTION  - - (%inline;)*     -- table caption -->
<!ELEMENT THEAD    - O (TR)+           -- table header -->
<!ELEMENT TFOOT    - O (TR)+           -- table footer -->
<!ELEMENT TBODY    O O (TR)+           -- table body -->
<!ELEMENT COLGROUP - O (COL)*          -- table column group -->
<!ELEMENT COL      - O EMPTY           -- table column -->
<!ELEMENT TR       - O (TH|TD)+        -- table row -->
<!ELEMENT (TH|TD)  - O (%flow;)*       -- table header cell, table data cell-->

لذلك هذا بناء جملة غير قانوني:

<thead><th>Heading of table</th></thead>

يجب أن يكون:

<thead><tr><th>Heading of table</th></tr></thead>

<th> العناصر ليست مطلوبة في أي مكان. إنه ببساطة أحد نوعي الخلية (الكائن الآخر <td>) أنه يمكنك استخدامه في صف الجدول. أ <thead> هو قسم جدول اختياري يمكن أن يحتوي على صف واحد أو أكثر.

تعديل: بما يخص لماذا ليستخدم <thead> هناك عدة أسباب:

  1. متعلق بدلالات الألفاظ:
  2. إمكانية الوصول: يساعد الأشخاص الذين يستخدمون قراء الشاشة لفهم محتويات الجدول ؛
  3. وسائل الإعلام غير الشاشة: قد تسمح لك طباعة جدول متعدد الصفحات بوضع <thead>
  4. التصميم: يمكن تطبيق CSS على <tbody> عناصر، <thead>
  5. JavaScript: غالبًا ما يظهر هذا عند استخدام JQuery والمكتبات المماثلة. المعلومات الإضافية مفيدة في كتابة الرمز.

كمثال على (5) يمكنك القيام بذلك:

$("table > tbody > tr:nth-child(odd)").addClass("odd");

ال <thead> العنصر يعني أن هذه الصفوف لن يتم تصميمها بهذه الطريقة. أو قد تفعل:

$("table > tbody > tr").hover(function() {
  $(this).addClass("hover");
}, function() {
  $(this).removeClass("hover");
});

مع:

tr.hover { background: yellow; }

الذي يستبعد مرة أخرى <thead> الصفوف.

أخيرًا ، تنطبق العديد من هذه الحجج نفسها على استخدامها <th> العناصر أكثر <td> <thead> القسم أو تكون الخلية الأولى في كل صف حسب هيكل وطبيعة طاولتك.

نصائح أخرى

يستخدم <th>s if you are displaying tabular data - use one for each column. It is nice for your regular users and essential for screen readers. لا تستخدم <th>إذا كنت تستخدم الجدول لأغراض التخطيط (أو غيرها من المخططات الشائنة ...)

لا ، ليس من الضروري الحصول على ال. لكن لا يبدو أنك تستخدم الحق. بشكل عام ، لديك واحد لكل عمود. مثال بسيط على استخدامه بشكل صحيح هو:

<table>
<tr><th>Breed</th><th>Name</th></tr>
<tr><td>Pekingese</td><td>Pluto</td></tr>
<tr><td>Lab</td><td>Buddy</td></tr>
</table>

يمكنك أيضا أن تفعل:

<table>
<thead><tr><th>Breed</th><th>Name</th></tr></thead>
<tr><td>Pekingese</td><td>Pluto</td></tr>
<tr><td>Lab</td><td>Buddy</td></tr>
</table>

الجواب

نعم!

إذا كنت تستخدم الجداول لعرض جداول البيانات.

جداول البيانات يتم تنظيمها في صفوف وأعمدة لسبب ما. معنى الإسناد في خلية جدول يعرف معنى الصف والعمود الذي يظهر.

من المهم تحديد تلك الخلايا التي تعطي معنى الصفوف والأعمدة على حدة بدلا من الخلايا التي تحتوي على البيانات.

على سبيل المثال الجدول التالي ينقل على الإطلاق أي معلومات ذات مغزى:

34 56 90 15
45 65 85 30
50 55 70 35

أرقام فقط يكون لها معنى إذا كانت الصفوف والأعمدة هي الأسماء.تلك الأسماء التي تم وضع علامة حتى باستخدام <th>:

    فبراير قد Aug نوفمبر
ITH
JFK
IST

بالطبع, نحن لا تزال لا تعرف ماذا تعني هذه الارقام وهذا هو السبب <caption> هو مطلوب:

متوسط درجات الحرارة خلال شهر المطارات المختارة
    فبراير قد Aug نوفمبر
ITH
JFK
IST

وأخيرا ، من المهم أن نلاحظ تفاصيل مثل وحدات القياس مصادر البيانات وما إلى ذلك.هذا النوع من المعلومات عادة ما يذهب في ذيل الجدول:

متوسط درجات الحرارة خلال شهر المطارات المختارة
    فبراير قد Aug نوفمبر
ITH
JFK
IST
Temperatures in °F. Source: Publication #456 MNMO

عنوان الجدول يذهب إلى <caption>.على <thead> و <tfoot> أقسام هي مفيدة بشكل خاص عندما طاولة ينمو كبيرة.انظر كيفية التعامل مع فواصل الصفحات عند الطباعة الكبيرة جدول HTML على سبيل المثال.

يمكنك استخدام <colgroups> إلى مجموعة معا منطقيا البيانات ذات الصلة.

تريد استخدام ما يصف بياناتك بشكل أفضل.

<caption> سوف تصف الجدول بأكمله. th سيقوم بإنشاء خلية واحدة تستخدم عادة لوصف عمود واحد (ولكن يمكن استخدامها أيضًا لعناوين الصفوف).

thead, tfoot, ، و tbody. يمكن استخدام كل شيء وكل شيء اختياري بشرط أن يكونوا بهذا الترتيب ، إذا تم استخدامه ، وكان لديك واحد فقط thead و واحد tfoot (ولكن يمكنك الحصول على متعددة tbody. Many browsers (all?) will add them implicitly if you don't, but the spec says they're optional.

th يمكن أن تظهر داخل أي tr بغض النظر عن مكان tr هو.

<table>
     <tr>
        <td>text</td>
     </tr>      
</table>

هذا هو الحد الأدنى من الجدول الذي يمكنني التفكير فيه.

الفوائد هي دلالات. ال <th> يعني ر قادر ح eader. استخدمه لتمييز رؤوس الأعمدة الخاصة بك. عموما داخل أ <thead>.

مرخصة بموجب: CC-BY-SA مع الإسناد
لا تنتمي إلى StackOverflow
scroll top