zoukankan      html  css  js  c++  java
  • 博客园文章自动生成目录以及复制别人的模板

    1、自动生成目录包括h2,h3,h4

    <script language="javascript" type="text/javascript">
    
    // 生成目录索引列表  h2,h3,h4
    // 原文https://www.cnblogs.com/zzqcn/p/4657124.html 在此基础上修改
    // modified by: zwj/(highly)
    function GenerateContentList()
    {
        var mainContent = $('#cnblogs_post_body');
        var h2_list = $('#cnblogs_post_body h2');//如果你的章节标题不是h2,只需要将这里的h2换掉即可
    
        if(mainContent.length < 1)
            return;
     
        if(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>';
            for(var i=0; i<h2_list.length; i++)
            {
                var go_to_top = '<div style="text-align: right"><a href="#_labelTop">回到顶部</a><a name="_label' + i + '"></a></div>';
                $(h2_list[i]).before(go_to_top);
                
                var h3_list = $(h2_list[i]).nextAll("h3");
                var li3_content = '';
                var li4_content = '';
                for(var j=0; j<h3_list.length; j++)
                {
                    var tmp = $(h3_list[j]).prevAll('h2').first();
                    if(!tmp.is(h2_list[i]))
                        break;
                    var li3_anchor = '<a name="_label' + i + '_' + j + '"></a>';
                    $(h3_list[j]).before(li3_anchor);
                    li3_content += '<li><a href="#_label' + i + '_' + j + '">' + $(h3_list[j]).text() + '</a></li>';
    
                    var h4_list = $(h3_list[j]).nextAll("h4");
                    
                    for(var k=0; k<h4_list.length; k++)
                    {
                        var tmp1 = $(h4_list[k]).prevAll('h3').first();
                        if(!tmp1.is(h3_list[j]))
                            break;
                        var li4_anchor = '<a name="_label' + i + '_' + j + '_' + k + '"></a>';
                        $(h4_list[k]).before(li4_anchor);
                        li4_content += '<li><a href="#_label' + i + '_' + j + '_' + k +'">' + $(h4_list[k]).text() + '</a></li>';
                    }
                }
    
                var li2_content = '';
                if(li4_content.length > 0){
                    if(li3_content.length > 0)
                        li2_content = '<li type="square"><a href="#_label' + i + '">' + $(h2_list[i]).text() + '</a><ul >' + li3_content + '<ul>' + li4_content + '</ul></ul></li>';
                
                }
                    
                else if(li3_content.length > 0)
                    li2_content = '<li ><a href="#_label' + i + '">' + $(h2_list[i]).text() + '</a><ul >' + li3_content + '</ul></li>';
                else
                    li2_content = '<li><a href="#_label' + i + '">' + $(h2_list[i]).text() + '</a></li>';
                content += li2_content;
                
                
            }
            content += '</ul>';
            content += '</div><p>&nbsp;</p>';
            content += '<p style="font-size:18px"><b>正文</b></p>';
            if($('#cnblogs_post_body').length != 0 )
            {
                $($('#cnblogs_post_body')[0]).prepend(content);
            }
        }   
    
        var qqinfo =  '<p style="color:#0378bb;font-size:16px">QQ:1968380831</p>';
        $(mainContent[0]).prepend(qqinfo);
    }
    
    GenerateContentList();
    </script>
    View Code

    将上述代码复制到设置页面

    2、复制别人的模板

     首先禁用模板默认CSS,然后复制别人博客中所有type是type="text/css"的代码到设置页面

    <link rel="stylesheet" href="/css/blog-common.min.css?v=PEqf9X5sM-TqgxEJ-34zllMNrLPY7PzC3YhmnDnLGWA" />
        
        <link type="text/css" rel="stylesheet" href="https://www.cnblogs.com/wl-blog/custom.css?v=6KT/ERQBuZaJ61ta2mU4SfEo7FA=" />
        <link id="mobile-style" media="only screen and (max- 767px)" type="text/css" rel="stylesheet" href="/skins/custom/bundle-custom-mobile.min.css?v=m3EDfkzWxyr59QpsMnTcyqVxwFbVIdAtRy2EooJcJ94" />
    View Code

     参考

    https://www.cnblogs.com/wl-blog/p/10303027.html

    https://www.cnblogs.com/pinganzi/p/6657145.html

    好看的博客

    https://www.cnblogs.com/godoforange/p/11613521.html

    https://www.cnblogs.com/cc-freiheit/p/9100694.html

    https://www.cnblogs.com/smail-bao/p/7448392.html

    https://www.cnblogs.com/wangrudong003/p/10959525.html

    <link rel="stylesheet" href="/css/blog-common.min.css?v=7Pwqzj5EBy4dBv4DJNI181rFKP8_OF0hT7jO3o8jAa0">
    <link id="MainCss" rel="stylesheet" href="/skins/custom/bundle-custom.min.css?v=1ssrnY3Il79Ok472qeVrpxlSprSXcHhYPgZC5S3wtVM">
    <link type="text/css" rel="stylesheet" href="https://www.cnblogs.com/godoforange/custom.css?v=eCzqRRpiz4DEK2lN0qtihdBgD0g=">
    <link id="mobile-style" media="only screen and (max- 767px)" type="text/css" rel="stylesheet" href="/skins/custom/bundle-custom-mobile.min.css?v=usO6AsdAECy7peUj2-vlt51BZKvOvN1aJZF_Ulh5cz4">
    

      

  • 相关阅读:
    摇奖-大转盘-js内容
    微信支付出现的问题总结--不同域名进行授权解决方案
    微信开发———让微信debug到自己的程序中;
    微信摇一摇红包
    mybatis二级缓存问题
    mybatis使用拦截器显示sql,使用druid配置连接信息
    mybatis使用拦截器显示sql,使用druid配置连接信息
    mybatis的查询效率问题
    mybatis日志的使用问题:
    js 累加月
  • 原文地址:https://www.cnblogs.com/1zhangwenjing/p/12313490.html
Copyright © 2011-2022 走看看