使用 div / class 隐藏 li 项目
我试图在快速启动菜单中隐藏项目（li？），其中显示“隐藏好处”，HTML 是；
<div class=" noindex ms-core-listMenu-verticalBox" id="zz13_idPDPQuickLaunch">
<ul class="root ms-core-listMenu-root static" id="zz14_RootAspMenu">
<li class="static">
<a class="static menu-item ms-core-listMenu-item ms-displayInline ms-navedit-linkNode" href="/sites/pwa/">
<span class="additional-background ms-navedit-flyoutArrow">
<span class="menu-item-text">Defra Benefits Dev</span></span>
</a>
<ul class="static">
<li class="static"><a class="static menu-item ms-core-listMenu-item ms-displayInline ms-navedit-linkNode" href="/sites/pwa/"><span class="additional-background ms-navedit-flyoutArrow"><span class="menu-item-text">Project Information</span></span></a></li>
<li class="static selected"><a class="static selected menu-item ms-core-listMenu-item ms-displayInline ms-core-listMenu-selected ms-navedit-linkNode" href="/sites/pwa/"><span class="additional-background ms-navedit-flyoutArrow"><span class="menu-item-text">Benefits</span><span class="ms-hidden">Currently selected</span></span></a></li>
<li class="static"><a class="static menu-item ms-core-listMenu-item ms-displayInline ms-navedit-linkNode" href="/sites/pwa/"><span class="additional-background ms-navedit-flyoutArrow"><span class="menu-item-text">Benefits HIDDEN</span></span></a></li>
<li class="static"><a class="static menu-item ms-core-listMenu-item ms-displayInline ms-navedit-linkNode" href="/sites/pwa/"><span class="additional-background ms-navedit-flyoutArrow"><span class="menu-item-text">Benefits HIDDEN</span></span></a></li>
</ul>
</li>
</ul>
</div>
我尝试过以下方法但没有成功
<script>
$(document).ready(function() {
$("#zz13_idPDPQuickLaunch *:contains('Benefits HIDDEN')").hide ();
});
</script>
慕的地62643123回答
-
冉冉说
$('.menu-item-text').each(function() { this.textContent.trim() === 'Benefits HIDDEN' && $(this).closest('li').hide();});<div class="noindex ms-core-listMenu-verticalBox" id="zz13_idPDPQuickLaunch"> <ul class="root ms-core-listMenu-root static" id="zz14_RootAspMenu"> <li class="static"> <a class="static menu-item ms-core-listMenu-item ms-displayInline ms-navedit-linkNode" href="/sites/pwa/"> <span class="additional-background ms-navedit-flyoutArrow"><span class="menu-item-text">Defra Benefits Dev</span></span> </a> <ul class="static"> <li class="static"><a class="static menu-item ms-core-listMenu-item ms-displayInline ms-navedit-linkNode" href="/sites/pwa/"><span class="additional-background ms-navedit-flyoutArrow"><span class="menu-item-text">Project Information</span></span></a></li> <li class="static selected"><a class="static selected menu-item ms-core-listMenu-item ms-displayInline ms-core-listMenu-selected ms-navedit-linkNode" href="/sites/pwa/"><span class="additional-background ms-navedit-flyoutArrow"><span class="menu-item-text">Benefits</span><span class="ms-hidden">Currently selected</span></span></a></li> <li class="static"><a class="static menu-item ms-core-listMenu-item ms-displayInline ms-navedit-linkNode" href="/sites/pwa/"><span class="additional-background ms-navedit-flyoutArrow"><span class="menu-item-text">Benefits HIDDEN</span></span></a></li> <li class="static"><a class="static menu-item ms-core-listMenu-item ms-displayInline ms-navedit-linkNode" href="/sites/pwa/"><span class="additional-background ms-navedit-flyoutArrow"><span class="menu-item-text">Benefits HIDDEN</span></span></a></li> </ul> </li> <li class="static"><a class="static menu-item ms-core-listMenu-item ms-displayInline ms-navedit-linkNode" href="javascript:PDPInfrastructure.NavigateWSSPage(0,true)"><span class="additional-background ms-navedit-flyoutArrow"><span class="menu-item-text">Project Site</span></span></a></li> </ul></div><script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> -
料青山看我应如是
由于许多元素都包含该文本（不仅仅是span它所在的元素，还有 the liis spanin、itsul等，甚至#zz13_idPDPQuickLaunch元素本身），因此您必须更加具体地选择您的选择器。理想情况下，向要隐藏的最里面的元素添加一个类或其他内容。但你也可以从结构上做到这一点。例如，如果您想隐藏lis：$(document).ready(function() { $("#zz13_idPDPQuickLaunch li ul li.static:contains('Benefits HIDDEN')").hide (); });实例：$(document).ready(function() { $("#zz13_idPDPQuickLaunch li ul li.static:contains('Benefits HIDDEN')").hide ();});<div class=" noindex ms-core-listMenu-verticalBox" id="zz13_idPDPQuickLaunch"> <ul class="root ms-core-listMenu-root static" id="zz14_RootAspMenu"> <li class="static"> <a class="static menu-item ms-core-listMenu-item ms-displayInline ms-navedit-linkNode" href="/sites/pwa/"> <span class="additional-background ms-navedit-flyoutArrow"><span class="menu-item-text">Defra Benefits Dev</span></span> </a> <ul class="static"> <li class="static"><a class="static menu-item ms-core-listMenu-item ms-displayInline ms-navedit-linkNode" href="/sites/pwa/"><span class="additional-background ms-navedit-flyoutArrow"><span class="menu-item-text">Project Information</span></span></a></li> <li class="static selected"><a class="static selected menu-item ms-core-listMenu-item ms-displayInline ms-core-listMenu-selected ms-navedit-linkNode" href="/sites/pwa/"><span class="additional-background ms-navedit-flyoutArrow"><span class="menu-item-text">Benefits</span><span class="ms-hidden">Currently selected</span></span></a></li> <li class="static"><a class="static menu-item ms-core-listMenu-item ms-displayInline ms-navedit-linkNode" href="/sites/pwa/"><span class="additional-background ms-navedit-flyoutArrow"><span class="menu-item-text">Benefits HIDDEN</span></span></a></li> <li class="static"><a class="static menu-item ms-core-listMenu-item ms-displayInline ms-navedit-linkNode" href="/sites/pwa/"><span class="additional-background ms-navedit-flyoutArrow"><span class="menu-item-text">Benefits HIDDEN</span></span></a></li> </ul> </li> <li class="static"><a class="static menu-item ms-core-listMenu-item ms-displayInline ms-navedit-linkNode" href="javascript:PDPInfrastructure.NavigateWSSPage(0,true)"><span class="additional-background ms-navedit-flyoutArrow"><span class="menu-item-text">Project Site</span></span></a></li> </ul></div><script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>这就是说，您只想隐藏包含该文本的元素，前提是它们是 #zz13_idPDPQuickLaunch` 元素内的a 内的类li的元素。staticulli -
绝地无双
您需要循环每个“li”项目并首先检查其中的文本。尝试这个：$(function(){ var menu_items = $("#zz14_RootAspMenu").find("li"); menu_items.each(function(idx,el){ var current_text = $(el).find('.menu-item-text').text(); if(current_text == "Benefits HIDDEN"){ $(this).hide(); } }) });
随时随地看视频慕课网APP
相关分类
Html5