текстовый поиск в javascript?

У меня есть страница с более чем 200 ссылками с таким форматом.текстовый поиск в javascript?

<h1> 
    <a href="somelink">Somelink</a> 
    some text that explain the meaning of the link. 
</h1>

Теперь, чтобы упростить поиск по этой ссылке, я разместил окно поиска.

Мое требование состоит в том, чтобы выполнить поиск по всему тегу и найти ссылки, которые относятся к в окне поиска и спрятать остальную ссылку.

Как это сделать в javascript? (я знаю базовые файлы javascript/jquery, но как выполнять полный текстовый поиск?) Я не требую сортировки в соответствии с релевантными, просто фильтр и показать, что шкура достаточно хороша.

источник

2010-07-18 iamgopal

Все ли они в h1 тегах случайно? –

есть несколько тегов h1, от 200 до последнего счета. Мне не нужен поиск на стороне сервера по причинам скорости, а суммарный объём всех 200 ссылок вряд ли пересекает 10 кб. – iamgopal

Надеюсь, вы найдете это полезным. Это, вероятно, не изящный или самый эффективный, но он позволит вам вводить несколько поисковых терминов и дает частичные совпадения (которые могут быть или не нужны). Как я сделал это, когда вы нажимаете кнопку поиска, он будет скрывать все остальные элементы, кроме тех, которые соответствуют любому из ваших поисковых терминов, но вы можете изменить это, чтобы делать все, что хотите, с элементами в массиве результатов. Я не рекомендую использовать это точно, но, надеюсь, он даст вам ссылку на то, как вы можете реализовать свои собственные (если вы решите пойти с решением, отличным от быстрого поиска).

<html> 
<head> 
<script src="http://code.jquery.com/jquery-latest.min.js"></script> 
<script type='text/javascript' language='javascript' > 
$(document).ready(function() { 
    var links = new Array(); 
    $("h1").each(function(index, element) {   
     links.push({ 
      text: $(this).text(), 
      element: element 
     }); 
    }); 

    $("#searchButton").click(function() { 
     var query = $("#searchBox").val(); 
     var queryTerms = query.split(' '); 

     var results = new Array(); 
     for(var i = 0; i < queryTerms.length; i++) { 
      for(var j = 0; j < links.length; j++) { 
       if (links[j].text.indexOf(queryTerms[i]) > -1) { 
        results.push(links[j].element);      
        } 
      } 
     } 

     $("h1").each(function(index, element) { 
      this.style.display = 'none'; 
     }); 
     for(var i = 0; i < results.length; i++) { 
      results[i].style.display = 'block'; 
     } 

    });  

}); 
</script> 

</head> 
<body> 
<p> 
<input id="searchBox" type="text" /> 
<input type="button" id="searchButton" value="Search" /> 
</p> 

<h1> 
    <a href="somelink">Somelink1</a> 
    asdf 
</h1> 
<h1> 
    <a href="somelink">Somelink2</a> 
    ssss 
</h1> 
<h1> 
    <a href="somelink">Somelink3</a> 
    3333 
</h1> 
<h1> 
    <a href="somelink">Somelink4</a> 
    232323 
</h1> 
<h1> 
    <a href="somelink">Somelink5</a> 
    fffff 
</h1> 

</body> 
</html>

источник

2010-07-18 04:51:46

Я нашел один.

http://github.com/riklomas/quicksearch

, который использует регулярное выражение для поиска.

источник

2010-07-18 04:27:56 iamgopal

Вы можете перечислить все теги h1 получить внутренний HTML и сделать indexOf, или вы можете использовать jQuery это обычай сделал contains функциональность, которая возвращает элементы, имеющие данный текст.

Вот пример скопирован из JQuery Документов

<!DOCTYPE html> 
<html> 
<head> 
    <script src="http://code.jquery.com/jquery-latest.min.js"></script> 
</head> 
<body> 

<div>John Resig</div> 

<div>George Martin</div> 
<div>Malcom John Sinclair</div> 
<div>J. Ohn</div> 


<script> 
$("div:contains('John')").css("text-decoration", "underline"); 
    </script> 
</body> 
</html>

источник

2010-07-18 04:28:35

Ничего себе, это действительно хорошо, я не знал об этом! – BrunoLM

Итак, я работаю над решением, которое связано с построением массива, а затем для поиска этого массива для текста, что делает мое решение раздутым и замедленным. +1 для простоты. –

Как это работает для нескольких слов? (он разбивает их и ищет или ищет всю строку?) – iamgopal

текстовый поиск в javascript?

ответ

Смежные вопросы