js:放在bady標簽的底部，保證頁面加載完成后才加載js

js注釋：// 單行注釋

　　　　/*多行注釋*/

js有兩種存在形式：

以文件的形式存在，使用時引用在head標簽里<script src="js文件名.js"> 第一種 </script>

在bady標簽的底部寫入:

　　<script>
　　 ? ? ? ? ?function f1(){
? ? ? ? ? ? ? ? ? ? ? ?js的函數體
? ? ? ? ? ? ? ? }
? ? ? ? </script>

js中變量聲明 : name='vera'; ? //全局變量

　　　　　　　var age= 18; ?// 局部變量， 注:　var 必須寫

js 數據類型：?

　　　　其中包括數字、字符串、數組（字典）

　　　　定義數字：var age = 18;
　　　　　　　　　var age = Number(18);

　　　　布爾值：Boolean

　　　　　　　　Boolean(1) ? ?true

　　　　　　　　Boolean(0) ? ? false

　　　　字典的定義：var dic={'k1':v1,'k2':v2}

　　　　字符串轉化為數字 ：Number('123');
　　　　　　　　　　　　　 parseInt('123');

　　　　console調試器查看類型：console.log(age,typeof age);?
　　　　數字類型整型轉換：var age=18.9

　　　　　　　　 ? ? ? ? ? ? ? ??console.log(parseInt(age)); ? ? ?結果=18
? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? console.log(parseFloat(age)); ? 結果=18.9（js中是沒有浮點型的）

　　　　直接定義多個變量：var v1=21; v2=1233; v3=222;

js中null和undefined的區別：

　　null：表示一個值被定義了，但這個值是空值

　　undefined：表示缺少值，即此處應該有值，但還沒有被定義

? ? ? ?

?

var xx=' ?i love you ?';

關于字符串的小方法：

xx.trim()	移除字符串左右空格
xx.trimleft()	移除字符串左邊的所有空格
xx.trimright()	移除字符串右邊的所有空格
xx.charAt(2)	索引取值，取到2 位置的字符
xx.substring(1,2) ? ? ? ? ? ?	獲取字符串的子序列（類似切片） ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ??
xx.indexOf('2')	獲取2位置的下標
xx.length	獲取字符串長度

數組（相當于Python中的列表）：

　　數組創建的兩種形式：var ?li=[11,22,33];

　　　　　　　　　　　　var ?li = Array(11,22,33);

關于數組的小方法：

li.push(88)	把88添加到數組最后
li.unshif10('oo')	把字符串放在了數組的最前面
li.splice(1,0,'vera')	把字符串的指定位置（1位置），中間位置的0是固定的，寫為0才會進行插入
i = li.pop()	移除最后的元素,有返回值
m = li.shift()	移除最前面的元素,有返回值
x = li.splice(1,2)	移除1位置后面的2個元素,有返回值
k=li.slice(0,2)	切片，拿到的0到2位置的元素
l = li.concat(n)	把n數組和li數組合并為一個新的數組
li.reverse()	li 反轉,在本身的基礎上
n = li.join('-')	給數組加上短線"11-22-33-44"（ python 里寫法："-".join(li)）

/* js中的序列化 */
　　序列化: s=JSON.stringify('sdklfkjdfls');

　　反序列化: m=JSON.parse(s);

/* js中的for循環 */

var li=[11,22,33,44]; 數組獲取數據1 for(var item in li){ 　　console.log(item); } //輸出索引 數組獲取數據2 for(var i=0;i<li.length;i++){ 　　console.log(li[i]) } // 輸出li中的數據 var dic = {'k1':11,'k2':22} 字典獲取數據 for(var item in dic){ 　　console.log(li[item]); } // 只能輸出key for(var key in dic){ 　　console.log(key,li[key]) } // 輸出key和value

/*條件語句與異常處理*/

while條件語句： ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ?

　　while(true){
　　　　continue;
　　　　break; // 和Python里一樣
　　}

if else條件語句 ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ?

　　if(條件){

　　} else if(條件){

　　}else{

　　}

switch語句 ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ?

var name=111;
switch(name){
　　case 1:console.log('11');
　　　　　break;
　　case 2:console.log('22');
　　　　　break;
　　default:console.log('ddd');
　　　　　break;
}

異常處理 ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ??
try{

　　// 可能出現錯誤的語句

}catch(e){

　　// 捕獲到錯誤進行處理

}finally{

　　// 沒捕獲到錯誤或捕獲到錯誤進行提示，無論前面成功與否都會執行

}

/*js函數*/

關鍵字：function

? 普通函數 ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ?

function func(arg){ ? ?// arg； 形式參數

　　console.log(arg);

　　return 'hello'; ? // 返回值

}

調用：var ret=func(123);

　　　console.log(ret);

? 匿名函數 ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ??

var f = function(arg){ // 函數名為f
　　console.log(arg); // console.log()打印
};

調用 ?: ? f(123);

? 自執行函數 ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ?

定義一個函數，并自己執行函數,形式：()();

自執行函數：用于自定義的js或jQuery的類庫時，
當用戶瀏覽器解釋的時候，一旦解釋到js文件，可以自動執行里面的東西；

例：
　　(function(){
　　　　console.log(111);
　　})(); ? ? ? ? ? ? ? ? ?//結果；111

例2：
　　(function(arg){
　　　　console.log(111,arg);
　　})('alex'); ? ? ? ? ?// 'vera' (傳給形式參數) ,自動執行結果：111 'alex'

? ? js模擬面向對象 ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ??

function Foo(name,age){
　　this.Name=name;
　　this.Age=age;
　　this.Func = function(arg){
　　return this.Name+arg;
　　}
}

調用：var obj = new Foo('Vera', 18);

　　　console.log(obj.Name); ? ?//結果：Vera
　　　console.log(obj.Age); ? ? ? ?//結果：18
　　　var ret = obj.Func('beautiful');
　　　console.log(ret); ? ? ? ? ? ? ? ? ?//結果：Verabeautiful

轉載于:https://www.cnblogs.com/Vera-y/p/10443146.html

總結

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

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