Главная » Блоги » блог teerex

Автоматическое добавление якорей (содержание) на основе заголовков (h2) в контенте

25 Январь, 2012 - 10:35, teerex

Код на Javascript под jquery, но алгоритм понятен и не должно составить труда адаптировать под другие языки.

Описание

В коде html элемента с id="mainCol" ищутся заголовки h2 и перед заголовками добавляются якоря. Ссылки на якоря выносятся в элемент id="subNav".
Пример активен на этой странице.

Код примера

<script type="text/javascript">
  $(document).ready(function(){
  $('#mainCol h2').each(function(){
  var thisText = $(this).text();
  var anchorText = thisText.replace(/ /g, "-");
  var anchorLink = '<a name="' + anchorText + '"></a>';
  var anchorText = '<a href="#' + anchorText + '">' + thisText + '</a><br />'; 
  $(this).before(anchorLink);
  $(anchorText).appendTo('#subNav');
  });
  });
</script>

Метки:

# | Игорь (?)

анонимус аватар

Как сделать чтобы оглавление получалось нумерованным ?
вот так -
1. Описание
2. Код примера

29 Декабрь, 2014 - 11:57

Оставить комментарий

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

Подробнее о форматировании

КАПЧА
А ты не робот? Введи 5 цифр
                                                                   
  ad88888ba      ad8888ba,           ,d8      ad88888ba        88  
 d8"     "88    8P'    "Y8         ,d888     d8"     "8b     ,d88  
 8P       88   d8                ,d8" 88     Y8a     a8P   888888  
 Y8,    ,d88   88,dd888bb,     ,d8"   88      "Y8aaa8P"        88  
  "PPPPPP"88   88P'    `8b   ,d8"     88      ,d8"""8b,        88  
          8P   88       d8   8888888888888   d8"     "8b       88  
 8b,    a8P    88a     a8P            88     Y8a     a8P       88  
 `"Y8888P'      "Y88888P"             88      "Y88888P"        88
Enter the code depicted in ASCII art style.
To prevent automated spam submissions leave this field empty.