开发者

jQuery move node out of its parent

开发者 https://www.devze.com 2023-03-13 11:40 出处:网络
I have this code: <ul cla开发者_运维技巧ss=\"list\"> <li> <a href=\"#\" > <img src=\"IMAGE\" />

I have this code:

<ul cla开发者_运维技巧ss="list">
  <li>
    <a href="#" >
      <img src="IMAGE" />
      SOME TEXT
    </a>
  </li>
  <li>
    <a href="#" >
      <img src="ANOTHER IMAGE" />
      SOME DIFFERENT TEXT
    </a>
  </li>
</ul>

I want the images prepended to the parent node like this:

<ul class="list">
  <li>
    <img src="IMAGE" />
    <a href="#" >
      SOME TEXT
    </a>
  </li>
  <li>
    <img src="ANOTHER IMAGE" />
    <a href="#" >
      SOME DIFFERENT TEXT
    </a>
  </li>
</ul>


Try this:

$('.list > li > a > img').each(function() {
    $(this).insertBefore($(this).parent());
})

Demo at http://jsfiddle.net/alnitak/3nEVz/

EDIT I came up with a cleaner version:

$('.list > li > a > img').each(function() {
    $(this).parent().before(this);
})


$('ul.list img').each(function(_, elem) {
    var $elem = $(elem);
    $elem.prependTo( $elem.closest('li') );
});

demo: http://jsfiddle.net/hPbZD/1/


Try this:

$(function() {
    $('ul.list > li > a > img').each(function() {
      $(this).closest('li').prepend(this);
    });
});

See it in action here.

0

精彩评论

暂无评论...
验证码 换一张
取 消