扮演一个前端程序员，实现搜索框中条件清空后数据还原

你可以通过以下步骤实现搜索框中条件清空后数据还原：

1. 在你的搜索框中添加一个“清空”按钮。
2. 当用户点击“清空”按钮时，使用 JavaScript 将搜索框中的所有条件都清空。
3. 在清空条件之前，你需要将所有条件的值都存储在变量中。
4. 当用户重新输入条件时，你可以使用存储的变量将之前的条件重新填充到搜索框中。

以下是一个简单的示例代码：

// 获取搜索框元素
const searchInput = document.querySelector('#search-input');

// 获取清空按钮元素
const clearButton = document.querySelector('#clear-button');

// 存储搜索条件的变量
let searchConditions = {};

// 监听清空按钮点击事件
clearButton.addEventListener('click', () => {
  // 清空搜索框中的条件
  searchInput.value = '';

  // 清空存储条件的变量
  searchConditions = {};
});

// 监听搜索框输入事件
searchInput.addEventListener('input', () => {
  // 获取搜索框中的条件
  const conditions = searchInput.value;

  // 将条件存储到变量中
  searchConditions = { ...searchConditions, ...conditions };
});

// 当用户重新进入页面时，将之前的条件填充到搜索框中
window.addEventListener('load', () => {
  // 将存储的条件填充到搜索框中
  searchInput.value = searchConditions;
});

这段代码监听了清空按钮的点击事件和搜索框的输入事件，当用户点击清空按钮时，搜索框中的条件会被清空，并且存储条件的变量也会被清空。当用户输入条件时，这些条件会被存储到变量中。当用户重新进入页面时，存储的条件会被自动填充到搜索框中。