2、函數傳參
阿新 • • 發佈：2018-04-10
get bottom 通過 pre put 背景 變量 sorry title
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>2、函數傳參</title> <link href="base.css"> <style> li{ padding-bottom: 50px; } .l{ border: 1px solid #ccc; width:1200px; height:60px; } .lll{ background-color: red; width:800px; height:120px; } </style> </head> <body> <ol> <!--1、函數傳參，一個參數 --> <div id="bianse"> <li>函數傳參，一個參數 <inputtype="button" value="背景變黃" onclick="change(‘yellow‘)"> <input type="button" value="背景變紅" onclick="change(‘red‘)"> <input type="button" value="背景變黑" onclick="change(‘black‘)"> <input type="button" value="恢復原樣" onclick="change(‘white‘)"> <p>定義函數的參數為color，變量adiv的樣式調用參數color，onclick事件把背景顏色的值傳給參數color。</p> </li> </div> <!--2、函數傳參，兩個參數--> <div id="bianhua" style="margin-bottom: 50px;height: 100px;width: 1200px;border: 1px solid #ccc"> <li>函數傳參，兩個參數 <input type="button" value="背景變窄" onclick="change1(‘width‘,‘600px‘)"> <input type="button" value="背景變黃" onclick="change1(‘backgroundColor‘,‘yellow‘)"> <input type="button" value="背景變高" onclick="change1(‘height‘,‘200px‘)"> <input type="button" value="恢復原樣" onclick="alert(‘sorry,我還沒學‘)"> <p>定義函數的參數為name和value，變量bdiv的樣式的屬性名用參數name代替，屬性值用參數value代替，onclick事件把樣式的屬性名和值分別傳給參數name和value。</p> </li> </div> <!--3、函數傳參，參數加變量--> <div> <li>函數傳參，參數加變量 <input type="text" value="你拍一 我拍一" id="bwenzi"> <input type="button" value="改變文字" onclick="change11(‘兩個小孩兒坐灰機‘)"> <input type="button" value="添加title屬性"> <p>定義函數的參數為name，定義變量a為參數name，兩個onclick事件分別綁定標簽屬性調用參數的值。(暫時不知道為什麽要把參數定義成變量，但是這樣也行的通。)</p> </li> </div> <!--4、修改樣式，通過調取className--> <div id="ll" class="l"> <li>修改樣式，通過調取className <input type="button" value="變紅 變高 變窄" onclick="bian()"> <input type="button" value="恢復原樣" onclick="alert(‘sorry,我還沒學‘)"> </li> </div> </ol> <script> /*1、函數傳參，一個參數*/ function change(color) { var adiv=document.getElementById("bianse"); adiv.style.backgroundColor=color; } /*1、函數傳參，一個參數end*/ /*2、函數傳參，兩個參數*/ function change1(name,value) { var bdiv=document.getElementById("bianhua"); console.log(bdiv.style); bdiv.style[name]=value; } /*2、函數傳參，兩個參數end*/ /*3、函數傳參，參數加變量*/ function change11(name) { var a=document.getElementById("bwenzi"); a.value=name; } /*3、函數傳參，參數加變量end*/ /*4、修改樣式，通過調取className*/ function bian() { var a=document.getElementById("ll").className="lll"; } /*4、修改樣式，通過調取className end*/ </script> </body> </html>
2、函數傳參