поиск элементов с текстом с помощью jQuery - PullRequest
Новая
       54

поиск элементов с текстом с помощью jQuery

8 голосов
/ 19 июня 2009

Я хочу создать массив всех html-элементов внутри div, которые содержат текстовые строки, такие как 

<p>some string</p>.

Я не хочу завладеть строками, я хочу, чтобы элементы массива были элементами (в данном примере это был бы узел p). Я не знаю заранее, какие строки будут, поэтому я не могу искать строковые значения для соответствия. Я также не хочу, чтобы пустые текстовые узлы попадали в массив.

Спасибо!

Ответы [ 8 ]

10 голосов
/ 19 июня 2009 
$("#my_div *").filter(function()
{
     var $this = $(this);
     return $this.children().length == 0 && $.trim($this.text()).length > 0;
})

Эта версия не будет возвращать родительские элементы, содержащие элементы, имеющие тексты, только элементы последнего уровня.

Может быть не самым быстрым, но довольно хорошо работает на домашней странице StackOverflow:)

7 голосов
/ 19 июня 2009

Пользовательский селектор может быть полезен в вашем случае: 

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;
};

После этого вы можете просто сделать это: 

$('#someDiv :hasText') // will contain all elements with text nodes (jQuery object)
$('#someDiv :hasText').get() // will return a regular array of plain DOM objects

Я предполагаю, что вы пытаетесь выбрать только те элементы, которые содержат ТОЛЬКО текст внутри них.

2 голосов
/ 19 июня 2009

Вы можете использовать not и пустые селекторы, чтобы получить непустые элементы, в то время как преобразование в массив может быть достигнуто с помощью get 

$("#theDiv > :not(:empty)").get();

Приведенный выше селектор получает все дочерние элементы «theDiv», которые не являются пустыми (то есть имеют дочерние элементы или текст), а затем преобразует соответствующий набор в массив.

Если вам нужны только элементы с текстом внутри, это должно сработать ... 

$("#theDiv > :not(:empty, :has(*))").get();

Чтобы избавиться от элементов с пробелами, вы можете использовать фильтр 

$("#theDiv > :not(:has(*))").filter(function() { 
                 return $.trim(this.innerHTML).length > 0;
         }).get();
1 голос
/ 19 июня 2009 
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 - это массив элементов, в которых есть текст.

1 голос
/ 19 июня 2009

Вы можете перебирать children и захватывать все, что имеет .text () value != ""

0 голосов
/ 19 июня 2009

Используйте: селектор содержит: 

var matches = new Array();
$('#start_point *:contains(' + text + ')').each(function(i, item) {
 matches.push( item );
}
0 голосов
/ 19 июня 2009 
 $(function() {
        var array = new Array();
        $("#testDiv *").each(function(x, el) {

            if ($.trim($(el).text()) != '' ) {
                array.push(el);
            }
        });
        alert(array.length);
    });
0 голосов
/ 19 июня 2009

d - это div, в котором вы хотите найти вещи
v - пустой массив
я должен начинать с 0.

$ .trim используется для того, чтобы вы не получили узлы, которые являются просто пробелами. 

$("*",d).filter( function() { 
     return $.trim($(this).text()) != ""
  } ).each( function() { 
     v[i] = $(this).text(); 
     i++; 
  } );

Можно также использовать v.push ($ (this)) ... что-то, что полностью ускользнуло от меня.

...