1. 程式人生 > >html基礎:js

html基礎:js

and 關鍵字 字符串操作 cas 奔馳 小數 一個 寶馬 aaaaa

js是一種腳本語言。在html中起到操控行為的作用。在html中,html代碼如果是一個人的話,那麽js就是這個人的行為

js在html的head中被引用,也可以在body中被引用。引用方式用<script></script>標簽:<script src="public.js" type="text/javascript"></script>

放在head和body中的區別:因為h‘tml代碼在解析時,是按順序從上倒下運行的。如果放在head中,就會先執行js,js執行忘了才會繼續body中的html,顯示在頁面。所以這種情況下,我們打開頁面會先看見長時間的空白。因為正在加載js.用戶體驗不好。。而如果放在body中。在執行時,先執行body中的html代碼,將頁面先呈現在用戶面前, 最後執行到js時,js可以在後臺慢慢加載。用戶體驗比較好

一、字符串操作

//定義字符串 
var str = 你開心就好!; 
var name = ‘aaaaaa; 
// 字符串的拼接 
var name_str = name+str;  
//字符串操作 
str = ‘aaaaajijiji 
str.charAt(0) 根據角標獲取字符串中的某一個字符  char字符 
str.substring(1,3) 根據角標獲取 字符串子序列 大於等於x  小於y 
str.length 獲取字符串長度 
str.concat(‘第一個字符串)  拼接字符串 
str.indexOf(大師) 獲取子序列的位置 
str.slice(0,1)  切片 start end 
str.toLowerCase()  變更為小寫 
str.toUpperCase() 變更大寫 
str.split(
,1) 切片 返回數組 參數2 為取分割後數組的前x個元素 數字類型(JavaScript 只有一種數字類型。數字可以帶小數點,也可以不帶) var age = 18; var score = 89.22; number = 18; // 字符串轉 var n = parseInt(number); //如果number帶小數點,則會直接去掉小數點後內容 // 轉換成小數 f =parseFloat(number) 布爾類型(true 或 false) var t = true; var f = false;//python中都是大寫的,js中都是小寫的

二、數組

// 第一種創建方式 var list = new Array(); 
list[0] 
= 第一個元素; list[1] = 第二個元素; // 第二種創建方式 var list2 = new Array(第一個元素,第二個元素); // 第三種創建方式 var list3 = [第一個元素,第二個元素]; 數組操作 list3.length 數組的長度 list3.push(dsx) 尾部追加參數 list3.shift() 頭部獲取一個元素 並刪除該元素 list3.pop() 尾部獲取一個元素 並刪除該元素 list3.unshift(dsx) 頭部插入一個數據 list3.splice(start, deleteCount, value) 插入、刪除或替換數組的元素 list3.splice(n,0,val) 指定位置插入元素 list3.splice(n,1,val) 指定位置替換元素 list3.splice(n,1) 指定位置刪除元素 list3.slice(1,2) 切片; list3.reverse() 反轉 list3.join(-) 將數組根據分割符拼接成字符串 list3.concat([abc]) 數組與數組拼接 list3.sort() 排序

三、對象

類似python中的字典

var dict = {name:dsx,age:18,sex: };
var age = dict.age; //通過key,獲取到value
var name = dict[name];
delete dict[name] 刪除
delete dict.age 刪除

四、循環

//        if(1==2){
//            console.log(1111111)
//        }
//        else if(2==2){
//            console.log(2222)
//        }
//        else{
//            console.log(‘最後了‘)
//        }

//javascript當中如果是兩個等號,代表不去校驗數據類型是否相同.三個等號會判斷數據類型
//        if (‘1‘==1){
//            console.log(11111)
//        }
// 以上代碼會打印出11111

        if(‘1‘===1){
            console.log(1111111)
        }
        else{
            console.log(222222)
        }
//        以上代碼會打印出222


//switch
        switch(2){
            case 1:
                console.log(1111);//多行代碼的情況,必須加上分號
                break;//每個分支都必須加break
            case 2:
                console.log(22222);
                break;
            default:
                console.log(33333)

        }

//        for循環--字符串
        var name=‘dsx nhy‘;
        for(var a in name){//循環的是角標,0,1,2,3.。。
            console.log(name[a])
        }
// 數組,循環的還是角標
        var list=[‘大師兄‘,‘怒牛‘,‘andas‘];
        for(var i in list){
            console.log(list[i])
        }
//字典,循環的是key
        var dict={‘寶馬‘:‘BMW‘,‘奔馳‘:‘bc‘};
        for (var d in dict){
            console.log(d);
            console.log(dict[d])
        }

//        下面這種方法,不支持字典的循環
        var list=[‘大師兄‘,‘怒牛‘,‘andas‘];
        for(var i=1;i<=list.length;i++){
            console.log(i);
            console.log(list[i])
        }

//        while循環
        while(1==1){//死循環
            console.log(111111)
        }

五、函數

//        常規函數
        function f(name,age){//可傳參,也可不傳
            console.log(name);
            console.log(age);

        }
        f(‘dsx‘,19)//        自執行函數
        (function (name) {
            console.log(‘自執行函數‘)

        })(‘實參name‘)
        //相當於先(function()),function函數外層括號成一個變量f,然後變量f後加上括號,可以自動執行f().等同下面代碼
//        f=(function(){console.log(‘fdfd‘)});
//        f()

六、對象

通過new關鍵字創建對象

在js中,方法和類的區別在於是否有this.如果方法用到了js,將自動解析為類

<script>
    function f(name) {
        this.name=name;//函數中寫了this,js就自動將函數當作一個類。this等同python中的self
        this.say=function(){//匿名函數
            console.log(‘say‘+this.name)
        }

    }
    var obj=new f(‘dfdf‘);//通過new創建對象
    console.log(obj.name);
    obj.say()
</script>

html基礎:js