-------------------
Вы знаете, как устроен наш мир?



---Load files---
Совет: если изображения отображаются неправильно, попробуйте очистить кеш браузера!
Поиск на странице - нажмите "Ctrl+F", Поиск на сайте - поле ввода "Яндекс-Найти" на "шапке",
Поиск в интернете - 1) выделите текст, 2) нажмите правую клавишу мыши и 3) выберите поисковик.

С О Д Е Р Ж А Н И Е

------- Тимин В.А. (mail: timinva@yandex.ru) Дата последней загрузки: April 24 2018. -------
Ссылка на этот материал: instrukciya_po_vstavkye_oglavlyeniya.htm)
Автоматическое оглавление HTML страницы

Автоматическое оглавление HTML страницы

Инструкция по внедрению в документ

Для создания оглавления используются возможности скрипта jQuery.min, вызываемого с сайта разработчика:

<script src="http://code.jquery.com/jquery.min.js" type="text/javascript"></script>

Кроме него, дополнительно используется специально разработанный скрипт,

<script type="text/javascript" src="oglavlenie.js"></script></script>

который можно:

  • 1) либо вставить непосредственно в текст страницы - пример этого случая приведен в файле-шаблоне oglavlenie.htm; Внимание! В поле src= должен быть указан адрес скрипта oglavlenie.js на вашем сайте.

  • либо

  • 2) вызывать из js-файла. Пример HTM-файла для файла в корневой папке приведен в файле-шаблоне oglavlenie_js.htm.

Файл скрипта состоит из двух частей.

  • Первая часть записывает во все теги h1, h2, h3 новый идентификатор id="h_id_N", где N изменяется. Он необходим, если теги h1,h2,h3 не идентифицированы, но все равно нужно оглавить. Иначе этот часть скрипта можно и не вставлять.

  • Вторая часть скрипта  читает со всех тегов h1, h2, h3 внутри блокового тега <articles> ... < /articles>  идентификатор и текст пункта оглавления и создает из них оглавление со ссылками. Не  <article>, а именно <articles> - не существующий тег. Но с ним все это работает. Можно любой другой, но тогда необходимо сменить соответствующий параметр в коде js.

Текст скрипта на jQuery.min:

//Первая часть кода:
<script type="text/javascript">
$(document).ready(function(){
$("h1,h2,h3").attr("id", function (arr) {return "h_id_" + arr;})//Замена всех идентификаторов
.each(function () {
//$("span", this).html("(ID = '<b>" + this.id + "</b>')"); //Замена текста оглавления
});
});

//Вторая часть кода:
$(document).ready(function() {
var Tab_Ogl = "<nav role='navigation' class='table-of-contents'>" + "<h2>Оглавление:</h2>" + "<ul>";
var newLine, elOgl, txtOgl, Ident;
$("articles h1, articles h2, articles h3").each(function() {
elOgl = $(this); //Этот заголовок
Ident = "#" + elOgl.attr("id"); //Чтение идентификатора заголовка
l= $(Ident).length; //Количество свойств
if (l>0){
txtOgl = elOgl.text(); //Текст заголовка
newLine = "<li>" + "<a href='" + Ident + "'>" + txtOgl + "</a>" + "</li>";
Tab_Ogl += newLine; //Добавление новой строки заголовка
};
});
Tab_Ogl += "</ul>" + "</nav>"; //Закрытие строки закрывающими тегами
$(".oglavlenie").prepend(Tab_Ogl);//Запись собранного заголовка в элемент Div
});
</script>

-- Вызов скриптов пишется перед блоком<body>

    <body>

-- Ваш content 0.1 (до <articles> не оглавляется) --

-- На это место вставляется автоматическое оглавление. Это div- блок с идентификатором "oglavlenie":

<div id="oglavlenie"></div>

--  А это созданное автоматически оглавление:
-- *-------------------------------------------------
-- Начало анализируемого блока может быть в любом месте.  Соблюдайте правила вложения объектов! :

<articles>(Далее оглавляется!)

Заголовок 1

-- Ваш текст 1 --

Заголовок 2

-- Ваш текст 2 --

Заголовок 3

-- Ваш текст 3--

Заголовок 4

-- Ваш текст 4--

-- Конец анализирумого блока может быть в любом месте. Соблюдайте правила вложения объектов! :

</articles>Далее не оглавляется!

-- Ваш текст 4 (!этот заголовок после </articles> и не оглавляется) --

Вложения

Вложениe: oglavlenie.rar

Пишите timinva@yandex.ru
Ссылка на этот материал: instrukciya_po_vstavkye_oglavlyeniya.htm)

- - - ВЫ МОЖЕТЕ ОСТАВИТЬ ПЕРВЫЙ КОММЕНТАРИЙ! - - -


Введите логин:      Введите эл.адрес:

Введите пароль:    Ваш телефон:        

Введите Ваш комментарий:
Формулы:

(возможно использование BB-кодов для оформления комментария и кодов LaTeX для ввода формул)

Решите пример: 48 делить на "двенадцать" =

---Load files---
Сегодня - 24_10_2019
Время переоткрытия сайта 04 ч 27 м по Гр.
Календарь
на ОКТЯБРЬ месяц 2018 г.
Пн Вт Ср Чт Пт Сб Вс
1 2 3 4 5 6
7 8 9 10 11 12 13
14 15 16 17 18 19 20
21 22 2 24 25 26 27
28 29 30 31 1 2 3
(10 231)

---Load files---
---Load files---


© Все права защищены 2017-2019 При использовании материалов сайта ссылка на http://lowsofphisics.ru обязательна.

В НАЧАЛО
КОММЕНТ
В КОНЕЦ
U:2 V:3 N:3
Уникальных посетителей за текущие сутки: 2 Просмотров: 3 Этой страницы (всего): 3