encontrar elementos con texto usando jQuery
Pregunta
Quiero crear una matriz de todos los elementos html dentro de un div que contenga cadenas de texto, como
<p>some string</p>.
No quiero obtener las cadenas, quiero que los elementos de la matriz sean los elementos (en el ejemplo, sería el nodo p). No sé de antemano cuáles serán las cadenas, por lo que no puedo buscar valores de cadena que coincidan. Tampoco quiero que los nodos de texto vacíos terminen en la matriz.
¡Gracias!
Solución
$("#my_div *").filter(function()
{
var $this = $(this);
return $this.children().length == 0 && $.trim($this.text()).length > 0;
})
Esta versión no devolverá elementos primarios que contengan elementos que tengan textos, solo los elementos de último nivel.
Puede que no sea el más rápido, pero funciona bastante bien en la página de inicio de StackOverflow :)
Otros consejos
Un selector personalizado podría ser útil en su caso:
jQuery.expr[':'].hasText = function(element, index) {
// if there is only one child, and it is a text node
if (element.childNodes.length == 1 && element.firstChild.nodeType == 3) {
return jQuery.trim(element.innerHTML).length > 0;
}
return false;
};
Después de eso, simplemente puede hacer esto:
$('#someDiv :hasText') // will contain all elements with text nodes (jQuery object)
$('#someDiv :hasText').get() // will return a regular array of plain DOM objects
Supongo que solo está intentando seleccionar elementos que SÓLO tienen texto dentro de ellos.
Puede usar not y los selectores vacíos para obtener los elementos no vacíos mientras que la conversión a una matriz se puede lograr usando get
$("#theDiv > :not(:empty)").get();
El selector anterior obtiene todos los elementos secundarios de " theDiv " y que no están vacías (es decir, tienen hijos o texto) y luego convierten el conjunto coincidente en una matriz.
Si solo desea elementos que tengan texto dentro, esto debería funcionar ...
$("#theDiv > :not(:empty, :has(*))").get();
Para deshacerse de los elementos que tienen espacios en blanco, puede utilizar el filtro
$("#theDiv > :not(:has(*))").filter(function() {
return $.trim(this.innerHTML).length > 0;
}).get();
var array = [];
var divSelector = "div.mine";
$(divSelector).contents().each(function()
{
// If not an element, go to next node.
if (this.nodeType != 1) return true;
var element = $(this);
if ($.trim(element.text()) != "")
array.push(element);
});
array
es la matriz de elementos que contienen texto.
$(function() {
var array = new Array();
$("#testDiv *").each(function(x, el) {
if ($.trim($(el).text()) != '' ) {
array.push(el);
}
});
alert(array.length);
});
d es el div bajo el cual desea encontrar cosas
v es una matriz vacía
tengo que empezar en 0.
El $ .trim se usa para que no obtenga nodos que son solo espacios en blanco.
$("*",d).filter( function() {
return $.trim($(this).text()) != ""
} ).each( function() {
v[i] = $(this).text();
i++;
} );
También se puede usar v.push ($ (this)) ... que es algo que se me olvidó por completo.
Utilice el selector: contiene:
var matches = new Array();
$('#start_point *:contains(' + text + ')').each(function(i, item) {
matches.push( item );
}