使用jQuery查找带有文本的元素
我想在div中创建一个包含文本字符串的所有html元素的数组,例如
some string
.
我不想得到字符串,我希望数组项是元素(在示例中,将是p节点)。 我之前不知道字符串是什么,所以我找不到匹配的字符串值。 我也不希望空文本节点以数组结尾。
谢谢!
$("#my_div *").filter(function() { var $this = $(this); return $this.children().length == 0 && $.trim($this.text()).length > 0; })
此版本不会返回包含具有文本的元素的父元素,仅返回最后一级元素。
可能不是最快但在StackOverflow主页上运行得很好:)
自定义选择器可能对您的情况有所帮助:
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
我假设您只是尝试选择仅在其中包含文本的元素。
您可以使用not和空选择器来获取非空元素,而转换为数组可以使用get实现
$("#theDiv > :not(:empty)").get();
上面的选择器获取“theDiv”的所有子元素并且不是空的(即它们要么具有子元素或文本),然后将匹配的集合转换为数组。
如果你只想要里面有文字的元素,这应该有用……
$("#theDiv > :not(:empty, :has(*))").get();
要摆脱具有空格的元素,您可以使用filter
$("#theDiv > :not(:has(*))").filter(function() { return $.trim(this.innerHTML).length > 0; }).get();
您可以遍历子项并获取具有.text()值的所有内容!= ""
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
是包含一些文本的元素数组。
$(function() { var array = new Array(); $("#testDiv *").each(function(x, el) { if ($.trim($(el).text()) != '' ) { array.push(el); } }); alert(array.length); });
d是你想要找东西的div
v是一个空数组
我必须从0开始。
使用$ .trim,这样就不会得到只有空格的节点。
$("*",d).filter( function() { return $.trim($(this).text()) != "" } ).each( function() { v[i] = $(this).text(); i++; } );
也可以使用v.push($(this))……这完全让我不知所措。
使用:contains选择器:
var matches = new Array(); $('#start_point *:contains(' + text + ')').each(function(i, item) { matches.push( item ); }