html中百度效果的输入框，js实现类似百度的搜索输入输入框

可以使用原生JavaScript实现类似百度的搜索输入框效果。以下是一个简单的示例代码：

HTML代码：

<input type="text" id="search-input">
<ul id="search-result"></ul>

JavaScript代码：

var keywords = [
  "HTML",
  "CSS",
  "JavaScript",
  "jQuery",
  "Bootstrap",
  "PHP",
  "MySQL",
  "Python",
  "Java",
  "C++"
];
var input = document.getElementById("search-input");
var result = document.getElementById("search-result");

input.addEventListener("input", function() {
  result.innerHTML = "";
  var value = this.value.trim();
  if (value === "") {
    return;
  }
  keywords.forEach(function(keyword) {
    if (keyword.indexOf(value) !== -1) {
      var li = document.createElement("li");
      li.innerText = keyword;
      result.appendChild(li);
    }
  });
});

其中，keywords是一个包含所有可供搜索的关键词的数组，可以根据自己的需要进行修改。当用户输入内容发生变化时，我们遍历keywords数组，找到所有包含用户输入内容的关键词，并将它们添加到下拉列表中。如果用户输入内容为空，则清空下拉列表。