Javascript 隐藏a<；部门>；没有指定的字符串

所以，尽可能简单地说。。 我有多个div，其中包含文本，如图所示：

<div id=1 style="position:relative"><font color=color>Hello Hello</font></div>
<div id=2 style="position:relative"><font color=color>Hello Goodbye</font></div>
<div id=3 style="position:relative"><font color=color>Goodbye Goodbye</font></div>

你好你好 你好，再见 再见，再见 我想在我的页面上的某个地方有一个搜索框，可以输入字符串，例如：“Hello”隐藏最后一个div，“Hello Hello”隐藏最后两个div，“Hello再见”隐藏第一个和最后一个div，“再见再见”隐藏前两个div。输入不必区分大小写，但我更喜欢字符串的输入顺序

提前谢谢！ -小星星

PS：如果可能的话，我更愿意远离JQuery。

在纯W3C规范中：

演示：

HTML:

<input type="text" id="my_input">

---

其中一个条件应将显示设置为非无。否则看起来很好复制粘贴错误，在这两种情况下都隐藏了它们！您可能应该将其设置为

.display=“”

，而不是block。我已经用：进行了测试，并将#inputID替换为“1”，尽管它似乎仍然不起作用。我可能做错了什么事，就像我经常做的那样。你介意指出可能是什么吗？Thanksid和类一样，不能以数字开头。另外，在IDI周围加上引号。我已经按照你的指示做了，但是运气不好。我有：和document.addEventListener（“搜索”，函数（事件），其余代码保持不变..如何在“var search_for='hello'”中获得“hello”；”要替换为我在字段中输入的任何字符串吗？我需要这个来更新live。谢谢。对不起，我以为您已经有了获取该字符串的方法。我已经更新了我的代码以反映该要求。将其更新为使用数组原型调用（因为元素集不是数组），并验证输入是否有值（当字段为空时，可防止所有内容隐藏）请注意，这在您键入时也会很清楚，但您需要它与div内容完全匹配吗？不，这很完美。谢谢！@adeneo这是一个例子，我不想只包含随机颜色。此外，尽管我不是一个可以判断的人，如果您根本不打算提供帮助，为什么还要在这个帖子上发表呢？

<input type="text" id="my_input">

document.getElementById('my_input').addEventListener('keyup', function () {
    var search_for = this.value;
    var divs = document.getElementsByTagName('div');
    Array.prototype.forEach.call(divs, function (div) {
       if (search_for && div.textContent.toLowerCase().indexOf(search_for.toLowerCase()) > -1) {
           div.style.display = 'none'; // to hide
       }
       else {
           div.style.display = 'block';
       }
    });
});​