使用jQuery查找带有文本的元素

时间:2009-06-19 16:24:39

标签: jquery textnode

我想在div中创建包含文本字符串的所有html元素的数组,例如

<p>some string</p>.  

我不想掌握字符串,我希望数组项是元素(在示例中,将是p节点)。我事先不知道字符串是什么,所以我找不到匹配的字符串值。我也不希望空文本节点最终出现在数组中。

谢谢!

8 个答案:

答案 0 :(得分:10)

$("#my_div *").filter(function()
{
     var $this = $(this);
     return $this.children().length == 0 && $.trim($this.text()).length > 0;
})

此版本不会返回包含具有文本的元素的父元素,只返回最后一级元素。

可能不是最快但在StackOverflow主页上运行良好:)

答案 1 :(得分:7)

自定义选择器可能对您的情况有所帮助:

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 :(得分:2)

你可以使用not和空选择器来获取非空元素,同时转换为数组可以使用get实现

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

上面的选择器获取“theDiv”的所有子元素并且不是空的(即它们有子项或文本)然后将匹配的集合转换为数组。

如果您只想要在其中包含文本的元素,这应该有用......

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

要摆脱具有空格的元素,可以使用过滤器

$("#theDiv > :not(:has(*))").filter(function() { 
                 return $.trim(this.innerHTML).length > 0;
         }).get();

答案 3 :(得分:1)

您可以浏览children并获取.text()值为!= ""的所有内容

答案 4 :(得分:1)

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是包含一些文本的元素数组。

答案 5 :(得分:0)

d是你想要找东西的div v是一个空数组 我必须从0开始。

使用$ .trim,这样就不会得到只有空格的节点。

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

也可以使用v.push($(this))......这完全让我不知所措。

答案 6 :(得分:0)

 $(function() {
        var array = new Array();
        $("#testDiv *").each(function(x, el) {

            if ($.trim($(el).text()) != '' ) {
                array.push(el);
            }
        });
        alert(array.length);
    });

答案 7 :(得分:0)

使用:contains选择器:

var matches = new Array();
$('#start_point *:contains(' + text + ')').each(function(i, item) {
 matches.push( item );
}