如何隱藏沒有標識或類的appeed li元素

Question

如何隱藏附加li元素沒有標識或類

這是我的代碼。

<form action="" method="post" id="blog-node-form"> 
<ul class="vertical-tabs-list">`enter code here` 
    <li> 
     <a href="#"><strong>Menu settings</strong></a> 
    </li> 
    <li> 
     <a href="#"><strong>URL path settings</strong></a> 
    </li> 
    <li> 
     <a href="#"><strong>Revision information</strong></a> 
    </li> 
    <li> 
     <a href="#"><strong>Authoring information</strong></a> 
    </li> 
    <li> 
     <a href="#"><strong>Publishing options</strong></a> 
    </li> 
</ul> 
</form> 

    jQuery("#blog-node-form").on('each','ul.vertical-tabs-list li',function(){ 
     if(jQuery(this).find('strong:contains("Menu settings")').length>0 || jQuery(this).find('strong:contains("Authoring information")').length>0) 
     { 
     jQuery("#edit-menu").hide(); 
     jQuery(this).hide(); 
     } 
    }); 

這裏我試圖隱藏特定的li。

ul被添加到我的頁面使用ajax。

Answer 1

你需要MutationObserver，這裏摘錄我已經使用setTimeout動態使用$.ajax()操作來模擬ul追加。

var MutationObserver = window.MutationObserver || window.WebKitMutationObserver || window.MozMutationObserver; 
 
var list = document.querySelector('#blog-node-form'); 
 

 
var observer = new MutationObserver(function(mutations) { 
 
    mutations.forEach(function(mutation) { 
 
    if (mutation.type === 'childList') { 
 
     jQuery("#blog-node-form ul.vertical-tabs-list li").find('strong:contains("Menu settings")').parent().parent().hide(); 
 
     jQuery("#blog-node-form ul.vertical-tabs-list li").find('strong:contains("Authoring information")').parent().parent().hide(); 
 
    } 
 
    }); 
 
}); 
 

 
observer.observe(list, { 
 
    attributes: true, 
 
    childList: true, 
 
    characterData: true 
 
}); 
 

 
setTimeout(function() { 
 
    var data = '<ul class="vertical-tabs-list"> \ 
 
     <li> <a href="#"><strong>Menu settings</strong></a> </li>\ 
 
     <li> <a href="#"><strong>URL path settings</strong></a> </li> \ 
 
     <li> <a href="#"><strong>Revision information</strong></a> </li> \ 
 
     <li> <a href="#"><strong>Authoring information</strong></a> </li> \ 
 
     <li> <a href="#"><strong>Publishing options</strong></a> </li> \ 
 
    </ul> '; 
 
    jQuery("#blog-node-form").append(data) 
 
}, 5000)

<script src="https://ajax.aspnetcdn.com/ajax/jQuery/jquery-3.1.1.min.js"></script> 
 
<form action="" method="post" id="blog-node-form"> 
 
</form>

Answer 2

$(selector).each(function(index,element)) 

得到李 S上的號碼，使用指數找到它。 只是舉個例子：

if(index===5) 
    element.hide(); 

Answer 3

這是答案。 你只是不需要每個循環。

代碼

<script src="https://ajax.aspnetcdn.com/ajax/jQuery/jquery-3.1.1.min.js"></script> 

<form action="" method="post" id="blog-node-form"> 
    <ul class="vertical-tabs-list"> 
     <li> <a href="#"><strong>Menu settings</strong></a> </li> 
     <li> <a href="#"><strong>URL path settings</strong></a> </li> 
     <li> <a href="#"><strong>Revision information</strong></a> </li> 
     <li> <a href="#"><strong>Authoring information</strong></a> </li> 
     <li> <a href="#"><strong>Publishing options</strong></a> </li> 
    </ul> 
</form> 

<script> 
    jQuery("#blog-node-form ul.vertical-tabs-list li").find('strong:contains("Menu settings")').parent().parent().hide(); 
    jQuery("#blog-node-form ul.vertical-tabs-list li").find('strong:contains("Authoring information")').parent().parent().hide(); 
</script>