首页 > 解决方案 > Vanilla JavaScript 搜索 - 如何添加多个字段?

问题描述

此功能正在从 Json 数据中搜索字段“标题”。请问,我该如何修改它以包含多个字段,例如:“tags”、“author”等?谢谢!

document.addEventListener('DOMContentLoaded', function(event) {
  const search = document.getElementById('search');
  const results = document.getElementById('results');
  let data = [];
  let search_term = '';

  fetch('/search.json')
    .then(response => response.json())
    .then(data_server => {
      data = data_server;
    });

  search.addEventListener('input', event => {
    search_term = event.target.value.toLowerCase();
    showList();
  });

  const showList = () => {
    results.innerHTML = '';
    if (search_term.length <= 0) return;
    const match = new RegExp(`${search_term}`, 'gi');
    let result = data.filter(name => match.test(name.title));
    if (result.length == 0) {
      const li = document.createElement('li');
      li.innerHTML = `No results found `;
      results.appendChild(li);
    }
    result.forEach(e => {
      const li = document.createElement('li');
      li.innerHTML = `<a href="${e.url}">${e.title}</a>`;
      results.appendChild(li);
    });
  };
});

标签: javascript

解决方案


改变

let result = data.filter(name => match.test(name.title));

let result = data.filter(name => match.test(name.title) || match.test(name.tags) || match.test(name.auther));

推荐阅读