Списъчни структури

В HTML/XHTML съществуват три вида списъчни структури (това е към момента на писане на статията, в бъдещите версии на езиците дали HTML5 или XHTML2 вероятно ще има допълнения към списъците):

  • подредени
  • неподредени
  • дефинируеми

Ще използвам един пример от живота, за да мога да Ви покажа, освен структурата… и кои списъци, в кои случаи се ползват.

Неподреден списък

Имам един малък приятел с голяма конструкторска мисъл.
Наскоро получи подарък – конструктор LEGO.
Вътре, освен безброините парчетиики имаше и едно прекрасно ръководство за младите конструктори.

Както Ви споменах – хиляди парченца и всичките бяха прилежно изброени в ръководството.

  • Елемент N390 x 90 броики
  • Елемент N50 x 16 броики
  • Елемент N130 x 72 броики
  • .
  • .
  • .
  • Елемент N13 x 26 броики

Току що Ви показах един неподреден списък.

Последователното изброяване на елементи, правила, задачи, приоритети, структури и т.н.
без да има (строга) зависимост в поредността се нарича неподреден списък.

Съгласно препоръките на W3 за неподреден списък в X/HTML – примерът ще има следният вид:

<ul>
    <li>Елемент N390 x 90 броики</li>
    <li>Елемент N50 x 16 броики</li>
    <li>Елемент N130 x 72 броики</li>
    <li>.</li>
    <li>.</li>
    <li>.</li>
    <li>Елемент N13 x 26 броики</li>
</ul>

Подреден списък

След прегледа на всички елементи и сортирането им по купчинки с малкият конструктор пристъпихме
към създаването на „нещо“ невиждано от никого. В тридневната ни борба с парчета и залялата ни
еуфория не бяхме обърнали внимание на останалата част от ръководството. Уморени, седнали настрана
прелистихме страниците и какво беше учудването ни, когато разбрахме, че има схеми за създаването
на прекрасен спротен автомобил от разхвърляните вече парчетиики. Всичките стъпки за постигането
на целта бяха описани последователно и много прилежно със схеми.

  • 1. Поставя се Елемент N130
  • 2. Поставя се Елемент N13 в дясно на предходният на две от пъпките
  • 3. Поставя се Елемент N390 между получилата се сглобка на първите два елемента
  • .
  • .
  • .
  • n. Поставя се Елемент N50

… и… Бинго… Най-прекрсаното BMW серия 5.

Един прекрасен пример за подреден списък.

Изброяването на елементи, правила, задачи, приоритети, структури и т.н. в
строга последователност се нарича подреден списък.

Съгласно препоръките на W3 за подреден списък в X/HTML – примерът ще има следният вид:

<ol>
    <li>Поставя се Елемент N130</li>
    <li>Поставя се Елемент N13 в дясно на предходният на две от
пъпките</li>
    <li>Поставя се Елемент N390 между получилата се сглобка на
първите два елемента</li>
    <li>.</li>
    <li>.</li>
    <li>.</li>
    <li>Поставя се Елемент N50</li>
</ol>

Дефиниционен списък

Бяхме горди. Следваше моментът да се изфукаме. Но… Понеже бяхме „натрупали“ опит, за всеки
случай прелистихме книжката докрай. Нищо интересно. Бяха написани елеметите с имената им,
функциите които би трябвало да изпълняват, цвят, размер и т.н. Останахме учудени с малкият ми
приятел на описанието на задната въздушна спирачка – всъщност, то беше спойлер. А да не ви казвам,
че според призводителя нашата полицеска сирена (която собственоръчно бяхме боядисали синя) се оказа тебелка за такси.

  • Елемент N130
  •  – Автомобилни гуми. Черни. Мишелин. Двоен стеснен отвеждащ нарез. Безкамерни и т.н. Служи за… и т.н.
  • Елемент N13
  •  – Шарнитрен болт и т.н. Служи за… и т.н.
  • Елемент N390
  •  – Дискова спирачка. Служи за… и т.н.
  • .
  • .
  • .
  • Елемент N50
  •  – Таксиметрова табелка (хм…). Жълта (вече синя). Служи за… и т.н.

Дефиниционен списък e разширен неподреден списък. Освен избраяването имаме и
допълнителна дефинуруема част за всеки един елемент от списъка.

Съгласно препоръките на W3 за дефиниционен списък в X/HTML – примерът ще има следният вид:

<dl>
    <dt>Елемент N130</dt>
        <dd>Автомобилни гуми</dd>
        <dd>Черни</dd>
        <dd>Мишелин</dd>
        <dd>Двоен стеснен отвеждащ нарез</dd>
        <dd>Безкамерни и т.н.</dd>
        <dd>Служи за… и т.н.</dd>
    <dt>Елемент N13</dt>
        <dd>Шарнитрен болт и т.н.</dd>
        <dd>Служи за… и т.н.</dd>
        <dt>Елемент N390</dt>
        <dd>Дискова спирачка</dd>
        <dd>Служи за… и т.н.</dd>
        <dd>.</dd>
        <dd>.</dd>
        <dd>.</dd>
    <dt>Елемент N50</dt>
        <dd>Таксиметрова табелка.</dd>
        <dd>Жълта</dd>
    <dd>Служи за… и т.н.</dd>
</dl>

Е. Голямо фукане падна.

Толкова за списъчните структури.

Вашият коментар

This site uses Akismet to reduce spam. Learn how your comment data is processed.