Question

我如何将这个jquery代码转换为 vanilla Javascript

 $("h2:contains('" + search + "')").closest(".element").show();
 $("h2:not(:contains('" + search + "'))").closest(".element").hide();

我得到了该行的下半部分 closest(".element").style.display = "block" 但我找不到上半年在正常Javascript中工作的方法。我正在创建一个实时搜索功能，以匹配搜索输入中的文本以匹配h2。如果它们匹配，它将显示内容；否则，将显示内容。

Answer 1

在Jquery contains中，您可以查找一串文本。

因此，您需要在此处获取所有h2标签并在其文本中进行搜索。

由于h2元素没有值，您应该使用innerHTML，然后使用includes方法而不是包含。

var allHTwos= document.getElementsByTagName('h2');
for (i=0; i<allHTwos.length; i++) {
    var gh = allHTwos[i];
    var ts = gh.innerHTML;
    if(ts.includes(search)){
// Do your hide/unhide here
}
}

我如何将这个jQuery转换为JavaScript

1 个答案: