每次都得var定義一次，有沒有什么方法寫在一個function里面？
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>DOM</title>
</head>
<style type="text/css">
*{ font-size:12px;}
#txt{
? ? height:400px;
width:600px;
border:#333 solid 1px;
padding:5px;
}
p{
line-height:18px;
text-indent:2em;}
</style>
<body>
<h2 id="ap">javascript課程</h2>
<div id="txt">
<h5>JavaScript為網(wǎng)頁添加動態(tài)效果并實現(xiàn)與用戶交互的功能。</h5>
<p>
1. JavaScript入門篇，讓不懂JS的你，快速了解JS。
</p>
<p>
2. JavaScript進階篇，讓你掌握JS的基礎(chǔ)語法、函數(shù)、數(shù)組、事件、內(nèi)置對象、BOM瀏覽器、DOM操作。
</p>
<p>
3. 學完以上兩門基礎(chǔ)課后，在深入學習JavaScript的變量作用域、事件、對象、運動、cookie、正則表達式、ajax等課程。
</p>
</div>
<form>
<input type="button" value="改變顏色" onclick="mycolor1()">
<input type="button" value="改變寬高" onclick="mycolor2()">
<input type="button" value="隱藏內(nèi)容" onclick="mycolor3()">
<input type="button" value="顯示內(nèi)容" onclick="mycolor4()">
<input type="button" value="取消設(shè)置" onclick="mycolor5()">
</form>
</body>
<script type="text/javascript">
//編程練習
function mycolor1(){
var dd=document.getElementById("txt");
dd.style.color="red";
dd.style.backgroundColor="#CCCCCC";
}
function mycolor2(){
var dd=document.getElementById("txt");
dd.style.width="400px";
dd.style.height="200px";
}
function mycolor3(){
var dd=document.getElementById("txt");
dd.style.display="none";
}
function mycolor5(){
if (confirm("確定取消設(shè)置嗎？")) {
var dd=document.getElementById("txt");
dd.style.color="red";
dd.style.backgroundColor="#CCCCCC";
dd.style.width="400px";
dd.style.height="200px";
dd.style.display="block";
}
}
function mycolor4(){
var dd=document.getElementById('txt');
dd.style.display='block';
}
</script>
</html>
2019-05-15
? ? function color(){
? ? ? ? document.getElementById("txt").style.color="red";
? ? }
? ? function widhei(){
? ? ? ? document.getElementById("txt").style.width="400px";
? ? ? ? document.getElementById("txt").style.height="200px";
? ? }
? ? function hiadtext(){
? ? ? ? document.getElementById("txt").style.display="none";
? ? }
? ? function showtext(){
? ? ? ? document.getElementById("txt").style.display="block";
? ? }
? ? function del(){
? ? ? ? var i ="";
? ? ? ? ? ? var i=confirm("只怪那么洶涌");
? ? ? ? ? ? if(i==true){
? ? ? ? ? ? document.getElementById("txt").style.color="#000";
? ? ? ? ? ? document.getElementById("txt").style.width="600px";
? ? ? ? ? ? document.getElementById("txt").style.height="400px";
? ? ? ? ? ? document.getElementById("txt").style.display="block";
? ? ? ? ? ? }else{
? ? ? ? ? ? ? ? return false;
? ? ? ? ? ? }
? ? }
2019-05-11
<form> ??<!--當點擊相應按鈕，執(zhí)行相應操作，為按鈕添加相應事件--> ????<input?type="button"?value="改變顏色"?onclick="chancolor(p)">?? ????<input?type="button"?value="改變寬高"?onclick="chanwh(p)"> ????<input?type="button"?value="隱藏內(nèi)容"?onclick="nodis(p)"> ????<input?type="button"?value="顯示內(nèi)容"?onclick="dis(p)"> ??</form> ??<script?type="text/javascript"> //定義"改變顏色"的函數(shù) var?p?=?document.getElementById("txt"); function?chancolor(p){ ????p.style.color?=?"blue"; ????p.backgroundcolor="#ccc" } //定義"改變寬高"的函數(shù) function?chanwh(p){ ????p.style.width="200px"; ????p.style.height="200px" } //定義"隱藏內(nèi)容"的函數(shù) function?nodis(){ ????p.style.display?=?"none"; } //定義"顯示內(nèi)容"的函數(shù) function?dis(){ ????p.style.display?=?"block"; }