6

法的情報を含む HTML ドキュメントが多数あります。それぞれのドキュメントは、文字と数字が交互に入れ子になった順序付きリストです。例えば：

<ol type="1">
  <li>First</li>
  <li>Second
    <ol type="a">
      <li>Third</li>
      <li>Fourth
        <ol type="1">
          <li>Fifth</li>
        </ol>
      </li>
      <li>Sixth</li>
    </ol>
  </li>
  <li>Seventh</li>
</ol>

CSS または jQuery を使用して、各リスト項目のフル パスを表示したいので、上記のリストは次のようになります。

1) First
2) Second
  2.a) Third
  2.b) Fourth
    2.b.1) Fifth
  2.c) Sixth
3) Seventh

CSSでカウンターを使用して数字でこれを行うことができることは知っていますが、文字でも同様に行う方法はありますか?

4

3 に答える 3

5

インデックスを追加するための小さなjQueryはどうですか：

var letters = 'abcdefghijklmnopqrstuvwxyz';
$('li').each(function (i, ele) {
    $('<span />', {html : (function() {
        return $(ele).parents('li').addBack().map(function (_, a) {
                 return isNaN( $(a).parent('ol').attr('type') ) ? 
                        letters[$(a).index()] : $(a).index() + 1;
                }).get().join('.') + ')&nbsp;';
     }())}).prependTo(ele);
});

フィドル

于 2013-06-24T21:40:12.160 に答える
0

あなたの後ではありませんが、近いです。これを試して：

<style>
    ol { list-style-type:upper-latin; }
</style>

これにより、インデックス アイテムのラベルが文字として印刷されます。

「1a...2a...2a.a」のようなものが必要な場合は、javascript / サーバー側コードを使用して、プログラムでループ内のリストを構築する必要があります。

于 2013-06-24T21:19:22.157 に答える