Question

有一个简单的html视图：

<html>
<head>
</head>
<body>
<input id="summaryText" type="text" name="Summary" placeholder="Summary"><br>
<input id="groupText" type="text" name="Groups" placeholder="Groups"><br>
<input id="searchButton" type="button" value="Search"><br>
<table>
    <tr>
        <details>
            <summary><b>First Summary</b></summary>
            <ul>
                <details>
                    <summary><b>Groups</b></summary>
                    <ul>
                        <li>group A of First</li>
                        <li>group B of First</li>
                    </ul>
                </details>
                <details>
                    <summary><b>People</b></summary>
                    <ul>
                        <li>John</li>
                        <li>Mark</li>
                    </ul>
                </details>
            </ul>
        </details>
    </tr>
    <tr>    
        <details>
            <summary><b>Second Summary</b></summary>
            <ul>
                <details>
                    <summary><b>Groups</b></summary>
                    <ul>
                        <li>group A of Second</li>
                        <li>group B of Second</li>
                        <li>group C of Second</li>
                    </ul>
                </details>
                <details>
                    <summary><b>People</b></summary>
                    <ul>
                        <li>Alex</li>
                    </ul>
                </details>
            </ul>
        </details>
    </tr>
</table>
</body> 
</html>

我想使用summaryText和groupText来过滤页面中的元素。它可能就像display:none。

第一个输入summaryText应该作为普通过滤器。这意味着，如果main summary（来自每个tr元素中的第一个详细信息）包含来自String的{{1}}，则应该为用户显示（来自此{{1}的所有元素） }），如果不包含 - 它应该为用户隐藏（来自此summaryText的所有元素）。

第二个输入应按来自tr的{{1}}元素tr和String进行过滤。如果li中有details Groups，则li中的所有元素都应显示，如果不显示，则应隐藏给用户。

有没有办法按String搜索groupText元素，然后获取父tr并显示/隐藏它或只使用其他任何解决方案？

Answer 1

你可以使用这个逻辑：

$("*:not(body)").each(function() {
  if ($(this).html().indexOf("your phrase")>-1)
    // String is found, your code here
});

Answer 2

使用以下内容获取属于特定标记的所有元素的数组：

var array=document.getElementsByTagName("summary");

使用简单的for循环迭代此数组，并在该标记内搜索字符串。

for(i=0;i<array.length;i++){
   if(array[i].innerHTML.indexOf("word to search for") !== -1){
      //do something here
    }
}

按短语搜索html元素

2 个答案: