<!DOCTYPE?HTML>
<html>
<head>
<meta?http-equiv="Content-Type"?Content="text/html;?charset=utf-8"?/>
<title>javascript</title>
<style?type="text/css">
body{font-size:12px;}
#txt{
????height:400px;
????width:600px;
????border:#333?solid?1px;
????padding:5px;}
p{
????line-height:18px;
????text-indent:2em;}
</style>
</head>
<body>
??<h2?id="con">JavaScript課程</H2>
??<div?id="txt">?
?????<h5>JavaScript為網頁添加動態效果并實現與用戶交互的功能。</h5>
????????<p>1.?JavaScript入門篇，讓不懂JS的你，快速了解JS。</p>
????????<p>2.?JavaScript進階篇，讓你掌握JS的基礎語法、函數、數組、事件、內置對象、BOM瀏覽器、DOM操作。</p>
????????<p>3.?學完以上兩門基礎課后，在深入學習JavaScript的變量作用域、事件、對象、運動、cookie、正則表達式、ajax等課程。</p>
??</div>
??<form>
??<!--當點擊相應按鈕，執行相應操作，為按鈕添加相應事件-->
????<input?type="button"?value="改變顏色"?onClick="changeColor()">??
????<input?type="button"?value="改變寬高"?onClick="changeWH()">
????<input?type="button"?value="隱藏內容"?onClick="hide()">
????<input?type="button"?value="顯示內容"?onClick="view()">
????<input?type="button"?value="取消設置"?onClick="reset()">
??</form>
??<script?type="text/javascript">
??var?mycon=document.getElementById("con");
??var?mytxt=document.getElementById("txt");
//定義"改變顏色"的函數
function?changeColor()
{mytxt.style.backgroundColor="black";
mytxt.style.color="white";}
//定義"改變寬高"的函數
function?changeWH()
{mytxt.style.width="300px";
mytxt.style.height="300px";}
//定義"隱藏內容"的函數
function?hide()
{mycon.style.display="none";}
//定義"顯示內容"的函數
function?view()
{mycon.style.display="block";}
//定義"取消設置"的函數
function?reset()
{var?cancel=confirm("確定取消所有設置嗎？");
if(cancel==true)
{mycon.removeAttribute("style");
mytxt.removeAttribute("style");
}
else{}
}
??</script>
</body>
</html>
2016-04-06
由你定義隱藏方法的函數來看：
function?hide() { ?????mycon.style.display="none"; }mycon獲取的是id為的"con"的對象（見代碼36行），所以隱藏對象只作用于<h2>標簽的內容（見代碼19行）。
無論你換不換函數hide()的名字，作用對象都不變。
而定義取消設置的函數函數名reset()是js已經有定義的命名，你不能自己再用相同的名字命名，把reset()名字改掉即可。這里有鏈接，
2022-03-26
document.getElementsByTagName,少document?你好,使用雙引號,在html標簽中這個比較常見,便于對代碼閱讀,修改之類的,?另外也不容易導致輸入時出錯...謝謝采納
2016-04-06
你的意思是mucon的樣式回不去是吧，因為mycon本來就沒有樣式。我覺得是這樣的。你可以試試。