📜  如何检查 ul 是否有给定文本的 li ?

📅  最后修改于: 2021-11-25 04:35:12             🧑  作者: Mango

方法一:使用列表上的each()方法检查innerText属性

首先使用 jQuery 选择器选择无序列表的每个列表元素。对这个列表使用each()方法来遍历它。这个方法有一个回调函数,返回当前索引和迭代的元素。

检查返回元素内的文本的innerText属性,以查看它是否与所需的文本匹配。成功匹配意味着所选无序列表中的文本具有所需的文本。

句法:

let found = false;
 
$("#list li").each((id, elem) => {
  if (elem.innerText == requiredText) {
    found = true;
  }
});
 
return found;

例子:



  

    
        Check if ul has li with a specific text in jQuery.
    

  

    

    GeeksforGeeks   

         How to check if ul has li with     a specific text in jQuery?        
            
  • GeeksforGeeks
  •         
  • Computer
  •         
  • Science
  •         
  • Portal
  •     
    

        The li elements contain the text "Computer":                 

    

        The li elements contain the text "Python":                 

                 

输出:

  • 点击按钮前:
    每种方法之前
  • 点击按钮后:
    每种方法之后

方法 2:使用 contains() 选择器
contains()选择器用于选择具有与给定文本匹配的文本的元素。该文本可以出现在元素的任何后代或元素本身中。它需要一个参数,即要匹配的区分大小写的文本。

contains() 选择器与用于选择列表元素的选择器一起使用。如果没有选择任何元素,即如果给定的文本不存在,则返回的元素数将为 0。返回的元素数可以使用 length 属性检查,并用于验证列表是否包含指定的文本。

句法:

let found = false;
 
selector = `#list :contains('${requiredText}')`
selectedList = $(selector);
 
if (selectedList.length) {
  found = true;
}
return found;

例子:



  

    
        Check if ul has li with a specific text in jQuery.
    

  

    

    GeeksforGeeks   

         How to check if ul has li with     a specific text in jQuery?        
            
  • GeeksforGeeks
  •         
  • Computer
  •         
  • Science
  •         
  • Portal
  •     
    

        The li elements contain the text "Computer":                 

    

        The li elements contain the text "Python":                 

                 

输出:

  • 点击按钮前:
    包含之前
  • 点击按钮后:
    包含之后