javascript - 使用jQuery删除父跨度标签？

Question

我想使用 Jquery 从以下代码中删除两个 span 标签因为 div 是 span 的子级，它会在 w3validators 中给出错误：

    <td class="col-1 col-first">
    **<span>
    <span>**
    <div class="user-picture">
    <a href="/users/shoprite-mp" title="View user profile.">
    <img typeof="foaf:Image" src="http://locationbasedmedia.co.za/sites/default/files/styles/thumbnail/public/pictures/picture-580-1379344365.jpg" alt="Shoprite Mp's picture" title="Shoprite Mp's picture"/>
    </a>
    </div>
    **</span>
    </span>**
    </td>

Answer 1

利用

$(".user-picture").unwrap();
$(".user-picture").unwrap();

使用 unwrap 两次来删除两个父 span 并保留内部结构。

Answer 2

另一种解决方案是：

$('td').click(function () {
    var content = $('.user-picture', this).detach();
    $(this).append(content);
    $('span', this).remove()l
});

unwrap非常适合您的场景，但有时您希望将 .user-picture 移动不止 2 个级别，detach这有助于在保持对象（包括它的属性和事件）完整的同时。