Question

我想用JS函数更改div中所有图像的背景：

我的div：

<div>
    <div id="avatar_container">
        <img src="a.png" onclick="myfunction()"  />
        <img src="b.png" onclick="myfunction()"  />
    </div>
</div>

我的功能：

function myfunction(){
    //I tried this two methods
    document.getElementById("avatar_container").getElementsByTagName('img').css({'background' : 'green'}); 
    document.getElementById("avatar_container").getElementsByTagName('img').style.backgroundColor = "green";        
}

Answer 1

这解决了你的问题

<div id="avatar_container">
    <img src="a.png"  class="myClass1"  />
     <img src="b.png"  class="myClass1"  />
</div>

Js :(重要提示：在html代码后使用js代码）

  var elems = document.getElementsByClassName('myClass1'), i;
    for (i in elems) {
            elems[i].style.backgroundColor = "green";  
        }
    }

但我建议你使用和学习Jquery，

jquery是一个Javascript框架，通过较少的编码使你的一切变得非常轻松

使用Jquery你可以像这样做最简单

$('#avatar_container .myClass1').css('backgroundcolor','green');

如果你想附加点击事件

 $('#avatar_container .myClass1').click(function() {
   $(this).css('backgroundcolor','green');
});

Javascript：更改div内所有图像的背景

1 个答案: