列表项与标题项的内容都相同,只需要其中之一就 ok 了,请问大佬们怎么弄。
-
思源笔记
22906 引用 • 92088 回帖 • 1 关注
思源笔记是一款隐私优先的个人知识管理系统,支持完全离线使用,同时也支持端到端加密同步。
融合块、大纲和双向链接,重构你的思维。
-
Q&A
8391 引用 • 38246 回帖 • 155 关注
提问之前请先看《提问的智慧》,好的问题比好的答案更有价值。
相关帖子
-
wilsons • • 2 • 1 赞同付费者 捐赠者
我想你的本意是想去除面包屑中的重复项吧,因为除了标题,其他块也可能产生重复。
依靠纯 css 很难兼容其他情况。
下面这个用 js 代码实现的去除重复项(暂不支持手机端,手机端面包屑在菜单中),仅供参考。
(()=>{ // 已存在的面包屑 let breadcrumbs = [], timer = null; // 监听面包屑项出现 observeElementExist('.protyle-breadcrumb__item', (element) => { if(!timer) { timer = setTimeout(() => { breadcrumbs = []; timer = null; }, 300); } const text = element.querySelector('.protyle-breadcrumb__text'); if(!text) return; if(!breadcrumbs.includes(text.textContent)) { breadcrumbs.push(text.textContent); return; } element.style.display = 'none'; const arrow = element.previousElementSibling; if(!arrow || !arrow.classList.contains('protyle-breadcrumb__arrow')) return; arrow.style.display = 'none'; }, '.layout__center'); // 监听元素出现 function observeElementExist(selector, callback, observeNode) { const handleMutations = (mutationsList, observer) => { for (let mutation of mutationsList) { if (mutation.type === 'childList') { mutation.addedNodes.forEach(node => { if (node.matches && node.matches(selector)) { callback(node); //observer.disconnect(); // 一旦找到元素,停止监听 } }); } } }; // 创建一个MutationObserver实例 const config = { attributes: false, childList: true, subtree: true }; const observer = new MutationObserver(handleMutations); // 选择需要监听的父节点 observeNode = typeof observeNode === 'string' ? document.querySelector(observeNode) : observeNode; const targetNode = observeNode || document.body; // 开始监听目标节点的变化 observer.observe(targetNode, config); } })();
效果
-
我想你的本意是想去除面包屑中的重复项吧,因为除了标题,其他块也可能产生重复。
依靠纯 css 很难兼容其他情况。
下面这个用 js 代码实现的去除重复项(暂不支持手机端,手机端面包屑在菜单中),仅供参考。
(()=>{ // 已存在的面包屑 let breadcrumbs = [], timer = null; // 监听面包屑项出现 observeElementExist('.protyle-breadcrumb__item', (element) => { if(!timer) { timer = setTimeout(() => { breadcrumbs = []; timer = null; }, 300); } const text = element.querySelector('.protyle-breadcrumb__text'); if(!text) return; if(!breadcrumbs.includes(text.textContent)) { breadcrumbs.push(text.textContent); return; } element.style.display = 'none'; const arrow = element.previousElementSibling; if(!arrow || !arrow.classList.contains('protyle-breadcrumb__arrow')) return; arrow.style.display = 'none'; }, '.layout__center'); // 监听元素出现 function observeElementExist(selector, callback, observeNode) { const handleMutations = (mutationsList, observer) => { for (let mutation of mutationsList) { if (mutation.type === 'childList') { mutation.addedNodes.forEach(node => { if (node.matches && node.matches(selector)) { callback(node); //observer.disconnect(); // 一旦找到元素,停止监听 } }); } } }; // 创建一个MutationObserver实例 const config = { attributes: false, childList: true, subtree: true }; const observer = new MutationObserver(handleMutations); // 选择需要监听的父节点 observeNode = typeof observeNode === 'string' ? document.querySelector(observeNode) : observeNode; const targetNode = observeNode || document.body; // 开始监听目标节点的变化 observer.observe(targetNode, config); } })();
效果
3 回复 -
-
-