可以賺錢做任務(wù)的網(wǎng)站有哪些東莞做網(wǎng)站的聯(lián)系電話
JavaScript
什么是JavsScript
JavaScript是一種輕量級(jí)、解釋型、面向?qū)ο蟮哪_本語(yǔ)言。它主要被設(shè)計(jì)用于在網(wǎng)頁(yè)上實(shí)現(xiàn)動(dòng)態(tài)效果，增加用戶與網(wǎng)頁(yè)的交互性。
作為一種客戶端語(yǔ)言，JavaScript可以直接嵌入HTML，并在瀏覽器中執(zhí)行。
與HTML和CSS不同，JavaScript使得網(wǎng)頁(yè)不再是靜態(tài)的，而是可以根據(jù)用戶的操作動(dòng)態(tài)變化的。
JavaScript的作用
JavaScript在前端開發(fā)中扮演著重要角色，其應(yīng)用領(lǐng)域包括但不限于以下三種：
'客戶端腳本'：用于在用戶瀏覽器中執(zhí)行，實(shí)現(xiàn)動(dòng)態(tài)效果和用戶交互。
'網(wǎng)頁(yè)開發(fā)'：與HTML和CSS協(xié)同工作，使得網(wǎng)頁(yè)具有更強(qiáng)的交互性和動(dòng)態(tài)性。
'后端開發(fā)'：使用Node、JavaScript也可以在服務(wù)器端運(yùn)行，實(shí)現(xiàn)服務(wù)器端應(yīng)用的開發(fā)。
JS導(dǎo)入方式：
第一種是內(nèi)聯(lián)式，在html文件中直接嵌入JS代碼，JS代碼放在script標(biāo)簽內(nèi)，script標(biāo)簽可以在head，也可以在body標(biāo)簽內(nèi)
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>JS導(dǎo)入方式</title><script>console.log('Hello, Head 標(biāo)簽的內(nèi)聯(lián)樣式')</script><!-- 外部引入,導(dǎo)入外聯(lián)樣式 --><script src="./js/myscript.js"></script>
</head><body><h1>JavaScript 的導(dǎo)入方式</h1> <script>// console.log表示在控制臺(tái)打印一些日志內(nèi)容console.log('Hellp, body標(biāo)簽的內(nèi)聯(lián)樣式')alert("你好，內(nèi)聯(lián)樣式彈窗");</script>
</body>JS基本語(yǔ)法
<script>// 變量，var生成的變量是具有函數(shù)作用域var x;// 變量，let生成的變量具有塊級(jí)作用域，let更安全更靈活，它避免了var可以引發(fā)的一些問(wèn)題，特別是關(guān)于變量提升和塊級(jí)作用域的方面let y = 5;// 常量const pI=3.14// 打印出x,y,pI，打印結(jié)構(gòu) undefined、5、3.14。undefined的意識(shí)就是一個(gè)空值，未定義的狀態(tài)，它是JS中的一種數(shù)據(jù)類型表示變量聲明但沒有初始化。console.log(x , y , pI);// 創(chuàng)建一個(gè)字符串let name='小劉';console.log(name);// 創(chuàng)建一個(gè)空值// null與undefined的區(qū)別，雖然他們兩個(gè)都是表示缺失值的特殊值，但是他們?cè)诤x上還是有區(qū)別的，// undefined表示一個(gè)變量已被聲明但尚未被賦值或者一個(gè)對(duì)象屬性不存在,當(dāng)函數(shù)沒有返回值的時(shí)候,默認(rèn)返回的也是undefined// null表示一個(gè)變量被明確賦值為空或者不存在,它是一個(gè)被賦予的值,表示一個(gè)空對(duì)象引用或者沒有對(duì)象值// undefined表示變量可能在將來(lái)被賦值,或者表示某個(gè)值還沒有被計(jì)算出來(lái).而null,明確表示沒有對(duì)象值// 在實(shí)際開發(fā)中根據(jù)語(yǔ)境選擇哪個(gè)值let empty_value = null;console.log(empty_value);</script>JS控制語(yǔ)句
JS控制語(yǔ)句：包括條件語(yǔ)句和循環(huán)語(yǔ)句
條件語(yǔ)句
條件語(yǔ)句都會(huì)使用，if、else if、和else三個(gè)關(guān)鍵字。
'if'語(yǔ)句：用于執(zhí)行一個(gè)代碼塊，當(dāng)指定的條件為真(true)時(shí)執(zhí)行。語(yǔ)法如下：
if(condition){//如果條件為真，執(zhí)行這里的代碼
}'else'語(yǔ)句：用于在上一個(gè)If和所有的else if都為假時(shí)執(zhí)行的代碼塊。語(yǔ)法如下：
if (condition){//如果條為真，執(zhí)行這里的代碼
}else{//如果條件為假，執(zhí)行這里的代碼
}'else if'語(yǔ)句：用于在上一個(gè)if語(yǔ)句條件為假時(shí)，檢查另一個(gè)條件?？梢杂卸鄠€(gè)else if語(yǔ)句。語(yǔ)法如下：
if (condition1){//如果條件1為真，執(zhí)行這里的代碼
}else if (condition2){//如果條件2為真，執(zhí)行這里的代碼
}else{//如果以上條件都為假，執(zhí)行這里的代碼
}代碼示例：
let age = 18;//大于等于十八則輸出你已經(jīng)成年了,否則輸出未成年if (age >= 18) {console.log('你已經(jīng)成年了');}else{console.log('未成年');}let time = 22;if (time < 12) {alert('上午好');} else if (time <18) {alert('下午好');} else {alert('晚上好');}循環(huán)語(yǔ)句
循環(huán)語(yǔ)句用于重復(fù)執(zhí)行一段代碼，直到指定的條件不再滿足為止。
for
'for'循環(huán)：是一種常見的循環(huán)語(yǔ)句，用于按照指定的條件重復(fù)執(zhí)行代碼塊。語(yǔ)法如下：
for(初始化表達(dá)式；循環(huán)條件；迭代器){//循環(huán)體，執(zhí)行這里的代碼
}代碼示例：
console.log('for 循環(huán)');// i=0初始化我們這個(gè)循環(huán)變量為i,并且初始值為0;循環(huán)條件,當(dāng)i<10時(shí),我們就執(zhí)行這個(gè)for循環(huán),每執(zhí)行完一次 就執(zhí)行一次i++// i++就是i=i+1的簡(jiǎn)寫,也可以為i+=1for (let i = 1; i<11;i++){console.log(i);}while
'while'循環(huán)會(huì)在指定的條件為真的執(zhí)行代碼塊。語(yǔ)法如下：
whileO(循環(huán)條件){//循環(huán)體，執(zhí)行這里的代碼
}代碼示例：
// while死循環(huán)console.log('while 循環(huán)');let count = 1;while (count <= 10){console.log(count);// 迭代條件count++}break與continue
循環(huán)關(guān)鍵字
'break'用于跳出循環(huán)，結(jié)束循環(huán)進(jìn)行。
'continue'用于跳過(guò)當(dāng)前循環(huán)中的剩余代碼，繼續(xù)下一次循環(huán)。
代碼示例：
console.log('循環(huán)關(guān)鍵字');for (var i = 0;i<5;i++){// i=2跳過(guò)這個(gè)代碼if ( i == 2){continue;}// i=4終止這段代碼if (i == 4){break;}console.log(i);}函數(shù)
'函數(shù)'是一段可重復(fù)使用的代碼塊，它可接受輸入(參數(shù))、執(zhí)行特定任務(wù)，并返回輸出。
function function_name(參數(shù)1，參數(shù)2，參數(shù)3，...){//參數(shù)可以不寫，表示不傳參//函數(shù)體，執(zhí)行這里的代碼return 返回值;//可選，返回值
}代碼示例如下：
<SCript>function hello(){console.log('hello world!');}
//調(diào)用這個(gè)函數(shù)hello()function hello_with_return(){return 'hello world! - 返回值'}// 用a這個(gè)變量接收這個(gè)返回值let a = hello_with_return();// 添加返回值console.log(a);console.log(hello_with_return());//傳參 function hello_with_params(name){console.log('hello,' + name);}// 調(diào)用 hello_with_paramshello_with_params('如花');hello_with_params('Alice');// 作用域let global_var = '全局變量';function local_var_function(){// 局部作用域let local_var = '局部變量';console.log('函數(shù)內(nèi)打印全局變量：' + global_var);console.log('函數(shù)內(nèi)打印局部變量：' + local_var);}// 調(diào)用local_var_function();console.log('全局打印全局變量：' + global_var);// 因?yàn)閘ocal_var在局部作用域里面，在外部訪問(wèn)不到console.log('全局打印局部變量：' + local_var);</SCript>事件
事件是文檔或者瀏覽器窗口中發(fā)生的特定瞬間，例如用戶的點(diǎn)擊、鍵盤的按下、頁(yè)面的加載等。常見的時(shí)間如下：
| 事件 | 描述 |
| onClick | 點(diǎn)擊事件 |
| onMouseOver | 鼠標(biāo)經(jīng)過(guò) |
| onMouseOut | 鼠標(biāo)移出 |
| onChange | 文本內(nèi)容改變事件 |
| onSelect | 文本框選中 |
| onFocus | 光標(biāo)聚集 |
| onBlur | 移開光標(biāo) |
事件的綁定
JS綁定事件的方法有三種：
1、'HTNL'屬性
2、'DOM'屬性
3、'addEventListener'方法
代碼示例：
<body><button onclick="click_event()">這是一個(gè)點(diǎn)擊事件按鈕</button><input type="text" onfocus="focus_event()" onblur="blur_event()"><script>// 點(diǎn)擊事件function click_event() {alert('點(diǎn)擊事件觸發(fā)了');}// 聚焦事件function focus_event(){console.log('獲取焦點(diǎn)');}// 失去焦點(diǎn)function blur_event(){console.log('失去焦點(diǎn)');}</script>
</body>注：剛開始接觸前端，希望有大佬提出建議，本人虛心學(xué)習(xí)。