頁面的組成三部分
- HTML超文本標記語言
- css層疊樣式
- js 腳本語言
JS的組成三部分
- ECMAScript，JS語法，包括變量，條件判斷，循環，數據類型等，具有良好的兼容性
-DOM文檔對象模型，程序員可以解決其兼容性問題
-BOM瀏覽器對象模型，程序員無法解決兼容問題
快捷鍵的使用
- webstrom中快速打出代碼
- ul>li*6>a{列表$} 按下tab鍵顯示：
- 強制換行 Mac：command+center；Windows：ctrl+center
- 代碼收縮展開
- 收縮 Mac：command+減號；Windows：Ctrl+減號
- 展開 Mac：command+加號；Windows：Ctrl+加號
css引入方式
- 行內樣式 style=“”
- 內嵌樣式 style
- 外鏈樣式 link=href
JS引入方式
- 行內引入
<!--onmouseover="this.style.background='yellow'; this.style.color='red'" -->
<!-- onmouseout="this.style.background='red'; this.style.color='#fff'"-->
- 內嵌式 script
一般寫在footer位置
...
<script>
var oLeft=document.getElementById('left');
// 在document文檔下，得到元素通過ID left
oLeft.onmouseover=function () {//函數function就是用來做事情的
oLeft.style.background='yellow';
oLeft.style.color='red';
}
//在移出的時候，讓"left"這個元素，背景變成紅色，文字變成白色
oLeft.onmouseout=function () {
oLeft.style.background="red";
oLeft.style.color="#fff";
}
</script>
... - 外鏈式
類似于在HTML文件中引入css樣式表
<script src="##.js"></script>
JS 編程思路的形成
- 找到誰獲取元素
- 給誰加什么事件
- 做什么事情
對象具有兩個特征
屬性 ：沒括號
方法：沒括號
this的小總結
- 當函數被調用的時候，“.”前面是就是this
- 當函數被調用的時候，前面沒點的話this就是window
- 點元素身上的事件被觸發的時候，會觸發一個函數，函數中的this指向當前被觸發事件的這個元素；
輸出方式
- alert() 彈出框
- console.log() 打印出來，在控制臺輸出
- console.dir() 打印出對象身上的屬性和方法
- confirm()會有返回值：true false
- document.write()在頁面輸出
- innerHTML 可以輸出元素所包裹的內容；innertext 輸出文本；
- console.table（）把對象以表格的形式輸出
命名方式
- 除了第一個單詞外，從第二個單詞開始，每個單詞的首字母大寫；
- 常用的命名前綴
- a 數組（arry,arr,ary,aDiv）獲取到一組元素對象
- o 對象（ obj）普通對象 （oDiv）獲取到一個元素對象
- s 字符串 string
- n 數字 number
- b 布爾值 Boolean：true false
數據類型
-
基本數據類型 ： 對值的引用
- 字符串 string，
- 數字 number，
- 布爾值Boolean，
- 空對象null，
- undefined
引用數據類型 ： 實際是對地址的引用
-
對象數據類型：
- 數組 arry,
- 對象 object，
- 數據 date(),
- RegExp /^\d{2}/
-
函數數據類型：
- function(){}
循環
c語言中的循環語句
-
for循環四部曲
定義
條件
語句
自增
判斷語句
- if...else...if...else
- switch...case...break
隔行換色
- 條件判斷：if...else...if...else
switch...case...break - 用%的思想：有幾種情況就%幾
習慣
- 不會寫代碼就寫漢語，編程思想
- 不懂就百度
- 良好的寫代碼習慣讓代碼更簡明
