<!DOCTYPE html>
<html lang="en">
<style >
div {
width: 300px;
height: 300px;
}
#test1 {
background: green;
}
#test2 {
background: red;
}
</style>
<script >
function ch() {
var div = document.getElementById('test1');
div.id = 'test2';
}
</script>
<head>
<meta charset="utf-8">
</head>
<body>
<h1>特效是什么?</h1>
<div id="test1" onclick="ch()"></div>
</body>
</html>
点击图片前:
点击图片达到变色效果: