首页 > 代码库 > JavaScript点击div来回切换两个颜色及两张图片切换的方法
JavaScript点击div来回切换两个颜色及两张图片切换的方法
点击div切换颜色的代码如下:
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Document</title><style> .test1{ width:100px; height: 100px; background-color: green; }</style><script type="text/javascript"> function myFunction(){ var test1 = document.getElementById(‘test1‘); if(test1.style.backgroundColor==‘yellow‘){ test1.style.backgroundColor=‘green‘; }else{ test1.style.backgroundColor=‘yellow‘; } }</script></head><body> <div class="test1" id="test1" alt="" onclick="myFunction()"> </div></body></html>
这里有一个疑问就是:如果js语句中颜色代码为十六进制则不显示效果。目前还没有解决这个问题 求大神指教QAQ
点击图片来回切换:
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title></title></head><body><script type="text/javascript"> function toggle(){ var test1 = document.getElementById(‘test1‘); if(test1.src.indexOf(‘on‘) >= 0){ test1.src="./images/off.png"; }else{ test1.src="./images/on.png"; } }</script> <img id="test1" src="./images/on.png" alt="" onclick="toggle()" /></body></html>
JavaScript点击div来回切换两个颜色及两张图片切换的方法
声明:以上内容来自用户投稿及互联网公开渠道收集整理发布,本网站不拥有所有权,未作人工编辑处理,也不承担相关法律责任,若内容有误或涉及侵权可进行投诉: 投诉/举报 工作人员会在5个工作日内联系你,一经查实,本站将立刻删除涉嫌侵权内容。