Удаление только родительского элемента в DOM JQuery - PullRequest
Новая
       36

Удаление только родительского элемента в DOM JQuery

3 голосов
/ 21 июня 2011

У меня заканчиваются идеи.У меня проблема здесь, когда мне нужно удалить только родительский элемент при сохранении дочернего элемента. 

<div class="remove_this_only">
    <table>
        <tbody>
            <tr>
                <td>I want to get preserved</td>
            </tr>
        </tbody>
    </table>
</div>

результирующий вывод должен быть 

<table>
    <tbody>
        <tr>
            <td>I want to get preserved</td>
        </tr>
    </tbody>
</table>

Ответы [ 11 ]

9 голосов
/ 21 июня 2011

РЕДАКТИРОВАТЬ:

Звучит так, как будто вы хотите удалить <div>, который вы добавили в вопрос.

Просто выберите <table> и используйте unwrap() [документы] метод. 

$('div > table').unwrap();

Конечно, выбор будет зависеть от вашего фактического разметка.

Пример: http://jsfiddle.net/VyJv3/ (стиль div удален)

Оригинальный ответ:

Таким образом, вы удалите элемент, необходимый для таблицы.

Если вы надеялись удалить <td>, у вас будет текстовый узел как потомок <tr>.Вы можете сделать это.

Если ваш HTML был такой: 

<html>
<table>
    <tbody>
        <tr>
            <td><span>I want to get preserved</span></td>
        </tr>
    </tbody>
</table>

... и вы хотели избавиться от <span>, вы могли бы использовать unwrap() [документы] метод. 

$('td > span').contents().unwrap();
6 голосов
/ 21 июня 2011

Прямой путь: 

var div = $(".remove_this_only");
var tmp = div.children().clone();
var parent = div.parent();
div.remove();
tmp.appendTo(parent);

Скрипка: http://jsfiddle.net/cb9sb/

1 голос
/ 21 июня 2011

Я думаю, я понимаю, что вы имеете в виду.

Я думаю, это то, что вы ищете: 

$("td").closest("table").unwrap();
1 голос
/ 21 июня 2011

Вы можете клонировать всю структуру и просто оставить нужные вам кусочки: 

$('html').clone().appendTo('tmp');
0 голосов
/ 07 августа 2017

Очень простым решением был бы метод jQuery unwrap () с добавленным селектором к родительскому элементу, который вы хотите удалить. Итак, в вашем случае: 

$('table').unwrap('.remove_this_only');

Примечание: если вы не добавите селектор '.remove_this_only', он может развернуть больше родительских элементов, чем вы хотите. В качестве альтернативы, если вы хотите убедиться, что вы указали целевой элемент «table» только в элементе «.remove_this_only», вы можете сделать следующее: 

 $('.remove_this_only').find('table').unwrap('.remove_this_only');
0 голосов
/ 20 мая 2013

Решение, помеченное как ответ, не является точным, как упомянуто в комментарии.

Вот точное решение, чтобы получить первых детей и заменить родителя с ребенком 

var child = $("#entry-longdesc").children().first().clone();
$("#entry-longdesc").replaceWith(child);

удалит только родительский тег и сохранит ваш дочерний домен таким, какой он есть

0 голосов
/ 21 июня 2011

Ответы в действии: 

//option 1
var $table = $('table');
$table.parent().before($table).remove();

//option 2
var $toRemove = $('.remove_this_only');
$toRemove.before($toRemove.children()).remove();

//option 3
$('table').unwrap();

Примечания:

  • append, before и некоторые другие функции jQuery выполняют «отсоединение» автоматически.Все они очень короткие, что делает их потрясающими.
0 голосов
/ 21 июня 2011 
var inner = $(".remove_this_only").html();
var parent = $(".remove_this_only").parent();
$(".remove_this_only").remove();
parent.append(inner);
0 голосов
/ 21 июня 2011

Возьмите содержимое div и замените div следующим: 

$(".remove_this_only").replaceWith($(".remove_this_only").html());
0 голосов
/ 21 июня 2011

Один из способов - взять то, что вы хотите оставить, и добавить его к родителю элемента, который вы хотите удалить. Затем удалите элемент, который хотите удалить.

Страница:
...