思維導圖
1、javascript簡介(*******)
2、js與html結合方式(*******)
3、js原始類型和聲明變量(*******)
4、js的語句 (*******)
5、js的運算符(*******)
6、99乘法表示例 (*******)
7、js數組 (*******)
8、js的函數（動態函數和匿名函數） (*******)
9、js的全局變量和局部變量(*******)
10、script標籤放在的位置
11、js的函數重載(*******)
12、js的全局函數
===============================================
知識點：
1、javascript的簡介
* 是基於對象和事件驅動的語言，應用於客戶端。
- 基於對象：提供好了很多對象，可以直接拿過來使用
- 事件驅動：html做網站靜態效果，javascript動態效果
- 客戶端：專門指的是瀏覽器
* js的特點
（1）交互性：信息的動態交互
（2）安全性：js不能訪問本地磁盤的文件
（3）跨平臺性：只有能夠支持js的瀏覽器，都可以運行;如：java裏面跨平臺性，虛擬機
* javascript和java的區別（如：雷鋒和雷峯塔）
（1）java是sun公司，現在oracle；js是網景公司
（2）JavaScript 是基於對象的，java是面向對象
（3）java是強類型的語言，js是弱類型的語言
- 比如java裏面 int i = "10";
- js: var i = 10; var m = "10";
（4）JavaScript只需解析就可以執行，而java需要先編譯成字節碼文件，再執行。
* javascript的組成（下面簡寫成 js）
三部分組成
（1）ECMAScript
- ECMA : 歐洲計算機協會
- 有ECMA組織制定的js的語法，語句.....
（2）BOM
- broswer object model: 瀏覽器對象模型
（3）DOM
- document object model：文檔對象模型
2、js和html的結合方式（兩種）
第一種：使用script標籤，內部寫js代碼
<script type="text/javascript">
js代碼;
</script>
第二種：使用script標籤，引入一個外部的js文件
*** 創建一個js文件，寫js代碼
<script type="text/javascript" src="js文件路徑"></script>
** 使用第二種方式時候，就不要在script標籤裏面寫js代碼了，寫了也不會執行。
3、js的原始類型和聲明變量
** java的8種基本數據類型 byte short int long float double char boolean
** 定義變量 都使用關鍵字 var
** js的5種原始類型
- string: 字符串類型
*** var str = "abc";
- number：數字類型
*** var m = 123;
- boolean：true和false（默認值是false）
*** var flag = false;
註釋：如果邏輯對象無初始值或者其值爲 0、-0、null、""、false、undefined 或者 NaN，那麼對象的值爲 false。
否則，其值爲 true（即使當自變量爲字符串 "false" 時）！
- null
*** var date = new Date();
*** 獲取對象的引用，null表示對象引用爲空 ，所有對象的引用也是object
- undifined
*** 定義一個變量，沒有賦值。如： var aa;
** typeof(); 查看當前變量的數據類型
4、js的語句
- java裏面的語句：
** if判斷
** switch語句
** 循環 for、while、do-while
-js裏面也有這些語句
** if判斷語句
= 表示賦值
== 用於比較、判斷兩者相等，在比較的時候可以轉自動換數據類型
=== 嚴格比較，不會進行自動轉換，要求進行比較的操作數必須類型一致，不一致時返回flase。
** switch語句
- java裏面支持數據類型 string支持嗎？在jdk1.7開始支持
- js裏面都支持
- switch(a) {
case 5:
break;
case 6:
break;
default:
......
}
** 循環語句 for、while、do-while
- while循環
var i = 5;
while(i>1) {
alert(i);
i--;
}
- for循環
for(int i=0;i<=10;i++) {
alert(i);
}
** i++ ++i和java裏面一樣
5、js的運算符
** += ： x+=y; ===> x=x+y;
** js裏面不區分整數和小數
var j = 123;
alert(j/1000*1000); //結果是：123
// 在js裏面不區分整數和小數，123/1000=0.123 * 1000 = 123
// 而在java裏面區分，j/1000=0 *1000 =0 得到結果是 0
** 字符串的相加和相減的操作
var str = "123";
** 如果相加時候，做是字符串連接
** 如果相減，做的是相減的運算
* //字符串的操作
var str = "456";
//alert(str+1); //在js裏面還是 4561，在java裏也是字符串連接 4561 。
alert(str-1); //在js相減時候，執行減法的運算得455，在java中會報錯。
* 提示NaN:表示不是一個數字，not a number
** boolean類型也可以操作
*** 如果設置成true，相當於這個值是1
*** 如果設置成false，相當於這個值是0
** == 和 === 區別
** 做判斷
** == 比較的只是值
** === 比較的是值和類型（嚴格等於）
** 引入知識
直接向頁面輸出的語句（可以把內容顯示在頁面上）
* document.write("aaa");
document.wirte("<hr/>");
** 可以向頁面輸出變量，固定值和html代碼
6、實現99乘法表（輸出到頁面上）
* document.write("<table border='1' bordercolor='blue'>");
//循環行 9
for(var i=1;i<=9;i++) {
document.write("<tr>");
//循環列
for(var j=1;j<=i;j++) {
document.write("<td>");
//運算
document.write(j+"*"+i+"="+i*j);
document.write("</td>");
}
//document.write("<br/>");
document.write("</tr>");
}
document.write("</table>");
- document.write裏面是雙引號，如果設置標籤的屬性需要使用單引號
- document.write可以輸出變量，還可以輸出html代碼
7、js的數組
* 什麼是數組？
- 使用變量，var m = 10;
- java裏面的數組 定義 int[] arr = {1,2,3};
* 定義方式（三種）
第一種：
var arr = []; //空數組
var arr = [1,2,3];
var arr = [1,"4",true];
第二種：使用內置對象 Array對象
var arr = new Array(5); //定義一個數組，數組的長度是5
arr[0] = "1"; //賦值
第三種：使用內置對象 Array對象
var arr = new Array(3,4,5); //定義一個數組，數組裏面的元素是3 4 5
* 數組裏面有一個屬性 length：獲取到數組的長度 arr.length，（是屬性不是方法所以後面沒有括號）
* 數組可以存放不同的數據類型的數據
* js的數組追加元素後，長度是變化的，取值時不越界就不會報錯。
8、js的函數
** 在js裏面定義函數（方法）有三種方式
**** 函數的參數列表裏面，不需要寫var，直接寫參數名稱
第一種方式：使用到一個關鍵字 function
function 方法名(參數列表) {
方法體;
返回值可有可無（根據實際需要）;
}
**** 代碼
//使用第一種方式創建函數
function test() {
alert("qqqqq");
}
//調用方法
//test();
//定義一個有參數的方法 實現兩個數的相加
function add1(a,b) {
var sum = a+b;
alert(sum);
}
//add1(2,3);
//有返回值的效果
function add2(a,b,c) {
var sum1 = a+b+c;
return sum1;
}
alert(add2(3,4,5));
第二種方式： 匿名函數
var add = function(參數列表) {
方法體和返回值;
}
**** 代碼
var add3 = function(m,n) {
alert(m+n);
}
//調用方法
add3(5,6);
第三種方式：（用的少，瞭解）
*** 動態函數
*** 使用到js裏面的一個內置對象 Function
var add = new Function("參數列表","方法體和返回值");
9、js的全局變量和局部變量
** 全局變量：在script標籤裏面定義一個變量，這個變量在頁面中js部分都可以使用
- 在方法外部、內部、另外一個script標籤使用
** 局部變量：在方法內部定義一個變量，只能在方法內部使用
- 如果在方法的外部調用這個變量，提示出錯
- SCRIPT5009: “nn”未定義
** ie自帶了一個調試工具，ie8及其以上的版本中，鍵盤上 F12，在頁面下方出現一個條
10、script標籤放在的位置
* 把script標籤放到 <body></body>後面！
* 如果現在有這樣一個需求：在js裏面需要獲取到input裏面的值。
如果把script標籤放到head裏面就會出現問題！ 因爲html解析是從上到下解析的，
script標籤放到的是head裏面，直接在裏面取input裏面的值，
因爲頁面還沒有解析到input那一行，肯定取不到，js還會報錯。
11、js的重載
* 什麼是重載？方法名相同，參數列表不同
- java裏面有重載，肯定有
* js裏面是否有重載？
12、js的全局函數
由於不屬於任何一個對象，直接寫名稱使用
eval() ： 執行js代碼（如果字符串是一個js代碼，使用方法直接執行）
var str = "alert('1234');";
//alert(str);
eval(str);
encodeURI() ：對字符進行編碼
- %E6%B5%8B%E8%AF%95%E4%B8%AD%E6%96%87aaa1234
decodeURI() ：對字符進行解碼
encodeURIComponent() 和 decodeURIComponent()
isNaN():判斷當前字符串是否是數字（is not a number）
var str2 = "aaaa";
alert(isNaN(str2));
如果是數字，返回false
如果不是數字，返回true
parseInt()：類型轉換
var str3 = "123";
document.write(parseInt(str3)+1);
13、今天的內容的總結
* css
** css和html的四種結合方式(*******)
** css的基本選擇器(********)
* 標籤選擇器 div {css代碼}
* class選擇器 .名稱 {}
* id選擇器 #名稱{}
** css的擴展選擇器(瞭解)
* 關聯選擇器
*** 嵌套標籤的樣式的設置
* 組合選擇器
*** 不同標籤設置相同的樣式
* 僞元素選擇器
** a標籤的狀態
lv ha
** 盒子模型(瞭解)
* 邊框 border
上下左右
* 內邊距 padding
上下左右
* 外邊距 margin
上下左右
** 浮動(瞭解)
float : left right
** 定位(瞭解)
position：absolute relative
* javascript(*******)
** 什麼是javascript
- 基於對象和事件驅動的語言，應用與客戶端。
- 特點：交互性、安全性、跨平臺性
- javascript和java區別
- 組成（3部分）
* ECMAScript
* bom
* dom
** js和html的結合方式（兩種）
第一種 <script type="text/javascript"> js代碼; </script>
第二種 <script type="text/javascript" src="js的路徑"> </script>
** js的數據類型
* 五種原始類型
string number boolean null undifined
* 定義變量使用 var
** js的語句
* if
* switch
* for、while、do-while
** js的運算符
* 字符串的操作
*** 字符串相加：連接
*** 字符串相減：執行相減運算
* boolean類型相加
true： 1
false：0
* == 和 === 區別
** == ： 判斷值
** === ： 判斷值和類型
** js的數組
三種定義方式
** var arr = [1,2,"3"];
** var arr1 = new Array(9); //長度9
** var arr2 = new Array(1,2,3); //元素是 1 2 3
** 屬性 length：數組的長度
** js的函數
*** function add(a,b) {方法體和返回值;}
*** var add1 = function(m,n) {方法體和返回值;}
*** var add2 = new Function("a,b","方法體和返回值");（很少使用）
**** 不要忘記調用，不然不起作用的
** js的全局變量和局部變量
** 全局變量：在頁面中任何js的部分，都可以使用
** 局部變量：在方法內部定義一個變量，這個 變量只能在方法內部使用
** script標籤位置
** 建議放在<body></body>後面
** js的重載（回去思考這個問題）