前言

目前个人认为最合适的一个判定了，但是我的做法只支持二级分类，如果你有多级分类，就需要自行调整了。

先上个实际html渲染图：

可以看到，我进入的是HTML子分类，那么对应的子分类class上已经有active类名了，而它的父级分类前端，在类名上也存在了active。

教程

不多说，直接上源码

此处内容已隐藏回复后方可阅读。

分类： Typecho博客教程 标签： 主题typecho分类高亮
版权申明

本文系作者 @木灵鱼儿 原创发布在木灵鱼儿站点。未经许可，禁止转载。

评论

小黄脸
热词
小电视
（⌒▽⌒）
龙年202414周年脱单doge微笑口罩doge妙啊OK星星眼辣眼睛吃瓜滑稽呲牙打call歪嘴调皮豹富嗑瓜子笑哭藏狐脸红给心心嘟嘟哦呼喜欢酸了嫌弃害羞大哭疑惑喜极而泣笑偷笑惊讶捂脸阴险呆抠鼻大笑惊喜无语点赞鼓掌尴尬灵魂出窍委屈傲娇疼冷热生病捂眼嘘声思考再见翻白眼哈欠奋斗墨镜难过撇嘴抓狂生气水稻奶茶干杯汤圆锦鲤福到了鸡腿雪花视频卫星干杯黑洞爱心胜利加油抱拳响指保佑福支持拥抱跪了怪我咯香格里拉边境老鼠牛年兔年三星堆桃源_给花花桃源_缘分桃源_傲娇桃源_欢呼桃源_乖巧洛天依白荆回廊_欢呼白荆回廊_期待白荆回廊_啊？白荆回廊_好好好白荆回廊_无语白荆回廊_尴尬坎公骑冠剑_吃鸡坎公骑冠剑_钻石坎公骑冠剑_无语来古-疑问来古-沉思来古-呆滞来古-震撼来古-注意FGO_耶FGO_开心FGO_汗FGO_怒FGO_偷看初音未来_大笑原神_哇原神_哼原神_嗯原神_欸嘿原神_喝茶原神_生气保卫萝卜_白眼保卫萝卜_笔芯保卫萝卜_哭哭保卫萝卜_哇保卫萝卜_问号无悔华夏_不愧是你无悔华夏_吃瓜无悔华夏_达咩无悔华夏_点赞无悔华夏_好耶奥比岛_搬砖奥比岛_点赞奥比岛_击爪奥比岛_委屈奥比岛_喜欢黎明觉醒_怒了鸦黎明觉醒_石化鸦黎明觉醒_摊手鸦黎明觉醒_比心鸦黎明觉醒_哼白眼鸦以闪亮之名_哎？！以闪亮之名_爱你哦以闪亮之名_吃瓜以闪亮之名_好耶!以闪亮之名_星星眼以闪亮之名_针不戳元梦_爱你元梦_打call元梦_大哭元梦_点赞元梦_哭哭
热词系列_上任鹅城热词系列_啊?热词系列_哇酷哇酷热词系列_呵呵热词系列_谢谢老师热词系列_美貌惊人热词系列_六到无语热词系列_干杯热词表情_世萌双冠热词系列_肥肠自信热词系列_我故意的热词系列_知识增加热词系列_三连热词系列_妙啊热词系列_优雅热词表情_哎呦不错哦热词系列_好耶热词系列_你币有了热词系列_吹爆念诗之王热词系列_对象热词系列_不孤鸟热词系列_洛水天依热词系列_秀热词系列_标准结局热词系列_B站有房热词系列_破防了热词系列_多谢款待热词系列_燃起来了热词系列_饮茶先啦热词系列_再来亿遍热词系列_热乎热词系列_好活热词系列_好家伙热词系列_排面热词系列_爷青回热词系列_芜湖起飞热词系列_夺笋呐热词系列_两面包夹芝士热词系列_梦幻联动热词系列_泪目热词系列_保护热词系列_爱了爱了热词系列_可以热词系列_希望没事热词系列_打卡热词系列_DNA热词系列_这次一定热词系列_AWSL热词系列_递话筒热词系列_你细品热词系列_咕咕热词系列_张三热词系列_害热词系列_我裂开了热词系列_有内味了热词系列_猛男必看热词系列_奥力给热词系列_神仙UP热词系列_问号热词系列_我哭了热词系列_不愧是你热词系列_高产热词系列_真香热词系列_我全都要热词系列_爷关更热词系列_锤热词系列_我酸了热词系列_有生之年热词系列_镇站之宝热词系列_我太南了热词系列_完结撒花热词系列_大师球热词系列_知识盲区热词系列_“狼火”热词系列_你可真星
tv_白眼tv_dogetv_坏笑tv_难过tv_生气tv_委屈tv_斜眼笑tv_呆tv_发怒tv_惊吓tv_呕吐tv_思考tv_微笑tv_疑问tv_大哭tv_鼓掌tv_抠鼻tv_亲亲tv_调皮tv_笑哭tv_晕tv_点赞tv_害羞tv_睡着tv_色tv_吐血tv_无奈tv_再见tv_流汗tv_偷笑tv_抓狂tv_黑人问号tv_困tv_打脸tv_闭嘴tv_鄙视tv_腼腆tv_馋tv_可爱tv_发财tv_生病tv_流鼻血tv_尴尬tv_大佬tv_流泪tv_冷漠tv_皱眉tv_鬼脸tv_调侃tv_目瞪口呆
( ゜- ゜)つロ_(:з」∠)_（⌒▽⌒）（￣▽￣）⌓‿⌓(=・ω・=)(*°▽°*)八(*°▽°*)♪✿ヽ(°▽°)ノ✿(¦3【▓▓】눈_눈(ಡωಡ)_(≧∇≦」∠)_━━━∑(ﾟ□ﾟ*川━(｀・ω・´)(￣3￣)✧(≖ ◡ ≖✿)(･∀･)(〜￣△￣)〜→_→(°∀°)ﾉ╮(￣▽￣)╭( ´_ゝ｀)←_←(;¬_¬)(ﾟДﾟ≡ﾟдﾟ)!?( ´･･)ﾉ(._.`)Σ(ﾟдﾟ;)Σ( ￣□￣||)<(´；ω；`)（/TДT)/(^・ω・^)(｡･ω･｡)(●￣(ｴ)￣●)ε=ε=(ノ≧∇≦)ノ(´･_･`)(-_-#)（￣へ￣）(￣ε(#￣) Σ(╯°口°)╯(┴—┴ヽ(`Д´)ﾉ("▔□▔)/(º﹃º )(๑>؂<๑）｡ﾟ(ﾟ´Д｀)ﾟ｡(∂ω∂)(┯_┯)(・ω< )★( ๑ˊ•̥▵•)੭₎₎¥ㄟ(´･ᴗ･`)ノ¥Σ_(꒪ཀ꒪」∠)_٩(๛ ˘ ³˘)۶❤(๑‾᷅^‾᷅๑)

全部评论 26

  1. 老王
    老王
    Google Chrome MacOS
    又来研究研究
    回复
  2. 星语
    星语
    Google Chrome Windows 10
    学习一下1111111
    回复
  3. 老王
    老王
    Google Chrome MacOS
    比如我有不同分类不同图片这种形式的导航，要怎么才能高亮啊，你这个要循环输出，我的不能循环。
    回复
    1. 木灵鱼儿
      木灵鱼儿
      FireFox Windows 10
      @老王那就不知道了，估计得查数据库了吧
      回复
  4. 老王
    老王
    Google Chrome MacOS
    额，我都看几遍了还没搞定
    回复
    1. 木灵鱼儿
      木灵鱼儿
      FireFox Windows 10
      @老王可以去看看我这个仿掘金主题，开源的，参考参考
      回复
  5. 老王
    老王
    Google Chrome MacOS
    还要回复
    回复
    1. 木灵鱼儿
      木灵鱼儿
      FireFox Windows 10
      @老王cookie丢失了就得回复了
      回复
  6. 老王
    老王
    Google Chrome MacOS
    路过学习哈
    回复
  7. 好
    好
    Google Chrome Android
    路过路过学习一下
    回复
  8. WuXiaoFan
    WuXiaoFan
    Google Chrome MacOS
    撒旦法vs地方
    回复
  9. lccwl.com
    lccwl.com
    Google Chrome Android
    路过。。。。。
    回复
  10. kirari
    kirari
    Google Chrome Windows 10
    看看思路 .
    回复
  1. 1
  2. 2
  3. 3

相关推荐

Typecho 使用highlight.js代码高亮如何实现代码行号

木灵鱼儿 8191 9 27
typecho 代码高亮 highlight.js

Typecho掘金编辑器《Typecho_Plugin_JJEditor》

木灵鱼儿 5278 2 13
插件 编辑器 typecho

Typecho 实现一个目录树

木灵鱼儿 13312 100 38
typecho 目录树

开源主题-高仿掘金《JJ》V2.0

木灵鱼儿 73294 572 140
typecho 开源 博客主题

利用typescript实现原生css变量的主题切换功能类

木灵鱼儿 2269 0 0
typecho TypeScript 主题切换

typecho主题开发：基于webpack5的多页面打包项目

木灵鱼儿 5011 19 6
typecho 主题开发 webpack5

让typecho支持特殊字符

木灵鱼儿 2275 0 0
typecho 特殊字符 emoji

typecho 真的很简单的自定义评论列表

木灵鱼儿 67528 0 118
typecho 评论 自定义评论

关于element 侧边栏导航高亮的思路

木灵鱼儿 5620 4 0
vue 路由 element

你不知道的微软-蓝泽光（win7主题）

木灵鱼儿 4742 0 0
主题 蓝泽光 win7
获得点赞 0
文章被阅读 8,355
最后更新 23-03-28 3:47:02

目录

目录