二级标题

三级标题

三级标题

三级标题

三级标题

三级标题

二级标题

三级标题

三级标题

三级标题

三级标题

三级标题

这里是现在页尾目录功能的代码源码：

  1. <!-- 目录索引列表生成 -->
  2. <script language="javascript" type="text/javascript">
  4. function GenerateContentList()
  5. {
  6.     if ($('#cnblogs_post_body').length == 0) { return; }
  7.     var jquery_h1_list = $('#cnblogs_post_body h1');
  8.     var jquery_h2_list = $('#cnblogs_post_body h2');
  9.     var jquery_h3_list = $('#cnblogs_post_body h3');
  11.     if (jquery_h1_list.length != 0)
  12.     {
  13.         var content = '<a name="_labelTop"></a>';
  14.         content    += '<div id="navCategory">';
  15.         content    += '<p style="font-size:18px"><b>目录</b></p>';
  16.         content += '<ul class="first_class_ul">';
  18.         for (var i = 0; i < jquery_h1_list.length; i++)
  19.         {
  20.             var go_to_top = '<div style="text-align: right"><a href="#_labelTop">返回目录</a><a name="_label' + i + '"></a></div>';
  21.             $(jquery_h1_list[i]).before(go_to_top);
  22.             var li_content = '<li><a href="#_label' + i + '">' + $(jquery_h1_list[i]).text() + '</a></li>';
  23.             var nextH1Index = i + 1;
  24.             if (nextH1Index == jquery_h1_list.length) { nextH1Index = 0; }
  25.             var jquery_h2_list = $(jquery_h1_list[i]).nextUntil(jquery_h1_list[nextH1Index], "h2");
  26.             if (jquery_h2_list.length > 0)
  27.             {
  28.                 li_content += '<ul class="second_class_ul">';
  29.             }
  30.             for (var j = 0; j < jquery_h2_list.length; j++)
  31.             {
  32.                 var go_to_top2 = '<div style="text-align: right"><a href="#_labelTop">返回目录</a><a name="_lab2_'+ i + '_' + j + '"></a></div>';
  33.                 $(jquery_h2_list[j]).before(go_to_top2);
  34.                 li_content +='<li><a href="#_lab2_'+ i +'_' + j + '">' + $(jquery_h2_list[j]).text() + '</a></li>';
  35.                 var nextH2Index = j + 1;
  36.                 var next;
  37.                 if (nextH2Index == jquery_h2_list.length)
  38.                 {
  39.                     if (i + 1 == jquery_h1_list.length)
  40.                     {
  41.                         next = jquery_h1_list[0];
  42.                     }
  43.                     else
  44.                     {
  45.                         next = jquery_h1_list[i + 1];
  46.                     }
  47.                 }
  48.                 else
  49.                 {
  50.                     next = jquery_h2_list[nextH2Index];
  51.                 }
  52.                 var jquery_h3_list = $(jquery_h2_list[j]).nextUntil(next, "h3");
  53.                 if (jquery_h3_list.length > 0)
  54.                 {
  55.                     li_content += '<ul class="third_class_ul">';
  56.                 }
  57.                 for (var k = 0; k < jquery_h3_list.length; k++)
  58.                 {
  59.                     var go_to_third_Content = '<div style="text-align: right"><a href="#_labelTop"></a><a name="_label3_' + i + '_' + j + '_' + k + '"></a></div>';
  60.                     $(jquery_h3_list[k]).before(go_to_third_Content);
  61.                     li_content += '<li><a href="#_label3_' + i + '_' + j + '_' + k + '">' + $(jquery_h3_list[k]).text() + '</a></li>';
  62.                 }
  63.                 if (jquery_h3_list.length > 0)
  64.                 {
  65.                     li_content += '</ul>';
  66.                 }
  67.                 li_content += '</li>';
  68.             }
  69.             if (jquery_h2_list.length > 0)
  70.             {
  71.                 li_content +='</ul>';
  72.             }
  73.             li_content +='</li>';
  74.             content += li_content;
  75.         }
  76.         content    += '</ul>';
  77.         content    += '</div>';
  78.     }
  79.     else if (jquery_h2_list.length != 0)
  80.     {
  81.         var content = '<a name="_labelTop"></a>';
  82.         content    += '<div id="navCategory">';
  83.         content    += '<p style="font-size:18px"><b>目录</b></p>';
  84.         content    += '<ul class="second_class_ul">';
  85.         for(var i =0; i < jquery_h2_list.length; i++)
  86.         {
  87.             var go_to_top2 = '<div style="text-align: right"><a href="#_labelTop">返回目录</a><a name="_lab2_'+ i + '_' + j + '"></a></div>';
  88.             $(jquery_h2_list[j]).before(go_to_top2);
  89.             var li_content = '<li><a href="#_lab' + i + '">' + $(jquery_h2_list[i]).text() + '</a></li>';
  90.             var nextH1Index = i + 1;
  91.             if (nextH1Index == jquery_h2_list.length) { nextH1Index = 0; }
  92.             var jquery_h3_list = $(jquery_h2_list[i]).nextUntil(jquery_h2_list[i+1], "h3");
  93.             if(jquery_h3_list.length>0)
  94.             {
  95.                 li_content +='<ul class="third_class_ul">';
  96.             }
  97.             for(var j = 0;j < jquery_h3_list.length;j++)
  98.             {
  99.                 var go_to_third_Content = '<div style="text-align: right"><a href="#_labelTop"></a><a name="_label3_' + i + '_' + j + '_' + k + '"></a></div>';
  100.                 $(jquery_h3_list[k]).before(go_to_third_Content);
  101.                 li_content +='<li><a href="#_lab2'+ i +'_' + j + '">' + $(jquery_h3_list[j]).text() + '</a></li>';
  102.             }
  103.             if(jquery_h3_list.length>0)
  104.             {
  105.                 li_content +='</ul>';
  106.             }
  107.             li_content +='</li>';
  108.             content += li_content;
  109.         }
  110.         content    += '</ul>';
  111.         content    += '</div>';
  112.     }
  113.     else if (jquery_h3_list.length != 0)
  114.     {
  115.         var content = '<a name="_labelTop"></a>';
  116.         content    += '<div id="navCategory">';
  117.         content    += '<p style="font-size:18px"><b>目录</b></p>';
  118.         content    += '<ul>';
  119.         for(var i = 0; i < jquery_h3_list.length; i++)
  120.         {
  121.             var go_to_third_Content = '<div style="text-align: right"><a href="#_labelTop"></a><a name="_label3_' + i + '"></a></div>';
  122.             $(jquery_h3_list[k]).before(go_to_third_Content);
  123.             var li_content = '<li><a href="#_label3' + i + '">' + $(jquery_h3_list[i]).text() + '</a></li>';
  124.             content += li_content;
  125.         }
  126.         content    += '</ul>';
  127.         content    += '</div>';
  128.     }
  129.     else
  130.     {
  131.         return;
  132.     }
  133. $($('#cnblogs_post_body')[0]).prepend(content);
  134. }
  135. GenerateContentList();
  136. </script>

有bug，我看见了，但是我改过了之后，还是一样的，没有成功。

以下是第一次修改后的代码段：

  1. <!-- 目录索引列表生成 -->
  2. <script language="javascript" type="text/javascript">
  4. function GenerateContentList()
  5. {
  6.     if ($('#cnblogs_post_body').length == 0) { return; }
  7.     var jquery_h1_list = $('#cnblogs_post_body h1');
  8.     var jquery_h2_list = $('#cnblogs_post_body h2');
  9.     var jquery_h3_list = $('#cnblogs_post_body h3');
  11.     if (jquery_h1_list.length != 0)
  12.     {
  13.         var content = '<a name="_labelTop"></a>';
  14.         content    += '<div id="navCategory">';
  15.         content    += '<p style="font-size:18px"><b>目录</b></p>';
  16.         content += '<ul class="first_class_ul">';
  18.         for (var i = 0; i < jquery_h1_list.length; i++)
  19.         {
  20.             var go_to_top = '<div style="text-align: right"><a href="#_labelTop">返回目录</a><a name="_label' + i + '"></a></div>';
  21.             $(jquery_h1_list[i]).before(go_to_top);
  22.             var li_content = '<li><a href="#_label' + i + '">' + $(jquery_h1_list[i]).text() + '</a></li>';
  23.             var nextH1Index = i + 1;
  24.             if (nextH1Index == jquery_h1_list.length) { nextH1Index = 0; }
  25.             var jquery_h2_list = $(jquery_h1_list[i]).nextUntil(jquery_h1_list[nextH1Index], "h2");
  26.             if (jquery_h2_list.length > 0)
  27.             {
  28.                 li_content += '<ul class="second_class_ul">';
  29.             }
  30.             for (var j = 0; j < jquery_h2_list.length; j++)
  31.             {
  32.                 var go_to_top2 = '<div style="text-align: right"><a href="#_labelTop">返回目录</a><a name="_lab2_'+ i + '_' + j + '"></a></div>';
  33.                 $(jquery_h2_list[j]).before(go_to_top2);
  34.                 li_content +='<li><a href="#_lab2_'+ i +'_' + j + '">' + $(jquery_h2_list[j]).text() + '</a></li>';
  35.                 var nextH2Index = j + 1;
  36.                 var next;
  37.                 if (nextH2Index == jquery_h2_list.length)
  38.                 {
  39.                     if (i + 1 == jquery_h1_list.length)
  40.                     {
  41.                         next = jquery_h1_list[0];
  42.                     }
  43.                     else
  44.                     {
  45.                         next = jquery_h1_list[i + 1];
  46.                     }
  47.                 }
  48.                 else
  49.                 {
  50.                     next = jquery_h2_list[nextH2Index];
  51.                 }
  52.                 var jquery_h3_list = $(jquery_h2_list[j]).nextUntil(next, "h3");
  53.                 if (jquery_h3_list.length > 0)
  54.                 {
  55.                     li_content += '<ul class="third_class_ul">';
  56.                 }
  57.                 for (var k = 0; k < jquery_h3_list.length; k++)
  58.                 {
  59.                     var go_to_third_Content = '<div style="text-align: right"><a href="#_labelTop"></a><a name="_label3_' + i + '_' + j + '_' + k + '"></a></div>';
  60.                     $(jquery_h3_list[k]).before(go_to_third_Content);
  61.                     li_content += '<li><a href="#_label3_' + i + '_' + j + '_' + k + '">' + $(jquery_h3_list[k]).text() + '</a></li>';
  62.                 }
  63.                 if (jquery_h3_list.length > 0)
  64.                 {
  65.                     li_content += '</ul>';
  66.                 }
  67.                 li_content += '</li>';
  68.             }
  69.             if (jquery_h2_list.length > 0)
  70.             {
  71.                 li_content +='</ul>';
  72.             }
  73.             li_content +='</li>';
  74.             content += li_content;
  75.         }
  76.         content    += '</ul>';
  77.         content    += '</div>';
  78.     }
  79.     else if (jquery_h2_list.length != 0)
  80.     {
  81.         if ($('#cnblogs_post_body').length == 0) { return; }
  82.         var jquery_h2_list = $('#cnblogs_post_body h2');
  83.         var jquery_h3_list = $('#cnblogs_post_body h3');
  84.         var content = '<a name="_labelTop"></a>';
  85.         content    += '<div id="navCategory">';
  86.         content    += '<p style="font-size:18px"><b>目录</b></p>';
  87.         content    += '<ul class="second_class_ul">';
  88.         for(var i =0; i < jquery_h2_list.length; i++)
  89.         {
  90.             var go_to_top2 = '<div style="text-align: right"><a href="#_labelTop">返回目录</a><a name="_lab2_'+ i + '_' + j + '"></a></div>';
  91.             $(jquery_h2_list[j]).before(go_to_top2);
  92.             var li_content = '<li><a href="#_lab2' + i + '">' + $(jquery_h2_list[i]).text() + '</a></li>';
  93.             var nextH1Index = i + 1;
  94.             if (nextH1Index == jquery_h2_list.length) { nextH1Index = 0; }
  95.             var jquery_h3_list = $(jquery_h2_list[i]).nextUntil(jquery_h2_list[i+1], "h3");
  96.             if(jquery_h3_list.length>0)
  97.             {
  98.                 li_content +='<ul class="third_class_ul">';
  99.             }
  100.             for(var j = 0;j < jquery_h3_list.length;j++)
  101.             {
  102.                 var go_to_third_Content = '<div style="text-align: right"><a href="#_labelTop"></a><a name="_label3_' + i + '_' + j + '_' + k + '"></a></div>';
  103.                 $(jquery_h3_list[k]).before(go_to_third_Content);
  104.                 li_content +='<li><a href="#_label3_'+ i +'_' + j + '">' + $(jquery_h3_list[j]).text() + '</a></li>';
  105.             }
  106.             if(jquery_h3_list.length>0)
  107.             {
  108.                 li_content +='</ul>';
  109.             }
  110.             li_content +='</li>';
  111.             content += li_content;
  112.         }
  113.         content    += '</ul>';
  114.         content    += '</div>';
  115.     }
  116.     else if (jquery_h3_list.length != 0)
  117.     {
  118.         if ($('#cnblogs_post_body').length == 0) { return; }
  119.         var jquery_h3_list = $('#cnblogs_post_body h3');
  120.         var content = '<a name="_labelTop"></a>';
  121.         content    += '<div id="navCategory">';
  122.         content    += '<p style="font-size:18px"><b>目录</b></p>';
  123.         content    += '<ul>';
  124.         for(var i = 0; i < jquery_h3_list.length; i++)
  125.         {
  126.             var go_to_third_Content = '<div style="text-align: right"><a href="#_labelTop"></a><a name="_label3_' + i + '"></a></div>';
  127.             $(jquery_h3_list[k]).before(go_to_third_Content);
  128.             var li_content = '<li><a href="#_label3_' + i + '">' + $(jquery_h3_list[i]).text() + '</a></li>';
  129.             content += li_content;
  130.         }
  131.         li_content +='</li>';
  132.         content    += '</ul>';
  133.         content    += '</div>';
  134.     }
  135.     else
  136.     {
  137.         return;
  138.     }
  139. $($('#cnblogs_post_body')[0]).prepend(content);
  140. }
  141. GenerateContentList();
  142. </script>

导出目录的JS代码，与目录的三级标题测试的更多相关文章

  1. JSCover+WebDriver/Selenium获得JS 代码覆盖

    我们看JSCover(http://tntim96.github.io/JSCover/manual/manual.xml)介绍及使用说明的时候,往往被图形界面所吸引.这样的方式比較适合手工操作,点击 ...

  2. JAVA 导出 Excel， JS 导出 Excel

    本介绍两种Excle导出方法: JAVA 导出 Excle, JS 导出 Excle 1, js 根据 html 页面的 table > tr > td 标签导出 js代码: //导出 v ...

  3. Node.js教程系列~目录

    Node.js这个东西在近几年火起来了,而且会一直火下去,无论在infoq还是在cnblogs,csdn上,都可以到处看到它的样子,它主推的应该就是异步式I/O 吧,是的,设计的很完美,很吸引人,虽然 ...

  4. 【Django】基于Django架构网站代码的目录结构

     经典的Django项目源码目录结构 Django在一个项目的目录结构划分方面缺乏必要的规范.在Django的官方文档中并没有给出大型项目的代码建议目录结构,网上的文章也是根据项目的不同结构也有适当的 ...

  5. vue源码分析—Vue.js 源码目录设计

    Vue.js 的源码都在 src 目录下,其目录结构如下 src ├── compiler # 编译相关 ├── core # 核心代码 ├── platforms # 不同平台的支持 ├── ser ...

  6. java代码实现目录结构

    今天用java代码来实现.像我们电脑盘符那样的目录结构.在代码开始之前首先.介绍一下.用.java代码实现目录的思想. 第一步:完成基础的.大家想.我们是如何获取文件的.是不是用File类,直接就获取 ...

  7. [笔记][Web]利用JS生成博文目录及CSS定制博客

    0. 简介 进入到cnblog这个大园子以后,和其他的一些博客网站比起来,少了些小功能,比如旁边CSDN上的目录.不过好在大神辈出,博客园可以通过申请JS权限来进行目录的生成. 由于本人在JS以及CS ...

  8. Vue.js 源码目录设计（二）

    Vue.js 的源码都在 src 目录下,其目录结构如下. src ├── compiler # 编译相关 ├── core # 核心代码 ├── platforms # 不同平台的支持 ├── se ...

  9. 使用FreePic2Pdf导出书签至Word建立层级目录——快速初始化Word笔记本目录

    使用FreePic2Pdf导出书签至Word建立层级目录 --快速初始化Word笔记本目录 文:安徽师范大学2014级计算机科学与技术 王昊 (Get Contact:441301158@qq.com ...

随机推荐

  1. GitHub Learning Lab

    GitHub Learning Lab https://lab.github.com/ https://github.community/t5/GitHub-Learning-Lab/bd-p/lea ...

  2. 如何在Pycharm中自动添加时间日期、作者等信息

    参考下面的内容 #_author_='Lucky';#date: ${DATE}

  3. Kubernetes中分布式存储Rook-Ceph部署快速演练

    最近在项目中有涉及到Kubernetes的分布式存储部分的内容,也抽空多了解了一些.项目主要基于Rook-Ceph运行,考虑到Rook-Ceph部署也不那么简单,官方文档的步骤起点也不算低,因此,在整 ...

  4. 用Vue3构建企业级前端应用，TS能让你更轻松点

    摘要:Vue 3已经发布有一段时间了,到底有哪些新特性值得关注,如何用它构建企业级前端项目,怎样快速上手Vue 3?本篇文章将对此进行详细讲解. 前言 工欲善其事,必先利其器 --<论语> ...

  5. su: Authentication failure解决方法

    su命令不能切换root,提示su: Authentication failure,需要sudo passwd root一次之后,下次再su的时候只要输入密码就可以成功登录.

  6. 从零开始使用 webpack5 搭建 react 项目

    本文的示例项目源码可以点击 这里 获取 一.前言 webpack5 也已经发布一段时间了,其模块联邦.bundle 缓存等新特性值得在项目中进行使用.经过笔者在公司实际项目中的升级结果来看,其提升效果 ...

  7. Java基础自学小项目

    实现一个基于文本界面的<家庭记账软件> 需求:能够记录家庭的收入,支出,并能够收支明细表 主要涉及一下知识点: - 局部变量和基本数据类型 - 循环语句 - 分支语句 - 方法调用和返回值 ...

  8. 图解CyclicBarrier运动员接力赛

    图解游戏规则 大家都知道运动员短跑接力赛,今天我们并不是讲接力赛,我们讲"接力协作赛",需要我们重新定义下游戏规则:如下图所示 现在有运动员A,B,先定义游戏规则:赛道目前是300 ...

  9. vue 递归调用组件出错

    报错信息: Avoid mutating an injected value directly since the changes will be overwritten whenever the p ...

  10. WEBAPI 的调用方式

    示例是调用谷歌短网址的API. 1. HttpClient方式 public static async void DoAsyncPost() { DateTime dateBegin = DateTi ...