Разметка упорядоченного списка определений - PullRequest
1 голос
/ 31 января 2010

Я ищу наиболее семантически правильный и разумный метод разметки упорядоченного списка определений. Я думал о следующих способах сделать это.

Сначала я использовал упорядоченный список с 2 абзацами внутри каждого элемента списка. Но потом я вспомнил элемент списка определений.

<dl>
  <dt>Something</dt>
  <dd>Definition</dd>

  <dt>Something2</dt>
  <dd>Definition2</dd>
</dl>

Однако, поскольку мне нужно иметь возможность программно получать доступ к каждому определению через Javascript, я не уверен, что это сработает.

Решением этой проблемы может быть разделение определений на разные теги dl. Но это выглядит не очень хорошо. Есть ли более правильный путь? Или я ошибаюсь, полагая, что доступ к «обычному» списку определений через Javascript сложнее?

<dl>
  <dt>Something</dt>
  <dd>Definition</dd>
</dl>
<dl>
  <dt>Something2</dt>
  <dd>Definition2</dd>
</dl>

Ответы [ 2 ]

2 голосов
/ 31 января 2010

Однако, поскольку мне нужно иметь возможность программно получать доступ к каждому определению через Javascript, я не уверен, что это будет работать.

Просто получите каждый термин определения <dt>, а затем получите элемент рядом с ним в дереве DOM, которое всегда должно быть описанием определения <dd>. jQuery очень помогает здесь. Вот SSCCE , просто скопируйте и вставьте его:

<!doctype html>
<html lang="en">
    <head>
        <title>SO question 2172138</title>
        <script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
        <script>
            $(document).ready(function() {
                $('#dl dt').each(function(i, dt) {
                    dt = $(dt);
                    dds = dt.nextAll().map(function() { return $(this).is('dd') ? this : false; });
                    alert(dt.text() + " = " + dds.text());
                });
            });
        </script>
    </head>
    <body>
        <dl id="dl">
            <dt>Term1</dt><dd>Desc1a</dd><dd>Desc1b</dd>
            <dt>Term2</dt><dd>Desc2a</dd>
            <dt>Term3</dt><dd>Desc3a</dd><dd>Desc3b</dd>
        </dl>
    </body>
</html>
0 голосов
/ 31 января 2010

Используйте имена и идентификаторы.

<dl id="1">

document.getElementById ( "1");

https://developer.mozilla.org/En/DOM/Document.getElementById

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...