我怎样才能找到无用的div？

Question

我想找到所有无用的嵌套HTML标记来合并它们。

$srchtrm

在上面的例子中，我想找到只有一个子节点而没有任何<div style="font-size:12px"> --> Goal (this is useless) <div style="font-size:13px"> --> Not goal blah blah </div> </div> <div style="font-size:12px"> --> Not goal blah blah <div style="font-size:13px"> --> Not goal blah blah </div> </div> 节点的所有标签。

我怎样才能找到这些？

Answer 1

@A。沃尔夫的回答似乎很完美我把答案给别人：

＆＃13;

＆＃13;

var singleChilds = $('div').filter(function() {
  return !$(this).contents().filter(function() {
    return this.nodeType === 3 && this.nodeValue.trim()
  }).length && $(this).children().length < 2
});

console.log(singleChilds.attr('name'));

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div style="font-size:12px" name="Goal">
  <div style="font-size:13px">
    blah blah
  </div>
</div>

<div style="font-size:12px" name="notGoal">
  blah blah
  <div style="font-size:13px" name="notGoal">
    blah blah
  </div>
</div>

＆＃13;

＆＃13;

＆＃13;

感谢@A。沃尔夫。

Answer 2

你可以这样做：

<script src="https://code.jquery.com/jquery-2.2.4.min.js"></script>

<div class="goal" style="font-size: 12px">
        
        <div class="notgoal" style="font-size: 13px">
       --> Not goal 
        blah blah
        </div>
    </div>

    <div class="notgoal" style="font-size: 12px">
        --> Not goal 
            blah blah
        <div class="notgoal" style="font-size: 13px">
            --> Not goal 
         blah blah
        </div>
    </div>
    <script>
        var divs = [];
        $('div').each(function ()
        {
            var a = $(this);
            var childLenght = $(this).children().length;
            var textsEqual = $(this).children().eq(0).text().trim() == $(this).text().trim();
            if (childLenght === 1 && textsEqual)
            {
                divs.push($(this));
                console.log($(this).attr('class'));
            }
        });
        
    </script>