检查 span 元素是否包含“文本”，并且是父元素的最后一个子元素

Check if an span element contains a "text" and is the last child of a parent element

本文关键字：元素 最后一个 是否 span 包含 检查 文本      更新时间：2023-09-26

我正在循环属于"frag"类的span元素。我想检测碎片元素 im 当前是否在

  1. 父级的类名上带有"cond"和
  2. 该父项包含文本"if"或"else if"和
  3. 目前的碎片是父母的最后一个孩子，有资格在1号和2号。

（顺便说一下，我的系统就像一个代码编辑器，所以我使用的是内容可编辑的div）在这里，我想检测 im 是否在 b 上有资格作为 1、2 和 3

。

内容可编辑div （文本区域）

if( (b>3) && b<10)

我所做的并不介意循环。我不知道如何构建条件。

if( $('.frag').eq(ctr).parent().hasClass('cond') && /(?:if|else's+if)/g.test$('.frag').eq(ctr).text() && $('.frag').eq(ctr).lastChildOfParent )

.HTML

<div id="board">
  <div>
  <span class="frag cond">if <span class="openParen bm1">(</span> <span class="frag cond">(<span class="frag">b</span>&gt;3) </span> && <span class="frag">b</span>&lt;10 <span class="closeParen bm1">)</span></span>
  </div>
</div>

UPDATE1：添加了(和)的跨度换行。这使)成为最后一个孩子。

UPDATE2：我所说的父母的意思是，它可以是直系父母，祖父母或祖祖父母。这样，内容可编辑div 中的文本就不会有问题，例如 if（ （b>3） && （（c>1）||（乙<10））)

因为当 im 在最后一个b的片段中时，我不会在我的直系父母 （b<10） 中找到"if"或"else if"

测试是否是最后一个孩子

$('.frag').eq(ctr).is(function(){
    var $this = $(this), fragsibs = $this.siblings('.frag').addBack();
    return fragsibs.last().is(this) && /^(if|else 's+if)/.test($this.text())
});

您似乎有 （1） 和 （2） 正常，所以对于 （3），请尝试：

$elem.nextAll('.frag').length === 0

其中$elem是你正在测试的元素的jQuery对象。

请参阅：http://api.jquery.com/nextAll/

所以，总的来说，你想要这样的东西：

var $parent = $elem.parent();
if ($parent.hasClass('cond') && /^'s*(if|else's+if)/.test($parent.text()) && !$elem.nextAll('.frag').length) {
    // do things
}

我唯一不确定的是正则表达式，因为我不是 100% 你想要的。我选择了以"if"或"else if"开头。

更新：

如果我了解您的更新，请尝试：

var validAncest = $elem.parents('.cond').filter(function(i){
    return /^'s*(if|else's+if)/.test($(this).text());
});
// this finds all ancestors with class 'cond' and 
// whose containing text starts with 'if'/'else if'
if (validAncest.length && !$elem.nextAll('.frag').length) {
    // do things
}

更新2：如果您需要计算祖先中后代的深度，则可以使用：

function childDepth ($elem, $ancestor) {
    var generations = 0;
    while ($elem[0] && $elem[0] !== $ancestor[0]) {
        generations++;
        $elem = $elem.parent();
    }
    if ($elem[0]) {
        return generations;
    }
}

如果$ancestor是$elem的父代，它将返回1，如果是祖父级，则返回2;如果$ancestor实际上不是$elem的祖先，它将返回undefined。

相关文章：