首页 > 解决方案 > 如何根据图像使用 JS 制作动态横幅更改背景颜色?

问题描述

我正在制作一些动态横幅,我想通过消除颜色变化来减少变体的数量。我正在考虑根据从提要中获取的徽标来更改背景颜色和文本颜色。只有两种徽标变体。因此,我认为 If/else 语句可以解决问题。但我无法让它工作。我需要它来根据“NoBorder.png”是否是“i19”的 src 图像来更改正文的颜色。我需要一个解决方案的解释,因为我对 JS 很陌生。`

<body onload="choseBG();" id="banner">    

<script>
       var logoImg = document.getElementById("i19").src;
        function choseBG(){    

            if(logoImg = 'assets/NoBorder.png'){
                document.getElementById('banner').style.backgroundColor = '#CCCCCC'
            }else{
                document.getElementById('banner').style.backgroundColor = '#f20403'
            }}
    </script>`

标签: javascripthtmlif-statementdynamicbanner

解决方案


请检查下面的代码

var bgImg = 'assets/NoBorder.png';
function choseBG(){    
	console.log(bgImg);
	if(bgImg === 'assets/NoBorder.png'){
		document.getElementById('banner').style.backgroundColor = '#cccccc'
	}else{
		document.getElementById('banner').style.backgroundColor = '#f20403'
	}
}
<body onload="choseBG();" id="banner">

</body>


推荐阅读