當前位置：首頁 > 前端技术 > javascript >内容正文

javascript

01）自学JavaScript

發布時間：2023/12/3 javascript 32 豆豆

生活随笔收集整理的這篇文章主要介紹了 01）自学JavaScript 小編覺得挺不錯的,現在分享給大家,幫大家做個參考.

1. JavaScript?簡介

1.1 JavaScript 是腳本語言

JavaScript 是一種輕量級的編程語言。

JavaScript 是可插入 HTML 頁面的編程代碼。

JavaScript 插入 HTML 頁面后，可由所有的現代瀏覽器執行。

2. JavaScript?用法

HTML 中的腳本必須位于 <script> 與 </script> 標簽之間。

腳本可被放置在 HTML 頁面的 <body> 和 <head> 部分中

2.1 <script> 標簽

如需在 HTML 頁面中插入 JavaScript，請使用 <script> 標簽。

?2.2 <body> 中的 JavaScript

<!DOCTYPE html> <html> <body> . . <script> document.write("<h1>這是一個標題</h1>"); document.write("<p>這是一個段落</p>"); </script> . . </body> </html>

2.3 在 <head> 或者 <body> 的JavaScript

您可以在 HTML 文檔中放入不限數量的腳本。

腳本可位于 HTML 的 <body> 或 <head> 部分中，或者同時存在于兩個部分中。

通常的做法是把函數放入 <head> 部分中，或者放在頁面底部。這樣就可以把它們安置到同一處位置，不會干擾頁面的內容。

?2.4<head> 中的 JavaScript 函數

<!DOCTYPE html> <html> <head> <script> function myFunction() {document.getElementById("demo").innerHTML="我的第一個 JavaScript 函數"; } </script> </head> <body> <h1>我的 Web 頁面</h1> <p id="demo">一個段落</p> <button type="button" onclick="myFunction()">嘗試一下</button> </body> </html>

3. JavaScript?輸出

JavaScript 沒有任何打印或者輸出的函數。

3.1 JavaScript 顯示數據

JavaScript 可以通過不同的方式來輸出數據：

3.1.1 使用?window.alert()?彈出警告框

<!DOCTYPE html> <html> <body><h1>我的第一個頁面</h1> <p>我的第一個段落。</p><script> window.alert(5 + 6); </script></body> </html>

3.1.2使用?document.write()?方法將內容寫到 HTML 文檔中

<!DOCTYPE html> <html> <body><h1>我的第一個 Web 頁面</h1><p>我的第一個段落。</p><script> document.write(Date()); </script></body> </html>

3.1.3 使用?innerHTML?寫入到 HTML 元素

<!DOCTYPE html> <html> <body><h1>我的第一個 Web 頁面</h1><p id="demo">我的第一個段落</p><script> document.getElementById("demo").innerHTML = "段落已修改。"; </script></body> </html>

3.1.4 使用?console.log()?寫入到瀏覽器的控制臺

<!DOCTYPE html> <html> <body><h1>我的第一個 Web 頁面</h1><script> a = 5; b = 6; c = a + b; console.log(c); </script></body> </html>

4. JavaScript?語法

JavaScript 是一個程序語言。語法規則定義了語言結構。

4.1 JavaScript 語法

JavaScript 是一個腳本語言。

它是一個輕量級，但功能強大的編程語言。

4.2 JavaScript 字面量

在編程語言中，一般固定值稱為字面量，如 3.14。

4.2.1 數字（Number）字面量?

可以是整數或者是小數，或者是科學計數(e)。

<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>菜鳥教程(runoob.com)</title> </head> <body><p id="demo"></p> <script> document.getElementById("demo").innerHTML = 123e5; </script></body> </html>

4.2.2 字符串（String）字面量? 可以使用單引號或雙引號:

4.2.3 表達式字面量?用于計算：

4.2.4?數組（Array）字面量

定義一個數組：

[40, 100, 1, 5, 25, 10]

4.2.5?對象（Object）字面量

?定義一個對象：

{firstName:"John", lastName:"Doe", age:50, eyeColor:"blue"}

?4.2.6?函數（Function）字面量?

定義一個函數：

function myFunction(a, b) { return a * b;}

5. JavaScript 變量

在編程語言中，變量用于存儲數據值。

JavaScript 使用關鍵字?var?來定義變量，使用等號來為變量賦值：

<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>菜鳥教程(runoob.com)</title> </head> <body><p id="demo"></p> <script> var length; length = 6; document.getElementById("demo").innerHTML = length; </script></body> </html>

變量可以通過變量名訪問。在指令式語言中，變量通常是可變的。字面量是一個恒定的值。變量是一個名稱。字面量是一個值。

6.JavaScript 操作符

JavaScript語言有多種類型的運算符：

類型實例描述

賦值，算術和位運算符	=? +? -? *? /	在 JS 運算符中描述
條件，比較及邏輯運算符	==? != <? >?	在 JS 比較運算符中描述

總結

以上是生活随笔為你收集整理的01）自学JavaScript的全部內容，希望文章能夠幫你解決所遇到的問題。

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

JavaScript