Какая библиотека или платформа javascript поддерживает создание «оглавления»?

Question

Я ищу создание javascript «Оглавление» на лету из HTML (с привязками).

Пример:

<h1>First level1 heading</h1>
lorem ipsum
<h2>1a heading</h2>
lorem ipsum
<h2>1b heading</h2>
lorem ipsum
<h1>Second level1 heading</h1>
lorem ipsum

Должно вернуть что-то вроде

 First level1 heading   
   1a heading   
   1b heading 
 Second level1 heading

со строками, связанными с заголовками, а также исходный HTML-код должен быть возвращен со вставленными привязками.

Есть ли что-то включенное в одну из больших библиотек или фреймворков JavaScript?

Если ни один из них не видел, видел ли кто-нибудь хороший JS-модуль для этой цели?

Answer 1

jQuery твой друг, с этим плагином: оглавление.Домашняя страница http://code.google.com/p/samaxesjs/

Answer 2

Сделай сам, я написал :), надеюсь поможет

добавьте элемент div в качестве первого дочернего элемента элемента body и укажите идентификатор как «tableOfContents»

и добавьте приведенный ниже скрипт в качестве последнего дочернего элемента элемента body

<script>
    var el = document.getElementsByTagName("*") || [];
    var toc = "<ul>";
    var lvl = 1;
    for(var i=0;i<el.length;i++)
    {
        var ce = el[i];
        var tag = ce.tagName + "";
        var m = tag.match(/^h([1-5])$/i);
        if(m)
        {
            var n = Number(m[1]);
            if(lvl > n)
            {
                while(lvl-->n)toc+="</ul></li>";  
            }else if(lvl < n){
                while(lvl++<n)toc+="<li style='list-style:none'><ul>";
            }
            toc +=  '<li><a href="#toc_' + i + '">' + 
                    (ce.innerText || ce.text()) +
                    '</a></li>';
            var ta = document.createElement("div");
            ta.innerHTML = '<a name="toc_' + i + '" />';
            ce.insertBefore(ta, ce.firstChild);
        }
    }
    while(lvl-->1)toc+="</ul></li>";
    toc+="</ul>";
    document.getElementById("tableOfContents").
        innerHTML = toc;
</script>

этот скрипт обнаружит каждую букву H (от 1 до 5) и сгенерирует оглавление.

Answer 3

Это очень простая проблема, которую можно решить с помощью функции из 10-20 строк.Никаких рамок не требуется.Либо пройдите по DOM с помощью getElementsByTagName('h1'), getElementsByTagName('h2'), либо используйте регулярные выражения.Загрузка фреймворков сопряжена с последствиями и рисками для производительности, поэтому я предлагаю не устанавливать их в случае простых проблем.