0

以下のような順序付けられていないリストがあります。

<ul>
    <li class="week6"></li>
    <li class="week6"></li>
    <li class="week6"></li>
    <li class="week6"></li>
    <li class="week6"></li>
</ul>

そして、そのクラスに基づいて、ul の前にテキストを含むヘッダー要素を追加したいと考えています。そのようです：

<h1 class="week">Week 6</h1>
<ul>
    <li class="week6"></li>
    <li class="week6"></li>
    <li class="week6"></li>
    <li class="week6"></li>
    <li class="week6"></li>
</ul>

また、ヘッダー要素内のコンテンツはクラスに基づいており、クラスが "week6" の場合、h1 は "週 6" になり、"week5" クラスは h1 内に "週 5" を出力します。

現在、そのクラスに関連するリスト項目の ul の前に、特定のコンテンツを含む h1 タグを追加するという問題があります。

4

1 に答える 1

3 
$("ul").each(function(){
  var weeknum = $(this).children('li:first').prop('class');
  var weeknum = weeknum.match(/\d+/);
  /* Remove if first li is only a placeholder: $(this).children('li:first').remove(); */
  $(this).before('<h1 class="week">Week '+weeknum+'</h1>');
});

フィドル: http://jsfiddle.net/TGmap/

于 2013-10-18T19:15:59.073 に答える