Отсоедините элемент от DOM, вставьте его обратно в другое место

На странице мне нужно обнаружить все записи, в которых есть изображение, и добавить стили к H1 и img и p, которые содержат img в этих записях , Пока нет проблем.Отсоедините элемент от DOM, вставьте его обратно в другое место

<div class="entry"> 
    <h1>Headline</h1> 
    <p><img></p> 
    </div> 

    $("div.entry img").closest(".entry").find("h1").addClass("home-h1-adjust"); 
    $("div.entry img").closest("p").addClass("home-p-img-adjust");

Чтобы полностью решить эту проблему я столкнулся, мне нужно снять либо h1 или р, и снова вставить туда, где р предшествует h1, и это для ряда записей, не все которые имеют изображение.

Я зацикливаюсь на правильном пути, чтобы прокрутить и добавить отдельные элементы в jQuery. Благодарю.

источник

2013-07-14 lockedown

Вот решение, которое сработало: перебирайте все записи на странице, ищите изображение, присоединяйте классы к тегу H1 и first p. Подготовьте p, содержащий изображение выше H1, в качестве первого дочернего элемента div.

<div class="entry"> 
    <h1>Headline 1</h1> 
    <p><img />Image? Yes</p> 
    <p>Some Text that needs to stay put</p> 
    <p>More copy text</p> 
    </div> 

    <div class="entry"> 
    <h1>Headline 2</h1> 
    <p>Text in a non image entry</p> 
    <p>This text has no image to keep it company</p> 
    </div> 


    $('div.entry').each(function(){ 
    var $this = $(this); 
    if($this.find('img').length > 0) { 
     $this.find('h1').addClass('home-h1-adjust'); 
     var $img = $this.find('p').first().addClass('home-p-img-adjust'); 
     $this.prepend($img); 
    } 
    });

http://jsfiddle.net/lockedown/vkeeD/1/

источник

2013-07-15 01:22:06 lockedown

$('.entry > p').each(function() { 
    $(this).insertBefore(this.previousElementSibling); 
});

http://jsfiddle.net/Yr96v/

источник

2013-07-14 21:48:36 undefined

Цените помощь, не определено. Мне нужно настроить только первый тег p и только в записи с изображением. Эта скрипка показывает мое окончательное решение. http://jsfiddle.net/lockedown/vkeeD/1/ – lockedown

//for each entry 
$('div.entry').each(function(){ 
    var $this = $(this); 

    //if entry has img 
    if($this.find('img').length > 0) { 
     //jQuery is chainable, and detaching is done automatically 
     $this.find('h1').addClass('home-h1-adjust') 
      .before($this.find('p').addClass('home-p-img-adjust')); 
    } 
});

http://jsfiddle.net/tB8f4/

источник

2013-07-14 22:13:54 joram

Это действительно помогло мне начать. В некоторых записях есть несколько тэгов, у других - только два. Скрипка, если вы заинтересованы: http://jsfiddle.net/lockedown/vkeeD/1/ – lockedown

Это круто. Я посмотрел на ваш окончательный код. Вы могли бы просто сделать это. [link] (http://jsfiddle.net/tB8f4/35/) – joram

Aha. Раньше я не знал об eq(). Это кажется действительно полезным. Спасибо, что нашли время поделиться этим, я буду помнить об этом в будущем. – lockedown

$('div.spacer a').addClass('test').each(
    function(){ 
     $(this).remove(); 
    } 
);

Вы можете использовать .each() просто открыть хромированную консоль и играть с ним. приведенный выше пример удаляет каждую связанную ссылку на этой странице. конечно, вы могли бы сделать var element = $(this).detach();, а затем element.appendTo('YOUR POSITION')

источник

2013-07-14 22:14:23

Спасибо Миша, это было отличное направление, но в конечном итоге эта скрипка - это то, как я ее решил. http://jsfiddle.net/lockedown/vkeeD/1/ – lockedown

Отсоедините элемент от DOM, вставьте его обратно в другое место

ответ

Смежные вопросы