Получите img src, а затем измените контейнер div

Question

Получите img src, а затем измените контейнер div

0

У меня этот html

<div class="mytext">
blablabla
</div>

<div class="part2" data-type="background" data-speed="10">
    <img src="images/bb4.jpg" />
</div>

<div class="mytext">
hello hello world
</div>

<div class="part2"    data-type="background" data-speed="10">
    <img src="images/bb5.jpg" />
</div>

теперь я хочу получить каждый src изображений в контейнере part2, а затем изменить html на этот результат

<div class="mytext">
blablabla
</div>

<div class="part2" style="background:url('images/bb4.jpg') fixed;" data-type="background" data-speed="10">

</div>

<div class="mytext">
hello hello world
</div>

<div class="part2" style="background:url('images/bb5') fixed;" data-type="background" data-speed="10">

</div>

в основном я должен получить src, а затем отредактировать атрибуты контейнера div и удалить тег img, и я должен сделать это при загрузке страницы

Я написал этот кусок кода, чтобы получить src, но он не работает, и нет части изменения div

var elems = [].slice.call( document.getElementsByClassName("post2") );
elems.forEach( function( elem ){
    elem.onclick = function(){
        var arr = [],
            imgs = [].slice.call( elem.getElementsByTagName("img") );
        if(imgs.length){
            imgs.forEach( function( img ){
                var attrID = img.id;
                arr.push(attrID);
            });
            alert(arr);
        } else {
            alert("No images found.");
        }
    };
});

может кто-нибудь мне помочь? :) спасибо

Giorgio Romano 23 сен. 2013, в 14:02

Источник

Теги:

javascript

jquery

html

2 ответа

Ещё вопросы

Mina · Answer 1 · 2013-09-23T09-14-00.000Z

$('.part2').each(function(){
  img = $(this).find('img');  
  $(this).css({'background': 'url(' +   img.attr('src') + ') fixed'});
  img.remove();
});

добавьте «исправлено» к фону CSS, и все готово
идеально это то, что я искал :)! Большое спасибо!
@GiorgioRomano, вы можете проверить, существует ли img самом деле, иначе он потерпит неудачу.
@ Хорошая мысль, что-то вроде if ($ (this) .find (img) .length) {..} else {...}?

Deep Sharma · Answer 2 · 2013-09-23T09-14-00.000Z

SInce вы добавили тег JQuery. Вот ответ в jquery.

$('#test').click(function(){
    $('.part2').each(function(){
        $(this).attr('style','background:url(\''+ $(this).find('img').attr('src')+'\') fixed;');
        $(this).find('img').remove();
    });
});

или

 $('#test').click(function(){
        $('.part2').each(function(){
            $(this).css('background','url(\''+ $(this).find('img').attr('src')+'\') fixed');
            $(this).find('img').remove();
        });
    });

Все ответы похожи, но этот пример. так что +1 за это.
Вместо установки styel (typo?) Вы можете использовать метод .css() .
да, мы можем даже это было довольно легко. но я сделал это согласно требованию.
@ не определил тебя, это была опечатка