删除父级的父级或特定标记

Question

我有一些生成的输出如下：

<figure>
    <a href="location.php"><img src=""></a>
</figure>

当我应用这个JS：

$(funciton() {
    $('img').each(function(){
        if($(this).attr('src') == null || $(this).attr('src') == '')
            { 
                $(this).parent().remove();
            }
});

它删除了img标记，它是父标记，但在页面上留下了这个输出：

<figure>
"&#8203"            ​
</figure>

如何删除paren't的父标记或仅修剪它以便不存在空白实体？当图形标记中有任何内容时，它具有1px的高度和来自css的边距。我可以改变CSS，但想要弄清楚这一点，非常感谢帮助！

Answer 1

如果您想确保如果图片代码没有<figure>，则父.src标记为空，则可以执行以下操作：

$(function() {
    $('img').each(function() {
        if(!this.src) { 
            $(this).closest("figure").empty();
        }
     }
});

.empty()删除元素中的所有子节点和任何文本。

注意，我还简化了对.src的比较。首先，没有必要在这里使用jQuery，第二关，单个测试可以检查任何空值。

如果您确实希望<figure>标记在页面上不占用空间，您可能只需在其上执行.hide()。