导出目录的JS代码,与目录的三级标题测试
二级标题
三级标题
三级标题
三级标题
三级标题
三级标题
二级标题
三级标题
三级标题
三级标题
三级标题
三级标题
这里是现在页尾目录功能的代码源码:
<!-- 目录索引列表生成 -->
<script language="javascript" type="text/javascript">
function GenerateContentList()
{
if ($('#cnblogs_post_body').length == 0) { return; }
var jquery_h1_list = $('#cnblogs_post_body h1');
var jquery_h2_list = $('#cnblogs_post_body h2');
var jquery_h3_list = $('#cnblogs_post_body h3');
if (jquery_h1_list.length != 0)
{
var content = '<a name="_labelTop"></a>';
content += '<div id="navCategory">';
content += '<p style="font-size:18px"><b>目录</b></p>';
content += '<ul class="first_class_ul">';
for (var i = 0; i < jquery_h1_list.length; i++)
{
var go_to_top = '<div style="text-align: right"><a href="#_labelTop">返回目录</a><a name="_label' + i + '"></a></div>';
$(jquery_h1_list[i]).before(go_to_top);
var li_content = '<li><a href="#_label' + i + '">' + $(jquery_h1_list[i]).text() + '</a></li>';
var nextH1Index = i + 1;
if (nextH1Index == jquery_h1_list.length) { nextH1Index = 0; }
var jquery_h2_list = $(jquery_h1_list[i]).nextUntil(jquery_h1_list[nextH1Index], "h2");
if (jquery_h2_list.length > 0)
{
li_content += '<ul class="second_class_ul">';
}
for (var j = 0; j < jquery_h2_list.length; j++)
{
var go_to_top2 = '<div style="text-align: right"><a href="#_labelTop">返回目录</a><a name="_lab2_'+ i + '_' + j + '"></a></div>';
$(jquery_h2_list[j]).before(go_to_top2);
li_content +='<li><a href="#_lab2_'+ i +'_' + j + '">' + $(jquery_h2_list[j]).text() + '</a></li>';
var nextH2Index = j + 1;
var next;
if (nextH2Index == jquery_h2_list.length)
{
if (i + 1 == jquery_h1_list.length)
{
next = jquery_h1_list[0];
}
else
{
next = jquery_h1_list[i + 1];
}
}
else
{
next = jquery_h2_list[nextH2Index];
}
var jquery_h3_list = $(jquery_h2_list[j]).nextUntil(next, "h3");
if (jquery_h3_list.length > 0)
{
li_content += '<ul class="third_class_ul">';
}
for (var k = 0; k < jquery_h3_list.length; k++)
{
var go_to_third_Content = '<div style="text-align: right"><a href="#_labelTop"></a><a name="_label3_' + i + '_' + j + '_' + k + '"></a></div>';
$(jquery_h3_list[k]).before(go_to_third_Content);
li_content += '<li><a href="#_label3_' + i + '_' + j + '_' + k + '">' + $(jquery_h3_list[k]).text() + '</a></li>';
}
if (jquery_h3_list.length > 0)
{
li_content += '</ul>';
}
li_content += '</li>';
}
if (jquery_h2_list.length > 0)
{
li_content +='</ul>';
}
li_content +='</li>';
content += li_content;
}
content += '</ul>';
content += '</div>';
}
else if (jquery_h2_list.length != 0)
{
var content = '<a name="_labelTop"></a>';
content += '<div id="navCategory">';
content += '<p style="font-size:18px"><b>目录</b></p>';
content += '<ul class="second_class_ul">';
for(var i =0; i < jquery_h2_list.length; i++)
{
var go_to_top2 = '<div style="text-align: right"><a href="#_labelTop">返回目录</a><a name="_lab2_'+ i + '_' + j + '"></a></div>';
$(jquery_h2_list[j]).before(go_to_top2);
var li_content = '<li><a href="#_lab' + i + '">' + $(jquery_h2_list[i]).text() + '</a></li>';
var nextH1Index = i + 1;
if (nextH1Index == jquery_h2_list.length) { nextH1Index = 0; }
var jquery_h3_list = $(jquery_h2_list[i]).nextUntil(jquery_h2_list[i+1], "h3");
if(jquery_h3_list.length>0)
{
li_content +='<ul class="third_class_ul">';
}
for(var j = 0;j < jquery_h3_list.length;j++)
{
var go_to_third_Content = '<div style="text-align: right"><a href="#_labelTop"></a><a name="_label3_' + i + '_' + j + '_' + k + '"></a></div>';
$(jquery_h3_list[k]).before(go_to_third_Content);
li_content +='<li><a href="#_lab2'+ i +'_' + j + '">' + $(jquery_h3_list[j]).text() + '</a></li>';
}
if(jquery_h3_list.length>0)
{
li_content +='</ul>';
}
li_content +='</li>';
content += li_content;
}
content += '</ul>';
content += '</div>';
}
else if (jquery_h3_list.length != 0)
{
var content = '<a name="_labelTop"></a>';
content += '<div id="navCategory">';
content += '<p style="font-size:18px"><b>目录</b></p>';
content += '<ul>';
for(var i = 0; i < jquery_h3_list.length; i++)
{
var go_to_third_Content = '<div style="text-align: right"><a href="#_labelTop"></a><a name="_label3_' + i + '"></a></div>';
$(jquery_h3_list[k]).before(go_to_third_Content);
var li_content = '<li><a href="#_label3' + i + '">' + $(jquery_h3_list[i]).text() + '</a></li>';
content += li_content;
}
content += '</ul>';
content += '</div>';
}
else
{
return;
}
$($('#cnblogs_post_body')[0]).prepend(content);
}
GenerateContentList();
</script>
有bug,我看见了,但是我改过了之后,还是一样的,没有成功。
以下是第一次修改后的代码段:
<!-- 目录索引列表生成 -->
<script language="javascript" type="text/javascript">
function GenerateContentList()
{
if ($('#cnblogs_post_body').length == 0) { return; }
var jquery_h1_list = $('#cnblogs_post_body h1');
var jquery_h2_list = $('#cnblogs_post_body h2');
var jquery_h3_list = $('#cnblogs_post_body h3');
if (jquery_h1_list.length != 0)
{
var content = '<a name="_labelTop"></a>';
content += '<div id="navCategory">';
content += '<p style="font-size:18px"><b>目录</b></p>';
content += '<ul class="first_class_ul">';
for (var i = 0; i < jquery_h1_list.length; i++)
{
var go_to_top = '<div style="text-align: right"><a href="#_labelTop">返回目录</a><a name="_label' + i + '"></a></div>';
$(jquery_h1_list[i]).before(go_to_top);
var li_content = '<li><a href="#_label' + i + '">' + $(jquery_h1_list[i]).text() + '</a></li>';
var nextH1Index = i + 1;
if (nextH1Index == jquery_h1_list.length) { nextH1Index = 0; }
var jquery_h2_list = $(jquery_h1_list[i]).nextUntil(jquery_h1_list[nextH1Index], "h2");
if (jquery_h2_list.length > 0)
{
li_content += '<ul class="second_class_ul">';
}
for (var j = 0; j < jquery_h2_list.length; j++)
{
var go_to_top2 = '<div style="text-align: right"><a href="#_labelTop">返回目录</a><a name="_lab2_'+ i + '_' + j + '"></a></div>';
$(jquery_h2_list[j]).before(go_to_top2);
li_content +='<li><a href="#_lab2_'+ i +'_' + j + '">' + $(jquery_h2_list[j]).text() + '</a></li>';
var nextH2Index = j + 1;
var next;
if (nextH2Index == jquery_h2_list.length)
{
if (i + 1 == jquery_h1_list.length)
{
next = jquery_h1_list[0];
}
else
{
next = jquery_h1_list[i + 1];
}
}
else
{
next = jquery_h2_list[nextH2Index];
}
var jquery_h3_list = $(jquery_h2_list[j]).nextUntil(next, "h3");
if (jquery_h3_list.length > 0)
{
li_content += '<ul class="third_class_ul">';
}
for (var k = 0; k < jquery_h3_list.length; k++)
{
var go_to_third_Content = '<div style="text-align: right"><a href="#_labelTop"></a><a name="_label3_' + i + '_' + j + '_' + k + '"></a></div>';
$(jquery_h3_list[k]).before(go_to_third_Content);
li_content += '<li><a href="#_label3_' + i + '_' + j + '_' + k + '">' + $(jquery_h3_list[k]).text() + '</a></li>';
}
if (jquery_h3_list.length > 0)
{
li_content += '</ul>';
}
li_content += '</li>';
}
if (jquery_h2_list.length > 0)
{
li_content +='</ul>';
}
li_content +='</li>';
content += li_content;
}
content += '</ul>';
content += '</div>';
}
else if (jquery_h2_list.length != 0)
{
if ($('#cnblogs_post_body').length == 0) { return; }
var jquery_h2_list = $('#cnblogs_post_body h2');
var jquery_h3_list = $('#cnblogs_post_body h3');
var content = '<a name="_labelTop"></a>';
content += '<div id="navCategory">';
content += '<p style="font-size:18px"><b>目录</b></p>';
content += '<ul class="second_class_ul">';
for(var i =0; i < jquery_h2_list.length; i++)
{
var go_to_top2 = '<div style="text-align: right"><a href="#_labelTop">返回目录</a><a name="_lab2_'+ i + '_' + j + '"></a></div>';
$(jquery_h2_list[j]).before(go_to_top2);
var li_content = '<li><a href="#_lab2' + i + '">' + $(jquery_h2_list[i]).text() + '</a></li>';
var nextH1Index = i + 1;
if (nextH1Index == jquery_h2_list.length) { nextH1Index = 0; }
var jquery_h3_list = $(jquery_h2_list[i]).nextUntil(jquery_h2_list[i+1], "h3");
if(jquery_h3_list.length>0)
{
li_content +='<ul class="third_class_ul">';
}
for(var j = 0;j < jquery_h3_list.length;j++)
{
var go_to_third_Content = '<div style="text-align: right"><a href="#_labelTop"></a><a name="_label3_' + i + '_' + j + '_' + k + '"></a></div>';
$(jquery_h3_list[k]).before(go_to_third_Content);
li_content +='<li><a href="#_label3_'+ i +'_' + j + '">' + $(jquery_h3_list[j]).text() + '</a></li>';
}
if(jquery_h3_list.length>0)
{
li_content +='</ul>';
}
li_content +='</li>';
content += li_content;
}
content += '</ul>';
content += '</div>';
}
else if (jquery_h3_list.length != 0)
{
if ($('#cnblogs_post_body').length == 0) { return; }
var jquery_h3_list = $('#cnblogs_post_body h3');
var content = '<a name="_labelTop"></a>';
content += '<div id="navCategory">';
content += '<p style="font-size:18px"><b>目录</b></p>';
content += '<ul>';
for(var i = 0; i < jquery_h3_list.length; i++)
{
var go_to_third_Content = '<div style="text-align: right"><a href="#_labelTop"></a><a name="_label3_' + i + '"></a></div>';
$(jquery_h3_list[k]).before(go_to_third_Content);
var li_content = '<li><a href="#_label3_' + i + '">' + $(jquery_h3_list[i]).text() + '</a></li>';
content += li_content;
}
li_content +='</li>';
content += '</ul>';
content += '</div>';
}
else
{
return;
}
$($('#cnblogs_post_body')[0]).prepend(content);
}
GenerateContentList();
</script>
导出目录的JS代码,与目录的三级标题测试的更多相关文章
- JSCover+WebDriver/Selenium获得JS
代码覆盖
我们看JSCover(http://tntim96.github.io/JSCover/manual/manual.xml)介绍及使用说明的时候,往往被图形界面所吸引.这样的方式比較适合手工操作,点击 ...
- JAVA 导出 Excel, JS 导出 Excel
本介绍两种Excle导出方法: JAVA 导出 Excle, JS 导出 Excle 1, js 根据 html 页面的 table > tr > td 标签导出 js代码: //导出 v ...
- Node.js教程系列~目录
Node.js这个东西在近几年火起来了,而且会一直火下去,无论在infoq还是在cnblogs,csdn上,都可以到处看到它的样子,它主推的应该就是异步式I/O 吧,是的,设计的很完美,很吸引人,虽然 ...
- 【Django】基于Django架构网站代码的目录结构
经典的Django项目源码目录结构 Django在一个项目的目录结构划分方面缺乏必要的规范.在Django的官方文档中并没有给出大型项目的代码建议目录结构,网上的文章也是根据项目的不同结构也有适当的 ...
- vue源码分析—Vue.js 源码目录设计
Vue.js 的源码都在 src 目录下,其目录结构如下 src ├── compiler # 编译相关 ├── core # 核心代码 ├── platforms # 不同平台的支持 ├── ser ...
- java代码实现目录结构
今天用java代码来实现.像我们电脑盘符那样的目录结构.在代码开始之前首先.介绍一下.用.java代码实现目录的思想. 第一步:完成基础的.大家想.我们是如何获取文件的.是不是用File类,直接就获取 ...
- [笔记][Web]利用JS生成博文目录及CSS定制博客
0. 简介 进入到cnblog这个大园子以后,和其他的一些博客网站比起来,少了些小功能,比如旁边CSDN上的目录.不过好在大神辈出,博客园可以通过申请JS权限来进行目录的生成. 由于本人在JS以及CS ...
- Vue.js 源码目录设计(二)
Vue.js 的源码都在 src 目录下,其目录结构如下. src ├── compiler # 编译相关 ├── core # 核心代码 ├── platforms # 不同平台的支持 ├── se ...
- 使用FreePic2Pdf导出书签至Word建立层级目录——快速初始化Word笔记本目录
使用FreePic2Pdf导出书签至Word建立层级目录 --快速初始化Word笔记本目录 文:安徽师范大学2014级计算机科学与技术 王昊 (Get Contact:441301158@qq.com ...
随机推荐
- 灰度发布 & A/B 测试
灰度发布 & A/B 测试 http://www.woshipm.com/pmd/573429.html 8 https://testerhome.com/topics/15746 scree ...
- MySQL的简单使用方法备忘
这只是一篇我的个人备忘录,写的是我常用的命令.具体可以参考"菜鸟教程" https://www.runoob.com/mysql/mysql-tutorial.html 登录(用户 ...
- HTTP 协议中的并发限制及队首阻塞问题
本文转载自HTTP 协议中的并发限制及队首阻塞问题 串行连接 HTTP/0.9 和早期的 HTTP/1.0 协议对 HTTP 请求处理是串行化的.假如一个页面包含 3 个样式文件,同属于一个协议.域名 ...
- mybatisPlus中的模糊查询问题
不能查询中文 记得在数据库的配置中写明编码格式characterEncoding=utf-8
- three.js cannon.js物理引擎之ConvexPolyhedron多边形
年后第一天上班,郭先生来说一说cannon.js的ConvexPolyhedron(多边形),cannon.js是一个物理引擎,内部通过连续的计算得到各个时间点的数据的状态,three.js的模型可以 ...
- sun公司和apache使用ftpclient的区别
最近因为使用FTP实现上传下载,因为已经有前辈使用了,照着敲了一遍(绝对没有复制粘贴啊,发誓).但是今天突然发现FTPClient还不一样,仔细看了看,一个是sun.net.ftp.FtpClient ...
- Spring Boot和Thymeleaf整合,结合JPA实现分页效果
在项目里,我需要做一个Spring Boot结合Thymeleaf前端模版,结合JPA实现分页的演示效果.做的时候发现有些问题,也查了现有网上的不少文档,发现能全栈实现的不多,所以这里我就把我的做法, ...
- MySQL学习笔记(五)
倒数第二天!冲冲冲!!! 一.索引 一个表里面可以有多个索引. 1. 索引的作用:约束与加速查找 无索引:从前到后依次查找 有索引:会为索引列创造一个额外文件(以某种格式存储).在使用索引进行查找时, ...
- Java基础语法:运算符
Java 运算符(operator)根据功能分类: 算术运算符:+,-,*,/,%,++,-- 赋值运算符:= 关系运算符:>,<,>=,<=,==,!=,instanceof ...
- cocos2dx创建工程
p.p1 { margin: 0; font: 17px "Helvetica Neue"; color: rgba(69, 69, 69, 1) } 官网镇楼: http://w ...