HTML數組操作大全

HTML數組操作大全

1.數組對象

1.length---長度
2.pop---刪除最後一個元素並返回
3.push---對數組進行添加並返回長度
4.unshift ----對數組首位進行添加元素
5.shift---對數組首位進行刪除
6.reverse---數組反轉
7.sort-----對數組進行排序
8.splice---對數組值進行覆蓋
<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>數組對象</title>
</head>
<body>
<script type="text/javascript">
    //創建數組
    var arr1 = [1,2,3];
    var arr2 = new Array();//空數組
    var arr3 = new Array(5);//長度5
    var arr4 = new Array("8")//[8]
    var arr5 = new Array(4,5);//[4,5];
    console.log(arr5,arr1,arr2,arr3,arr4);
    console.log(arr5.length);//屬性length--數組長度
    //方法
    // pop push 對數組添加/刪除元素
    var newLengh = arr5.push(6,7,8);//向arr5添加元素6,7,8--返回值爲新數組長度
    console.log(arr5, newLengh);
    // pop() 方法用於刪除並返回數組的最後一個元素。
    var newLeng = arr5.pop();//刪除的是最後一個元素
    console.log(arr5,newLeng);

    //unshift / shift對數組首位添加/刪除--返回值數組長度
    var newfast = arr5.unshift(9);
    console.log(arr5,newfast);

    //數組反轉
    arr5.reverse();
    console.log(arr5);

    //數組轉字符串
    // join
    var str = arr5.join("+");//以+爲間隔連接
    console.log(str);

    //排序
    // sort--採用冒泡排序
    //返回值爲正是正序返回負值是反序
    arr6 = [99,45,78,1];
    arr6.sort(function(a,b){
        return b - a;
    });
    console.log(arr6);

    //覆蓋
    // splice(index,length,item1,item2.....)--覆蓋
    //用後面的item覆蓋前門的index 和length️的範圍
    var arr7 = [11,22,33,44];
    arr7.splice(2,0,999);//(位置角標 長度 添加值)
    console.log(arr7);

</script>
</body>
</html>

2.數學對象

1.Math.random()---生成隨機數
2.Math.abs(-9)-----返回絕對值
3.Math.PI-------圓周率
<script type="text/javascript">
    // Math
    // 屬性
     console.log(Math.PI);
    // 生成0-1的隨機數
    Math.random();
    //abs返回絕對值
     console.log(Math.abs(-9));

</script>

3.日期對象

1.new Date()-----獲取當前時間
2.new Date("2015-5-07 14:22:00")---自定義時間
3.get獲取時間
 3.1http://www.w3school.com.cn/jsref/jsref_obj_array.asp 
 3.2http://www.w3school.com.cn/jsref/jsref_obj_math.asp
<script type="text/javascript">
    var date = new Date("2015-5-07 14:22:00");
    var date2 = new Date("2016-1-1")
    // 兩日期相減得到的是時間差,單位是毫秒
    console.log(date);
    console.log(date2);
    var res = date2 - date;
    console.log(res/1000/3600/24 + 1);
    //get獲取
    console.log(date.getFullYear());
// http://www.w3school.com.cn/jsref/jsref_obj_array.asp
// http://www.w3school.com.cn/jsref/jsref_obj_math.asp
</script>

4.正則表達式

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>正則表達式</title>
</head>
<body>
<script type="text/javascript">
    //reg = /正則部分(定義的規則)/正則屬性
    //g 全局匹配 i 是否區分大小寫
    // g區分大小寫  匹配多次
    //i 不區分大小寫只匹配一次
    //m 匹配多行
    var reg = /test/g;
    var str = "Testhfd@shfk12331345678995193jtestdh_gkf就是覺得是h kjg\nHKJHKHz ";
    console.log(str.match(reg));//匹配字符串中有幾個test

    ///\d 代表數字
    var reg1 = /\d/g;
    console.log(str.match(reg1));

    //\w單詞字符 數字 下 劃線
    var reg2 = /\w/g;
    console.log(str.match(reg2));

    //. 匹配任意字符(除去換行符)
    var reg3 = /./g;
    console.log(str.match(reg3));

    //[\s]匹配所有空白
    //[\S]匹配所有非空白
    var reg4 = /\s/g;
    console.log(str.match(reg4));

    //量詞{,}幾到幾位一組
    var reg5 = /\d{1,5}/g;
    console.log(str.match(reg5));

    //[-] 
    var reg6 = /[3-6]/g;//匹配數字3-6
    console.log(str.match(reg6));

    //^ 非字符取反
    var reg7 = /[^123]/g;//除了數字123其餘都匹配
    console.log(str.match(reg7));

    //()
    var reg8 = /3(45)|9([53])/g;//匹配3後面有45或者9後面有5的數
    console.log(str.match(reg8));
    // 開頭和結尾
    var reg10 = /^4466$/g;
    var str10 = "4466"; //判斷字符串是不是4466
    console.log (str10.match(reg10));

    //11位 純數字 1開頭
    var reg11 = /^1(3[379]|47|56)\d{8}$/g;
    var str11 = "13944448888";
    console.log(str11.match(reg11));

    //郵箱
    // (4-10爲單詞字符,開頭必須是字母)@
    // @qq @163 . cn com
    var reg12 = /^@qq(12[1234])\d{2}.com$/g;
    var str12 = '@qq12355.com';
    console.log(str12.match(reg12));

</script>
</body>
</html>

這裏寫圖片描述

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章