Search for HTML style LIKE% ..%

2

How can I search in HTMLS style LIKE %..% type I own these divs with these styles

<div class="texto_de_reportagem">Olá meu nome é fulana de tal e nasci assim vou morrer assim Fulaninhanhá..</div>

<div class="texto_de_reportagem">Olá meu nome é Alterbania de tal e nasci assim vou morrer assim Fulaninhanhá..</div>

<div class="texto_de_reportagem">Olá meu nome é Iscrovenia de tal e nasci assim vou morrer assim Fulaninhanhá..</div>

<div class="texto_de_reportagem">Olá meu nome é Lubiscréia de tal e nasci assim vou morrer assim Fulaninhanhá..</div>

How can I search within all named classes texto_de_reportagem the name of Lubiscréia for example? Or if I put the word " tal " in the "search" it would return all the rows since they all have the word tal ... In the same way that MySQL works understand?

    
asked by anonymous 02.07.2015 / 03:07

3 answers

4

Create a function that looks for a word in a list of elements.

I've done an example that also accepts the option to search respecting (or not) having large print.

function encontrar(palavra, elementos, caseSensitive) {
    return [].filter.call(textos, function (texto) {
        var innerHTML = texto.innerHTML;
        if (!caseSensitive) {
            innerHTML = innerHTML.toLowerCase();
            palavra = palavra.toLowerCase();
        }
        return innerHTML.indexOf(palavra) != -1;
    });
}

What this function does is look at the .innerHTML of each element by the position of the word you want. If it can not find .indexOf() gives -1 .

jsFiddle: link

    
02.07.2015 / 09:04
2

Using only :

window.onload = function () {
  var like = "Alterbania".toLowerCase(); // evitar case sensitive
  var divs = document.getElementsByTagName('div');
  var encontrados = [];
  for (var i = 0; i < divs.length; i++) {
     if (divs[i].innerHTML.toLowerCase().indexOf(like) > -1) {
         encontrados.push(divs[i]);
     }
  }
  console.log(encontrados);
  alert("Encontrado: " + encontrados.length);
  return encontrados;
}
<div class="texto_de_reportagem">Olá meu nome é fulana de tal e nasci assim vou morrer assim Fulaninhanhá..</div>

<div class="texto_de_reportagem">Olá meu nome é Alterbania de tal e nasci assim vou morrer assim Fulaninhanhá..</div>

<div class="texto_de_reportagem">Olá meu nome é Iscrovenia de tal e nasci assim vou morrer assim Fulaninhanhá..</div>

<div class="texto_de_reportagem">Olá meu nome é Lubiscréia de tal e nasci assim vou morrer assim Fulaninhanhá..</div>

Using :

$(document).ready(function () {
  
  /* ajusta o constains pra pegar case sensitive */
  jQuery.expr[':'].contains = function(a, i, m) {
    return jQuery(a).text().toLowerCase()
        .indexOf(m[3].toLowerCase()) > -1;
  };  
  
  var like = "Alterbania".toLowerCase();
  var encontrados = $('div:contains("' + like + '")');
  console.log(encontrados);
  alert("Encontrado: " + encontrados.length);
  return encontrados;
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script><divclass="texto_de_reportagem">Olá meu nome é fulana de tal e nasci assim vou morrer assim Fulaninhanhá..</div>

<div class="texto_de_reportagem">Olá meu nome é Alterbania de tal e nasci assim vou morrer assim Fulaninhanhá..</div>

<div class="texto_de_reportagem">Olá meu nome é Iscrovenia de tal e nasci assim vou morrer assim Fulaninhanhá..</div>

<div class="texto_de_reportagem">Olá meu nome é Lubiscréia de tal e nasci assim vou morrer assim Fulaninhanhá..</div>
    
02.07.2015 / 03:21
0

The example below returns all the divs with the value "Lubiscréia".

$( "div:contains('Lubiscréia')" );

Or, filtering by class:

$("span[class='texto_de_reportagem']").filter(":contains('Lubiscréia')");
    
02.07.2015 / 03:14