[09-03]function函數

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <meta http-equiv="X-UA-Compatible" content="ie=edge">
  <title>Document</title>
  <link rel="stylesheet" href="17.css"/>
</head>
<body>
<!-- 事件定義:
    - 在事件定義時直接寫js
  嵌入式:
    - 使用<script>標籤>
  文件調用式:
    - 代碼位於單獨的.js文件中;
  - html頁面引用.js文件;
-->

 

<!--1.事件定義式:在定義事件時直接寫js;
  事件指的是用戶在作出操做時調用時調用js,就是js調用時機,如單機、雙擊等;
  onclick="" 單擊   ondblclick="" 雙擊
-->
  <input type="button" value="按鈕1" onclick="alert('李三')"/>

 

<!--2.嵌入式:在script標籤裏謝js,該標籤能夠放在網頁任意位置,但一般放在head裏較多;-->
  <script>
    //function是關鍵字,用來聲明函數;
    /*f2是函數名,小括號內能夠聲明參數;*/
    //大括號內是函數體;
    //js中函數都是公有的,不須要修飾符;
    //js中的函數不須要聲明返回值類型;
    function f2(){
      //不區分單引號,雙引號;
      alert("傳奇");
    }
   </script>
  <input type="button" value="按鈕2" onclick="f2()"/>

 

<!--3.文件調用式:在單獨的js文件內容寫js,須要引入到網頁上才能使用;
    - 該標籤必須寫成雙標籤,哪怕沒有內容;
    - 該標籤不能既引入js又寫js.
-->
  <script src="17.js"></script>
  <input type="button" value="按鈕3" onclick="f3()"/>
</body>
</html>

 ----------css

<!DOCTYPE html>
<html lang="zh">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>函數</title>
</head>
<body>
<script>
//變量儘可能不要用中文,但支持中文;

 

//函數的申明 , 削蘋果的流水線
// function 削蘋果(){
// document.write("洗蘋果"+"<br>");
// for(var i =0;i<10;i++){
// document.write("去皮"+(i+1)+"<br>");
// }
// document.write("切小塊"+"<br>");
// document.write("插上牙籤"+"<br>");
// }

 

// //函數執行,使用流水線
// 削蘋果();//削1次蘋果
// 削蘋果();//削2次蘋果

 

//函數的參數
//形式參數 形參會接受實參的值
// function shuiguo(shuiguoming){
// document.write("洗"+shuiguoming+"<br>");
// for(var i =0;i<10;i++){
// document.write("去皮"+(i+1)+"<br>");
// }
// document.write("切小塊"+"<br>");
// document.write("插上牙籤"+"<br>");
// }
// //實際的參數
// shuiguo("li");
// shuiguo("xiangjiao");



// function shuiguo(shuiguoming="火腿",cishu=1,zhi="小塊"){
// //undefined 屬性用於存放 JavaScript 中未定義的值
// if(shuiguoming === undefined){
// shuiguoming = "蘋果";
// shuiguoming = "梨";
// shuiguoming = "香蕉";
// shuiguoming = "橙子";
// shuiguoming = "西瓜";
// shuiguoming = "哈密瓜";
// shuiguoming = "菠蘿";
// }

 

// // shuiguoming = shuiguoming || "火腿"; // || 或者的意思;
// // cishu = cishu || 1;
// // zhi = zhi || "小塊";

 

// document.write("洗"+shuiguoming+"<br>");
// for(var i =0;i<cishu;i++){
// document.write("去皮"+(i+1)+"<br>");
// }
// document.write("切"+zhi+"<br>");
// document.write("插上牙籤"+"<br>");
// }
// shuiguo("西瓜",5,"小塊");
// shuiguo("蘋果",8,"大塊");
// shuiguo("火龍果");



 
function shuiguo(shuiguoming="火腿",cishu=1,zhi="小塊"){
var str = shuiguoming;
 
document.write("洗"+shuiguoming+"<br>");

 

for(var i =0;i<cishu;i++){
document.write("去皮"+(i+1)+"<br>");
//break; //跳出代碼運行的代碼塊;
}

 

document.write("切"+zhi+"<br>");
document.write("插上牙籤"+"<br>");

 

 
strl = "一碟"+zhi+"的"+str;

 

//tt運行沒有結果,須要在這裏是有return,返回結果;
return strl;//return 返回,函數返回值,表明函數運行結束;
}

 

// var tt = 0;
//函數運行完,要有結果;
var tt = shuiguo("蘋果",2);
document.write("<br>"+"tt拿到了:"+tt+"<br>");

 

</script>
 
</body>
</html>
相關文章
相關標籤/搜索