話不多說，直接擼代碼吧：
<!DOCTYPE html>
<html lang="en" xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta charset="utf-8" />
<title></title>
<style>
.div {
display:none;
border:3px solid red;
}
</style>
</head>
<body>
<!-- 實現點擊按鈕顯示一個div,頁面上其他的內容全部隱藏。再點擊返回按鈕，div隱藏，頁面上所有的內容再顯示出來。-->
<article>
<!---article是HTML5的一個元素標籤-->
<hr />
<div class="div">
這裏就是div的內容
</div>
<div name="a" id="a1" style="display:none">山東省地方1</div>
<div name="a" id="a2" style="display:none">山東省地方2</div>
<div name="a" id="a3" style="display:none">山東省地方3</div>
<input type="button" id="but1" />
<input type="button" id="but2" />
<input type="button" id="but3" />
<hr />
</article>
</body>
</html>
<script src="https://cdn.bootcss.com/jquery/2.1.1/jquery.min.js"></script>
<script>
$(document).ready(function(e) {
$("#but1").click(function(e) {
$("[name='a']").hide();
$("#a1").show();
});
$("#but2").click(function(e) {
$("[name='a']").hide();
$("#a2").show();
});
$("#but3").click(function(e) {
$("[name='a']").hide();
$("#a3").show();
});
});
</script>