Удалите таблицу HTML и вставьте ее в другую часть веб-страницы. Возможно ли это с помощью JQuery? - PullRequest
Новая
       2

Удалите таблицу HTML и вставьте ее в другую часть веб-страницы. Возможно ли это с помощью JQuery?

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

У меня есть HTML-таблица на странице <table id="options_table"></table>

Я хочу автоматически при загрузке страницы:

  1. УДАЛИТЬ HTML TAGLE TAG из одного места на веб-странице
  2. Вставьте его в другое место под этим тегом SPAN 
<span><a href="test">test</a><br /></span>

Возможно ли это в Jquery?

Ответы [ 5 ]

2 голосов
/ 01 июня 2011

Вам просто нужно добавить его. Сначала дайте промежутку ID: 

<span id="afterMe"><a href="test">test</a><br /></span>

Затем используйте следующий фрагмент jQuery: 

$('#afterMe').after($('#options_table'));

Вот простой пример: http://jsfiddle.net/vAewz/

jQuery автоматически переместит узел. Не нужно звонить .detach().

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

Вы также можете сделать это следующим образом.

Если вы поместите тег span или div вокруг двух чередующихся мест, то при загрузке страницы вы можете просто сделать что-то вроде этого: 

<span id="start"><table id="options_table"></table></span>
<span id="finish"></span>

$(document).ready(function() {
    var table = $('#start').html();
    $('#start').html('');
    $('#finish').html(table);
});
0 голосов
/ 01 июня 2011

Как то так должно работать 

<html>
<head>
<script type="text/javascript" src="jquery.js"></script>          
<script type="text/javascript">                                        
 $(document).ready(function() {
 $("#click").click(function(e) {
  e.preventDefault();
  $("#options_table").appendTo('#target');
 });
});
</script>
</head>
<body>
<table id='options_table'>
<tr>
  <td>Something here</td>
</tr>
</table>
<span id="target"><a id="click" href="test">test</a><br /></span>
</body>
</html>
0 голосов
/ 01 июня 2011

Вы спрашивали конкретно о JQuery, но [предупреждение о незапрошенном совете!] вам не нужно прибегать к фреймворку. Вместо этого: 

<table id="source"> ... </table>
<table id="dest"> ... </table>

тогда как то так: 

getRefToDiv("dest").innerHTML = getRefToDiv("source").innerHTML;
getRefToDiv("source").innerHTML = "";
0 голосов
/ 01 июня 2011

Рабочий пример: http://jsfiddle.net/vvgLU/

$('#my-span').after($('#options_table').detach())

$. Detach
$. После

Примеры для обоихпошли.

...