日韩性视频-久久久蜜桃-www中文字幕-在线中文字幕av-亚洲欧美一区二区三区四区-撸久久-香蕉视频一区-久久无码精品丰满人妻-国产高潮av-激情福利社-日韩av网址大全-国产精品久久999-日本五十路在线-性欧美在线-久久99精品波多结衣一区-男女午夜免费视频-黑人极品ⅴideos精品欧美棵-人人妻人人澡人人爽精品欧美一区-日韩一区在线看-欧美a级在线免费观看

歡迎訪問 生活随笔！

生活随笔

當前位置： 首頁 > 编程语言 > python >内容正文

python

python web开发 JavaScript基础

發布時間：2024/7/5 python 24 豆豆
生活随笔 收集整理的這篇文章主要介紹了 python web开发 JavaScript基础 小編覺得挺不錯的,現在分享給大家,幫大家做個參考.

文章目錄

    • 1. script 標簽
    • 2. 字面量、變量
    • 3. 數據類型
    • 4. 運算符
    • 5. if 條件
    • 6. switch分支
    • 7. for循環
    • 8. while循環
    • 9. break， continue
    • 10. 函數
    • 11. JS事件
    • 12. 引入JS的兩種方式
      • 12.1 HTML頁面嵌入
      • 12.2 引入外部JS文件

learning from 《python web開發從入門到精通》

  • JavaScript 跨平臺、面向對象的 腳本語言，能使網頁產生交互行為，服務端版本有 Node.js
  • 前端技術主要指：HTML（定義內容）, CSS（描述樣式）, JavaScript（描述行為）

1. script 標簽

  • <script> 腳本 </script>，腳本數量不限，可位于 body 部分 或 head 部分，或同時存在

2. 字面量、變量

  • 字面量：
    數字3.14， 1001， 12e5
    字符串"michael"，'michael'（兩種引號都可）
    數組 Array[1,2,3,4,5]
    對象 {name:"michael", age:18, hobby:"coding"}
    函數 function myFunc(a, b) {return a+b;}

  • 變量，var 定義變量，= 賦值（必須以字母，$，_開始，大小寫敏感）

3. 數據類型

  • 值類型，引用數據類型
  • 值類型（基本類型）：字符串，數字，布爾，空null，未定義undefined，唯一標識符symbol
  • 引用數據類型：數組，對象，函數
字符串 var name="michael"; var sentence="my name is 'michael', nice to meet you!";數值 var x = 3.14; var y = 12e-6;布爾 var x = True; var y = False;空 x=null; 清空變量的值數組 var hobby = new Array(); hobby[0] = "basketball"; hobby[1] = "singing"; hobby[2] = "playing games";var hobby=new Array("a", "b", "c");var hobby=["a", "b", "c"];對象 var person = {name:"michael", age:18}; 空格換行沒有影響 對象尋址: 兩種方式 name = person.name age = person["age"]

聲明變量類型

var name = new String; var x = new Number; var y = new Boolean; var cars = new Array; var person = new Object;

4. 運算符

  • 算術運算符，賦值運算符（跟c++一致）
  • 比較運算符多了===（值和類型均一樣）!== （值，類型 至少有一個不一樣）

5. if 條件

同c++，if和if ... else和if ... else if ... else

<!DOCTYPE html> <html lang="en"> <head><meta charset="UTF-8"><title>條件分支</title> </head> <body><script>var score = 78;if (score >= 90) {document.write("優秀");}else if (score >= 80) {document.write("良好");}else if (score >= 60) {document.write("及格");}else {document.write("不及格");} </script></body> </html>

6. switch分支

同c++

<script>var d = new Date().getDay();switch (d) {case 0:document.write("星期天");break;case 1:document.write("星期一");break;case 2:document.write("星期二");break;case 3:document.write("星期三");break;case 4:document.write("星期四");break;case 5:document.write("星期五");break;default:document.write("星期六");} </script>

7. for循環

  • c++類似的形式
<script>var name = ["張三", "李四", "王五"];for(var i = 0; i < name.length; i++) {document.write(name[i] + "*");} </script>

<script>for(var x = 5; x < 10; ++x) {var str = "";str += "數字是："+ x + "<br>"; // <br> 換行document.write(str);} </script>

  • for in 形式
<script>var students = {name:"michael", age:18, score:{chinese:80, math:90, english:70}};var txt = '';for(x in students) {if(x == 'score'){for(y in students.score){txt = y + ': ' + students.score[y] + '<br>';document.write(txt);}}else{txt = x + ': ' + students[x] + '<br>';document.write(txt);}} </script>

8. while循環

同c++

  • while(condition){ }
  • do{ } while(condition);

9. break， continue

同c++

  • break 跳出當前循環
  • continue跳過當次循環迭代，進行下一次迭代

10. 函數

  • function funcName() { // 執行代碼 }
<script>function myButton(){alert("hello Michael!")} </script><button onclick='myButton()'>點擊我</button> <!--引號不加也可以-->

  • 帶參數的函數
<script>function myButton1(name, course){alert("hello " + name + ", you are learning " + course + "!");} </script><button οnclick=myButton1('Michael','web開發')>點擊我</button>

  • 帶返回值的函數 return
<div id="myfunction1"></div> <script>function myFunc1(x, y){return x * y;}document.getElementById("myfunction1").innerHTML = myFunc1(3, 6); </script>

11. JS事件

  • 如：瀏覽行為，用戶行為
  • 常見事件：HTML加載完成，input 字段發生變化，按鈕被單擊
<!DOCTYPE html> <html lang="en"> <head><meta charset="UTF-8"><title>按鈕事件</title> </head> <body><p>單擊按鈕獲取當前時間: 執行 <em>displayDate()</em> 函數。</p> <button onclick="displayDate()">獲取時間</button> <script>function displayDate() {var d = new Date(); // 實例化日期var now = d.toLocaleString(); // 轉換為本地時間格式document.getElementById("here").innerHTML = now;//寫入 id 為 here的元素中} </script> <p id="here"></p></body> </html>

12. 引入JS的兩種方式

12.1 HTML頁面嵌入

如上所示 <script> function... </script> 嵌入

12.2 引入外部JS文件

  • <script src= url > </script> 指向外部 url .js 文件

myscript.js

function display123(){alert("hello Michael!"); } <!DOCTYPE html> <html lang="en"> <head><meta charset="UTF-8"><title>外部引用JS文件</title><script src="myscript.js"></script></head> <body><button onclick="display123()">點擊我！</button></body> </html>

總結

以上是生活随笔為你收集整理的python web开发 JavaScript基础的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。