Question

我有这个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>

现在我想在part2容器中获取图像的每个src，然后将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.");
        }
    };
});

有人能帮助我吗？:) 感谢

Answer 1

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

Answer 2

您已添加Jquery标记。 Here是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();
        });
    });

获取img src，然后修改div容器

2 个答案: