Какая библиотека или платформа javascript поддерживает создание «оглавления»?
-
23-08-2019 - |
Вопрос
Я ищу создание 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-модуль для этой цели?
Решение
jQuery твой друг, с этим плагином: оглавление.Домашняя страница http://code.google.com/p/samaxesjs/
Другие советы
Сделай сам, я написал :), надеюсь поможет
добавьте элемент 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) и сгенерирует оглавление.
Это очень простая проблема, которую можно решить с помощью функции из 10-20 строк.Никаких рамок не требуется.Либо пройдите по DOM с помощью getElementsByTagName('h1'), getElementsByTagName('h2'), либо используйте регулярные выражения.Загрузка фреймворков сопряжена с последствиями и рисками для производительности, поэтому я предлагаю не устанавливать их в случае простых проблем.