常用交互

//单组选项卡
		<div class="button">
			<button type="button" class="focus">第一组</button>
			<button type="button" class="">第二组</button>
			<button type="button" class="">第三组</button>
		</div>
		<div class="box">
			<div class="list"><img src="img/0.jpg"></div>
			<div class="list"><img src="img/1.jpg"></div>
			<div class="list"><img src="img/2.jpg"></div>
		</div>


		<script type="text/javascript">
			var btn = document.getElementsByTagName('button'),
				div = document.getElementsByClassName('list');
			var len = btn.length;
			for (var i = 0; i < len; i++) {
				(function(n) {
					console.log(btn[i]);
					btn[n].onclick = function() {
						for (var j = 0; j < len; j++) {
							btn[j].className = "";
							div[j].style.display = "none";
						}
						this.className = "focus";
						div[n].style.display = "block";
					}

				}(i))
			}
		</script>