1葵硕、認(rèn)識(shí)JS
JS的的發(fā)展歷程有空再議,可謂是百家爭鳴吴藻,最終磐涅鳳凰瞒爬,浴火重生。
JavaScript调缨、JS疮鲫、javascript都是JavaScript
JS的的特性
- 編程語言:就是可以編寫處理邏輯的程序的語言
- 腳本語言:可以編寫具有簡單功能處理的吆你、運(yùn)行特定環(huán)境的小程序操作
- 跨瀏覽器:目前主流的任意瀏覽器都可以操作
- 弱類型語言:對(duì)于數(shù)據(jù)類型的存儲(chǔ)操作可以自動(dòng)適應(yīng)
- 運(yùn)行環(huán)境:瀏覽器引擎【JS解釋器】弦叶、NodeJS平臺(tái)
- 解釋運(yùn)行:解釋一行,執(zhí)行一行
1.1 第一個(gè)JS程序
JS代碼妇多,在前端開發(fā)中需要寫到<script></script>標(biāo)簽中
// JS 中的單行注釋
/* JS中的多行注釋開頭
*/ JS中的多行注釋的結(jié)尾
alert("信息"):控制瀏覽器彈出一個(gè)警告對(duì)話框
document.write("信息"):在瀏覽器的網(wǎng)頁中伤哺,輸出write()定義的信息
console.log("信息"):在瀏覽器的控制臺(tái)窗口中,輸出一段信息
<!--alert的簡單應(yīng)用-->
<!doctype html>
<html>
<head>
<meta charset='utf-8'>
<title>網(wǎng)頁標(biāo)題</title>
<scrpit>
alert("彈出一個(gè)警告對(duì)話框")
</scrpit>
</head>
<body>
</body>
</html>
2者祖、 JS的使用
2.1 JS的使用場景
客戶端編程:編寫在HTML中的js腳本文件立莉,運(yùn)行在瀏覽器中。主要實(shí)現(xiàn):網(wǎng)頁特效七问、數(shù)據(jù)驗(yàn)證蜓耻、數(shù)據(jù)交互
服務(wù)端編程:編寫在服務(wù)器上js腳本文件中,運(yùn)行在Node平臺(tái)上械巡。主要實(shí)現(xiàn):服務(wù)端軟件的功能流程處理
2.2 安裝刹淌、配置饶氏、開發(fā)環(huán)境
- 安裝:客戶端編程不需要安裝【服務(wù)端開發(fā):需要安裝NodeJS環(huán)境】
- 配置:客戶端編程不需要配置【服務(wù)端開發(fā):需要配置開發(fā)環(huán)境】
- 開發(fā)環(huán)境:客戶端編程在瀏覽器環(huán)境【瀏覽器引擎對(duì)象包含了JS解釋器】【服務(wù)端編程在NodeJS運(yùn)行】
3、基本語法
在HTML網(wǎng)頁中有勾,編寫的腳本程序
JS代碼位置有三種:
1疹启、標(biāo)簽內(nèi)嵌:事件屬性
2、網(wǎng)頁內(nèi)嵌:JS代碼寫在一對(duì)<script></script>標(biāo)簽中
3蔼卡、外部腳本:JS代碼寫在一個(gè)js文件中喊崖,通過script標(biāo)簽引入到HTML網(wǎng)頁
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>JS基礎(chǔ)語法</title>
<!--引入外部的JS文件;路徑是相對(duì)路徑雇逞;不能使用絕對(duì)路徑-->
<script src="demo02.js"></script>
<style>
div{
width: 100px;
height: 100px;
background-color: #00c4ff;
}
</style>
</head>
<body>
<!--標(biāo)簽內(nèi)嵌JS代碼-->
<div onclick="javascript:alert('點(diǎn)了一下div')">這是一個(gè)標(biāo)簽荤懂,點(diǎn)我試試</div>
<!--網(wǎng)頁內(nèi)嵌-->
<button onclick="show()">按鈕</button>
<!--使用外部JS代碼-->
<button onclick="show_info()">玩一玩廣告。塘砸。势誊。</button>
<script>
// 網(wǎng)頁內(nèi)嵌JS代碼:必須寫在一對(duì)scpipt標(biāo)簽中
function show(){
alert("用戶點(diǎn)擊的一個(gè)東西,顯示了show函數(shù)")
}
</script>
</body>
</html>