js-DOM ～ 05. Date日期的相關操做、string、查字符串的位置、給索引查字符、字符串截取slice／substr／substring、去除空格、替換、大小寫、Math函數、事件綁定、t

時間 2019-11-17

標籤 dom date 日期相關 string 查字符串位置索引字符字符串截取 slice substr substring 去除空格替換大小寫 math 函數事件綁定欄目 JavaScript 简体版

原文原文鏈接

內置對象：語言自帶的對象／提供了經常使用的、基本的功能html

打印數組和字符串不用for... in ／打印josn的時候採用for...in編程

Date

　　獲取當前事件： var date = new Date() ;數組

　　　　　　　　　　var date = new Date('2017/04/02 9:55:00 ') ;定義一個指定日期的時間對象dom

　　getDate（）獲取日期1-31ide

　　getDay ()　　獲取今天是周幾 0-6函數

　 getMonth () 月份 0-11this

　　getFullYear( ）獲取完全年份編碼

　　getHours () 獲取小時0-23 　　spa

　　getMinutes() 獲取當前分鐘 0-59code

　　getSeconds() 獲取當前秒數

　　getMilliseconds () 獲取毫秒　　

　　getTime () 1970年1月1日開始到如今的毫秒數　

　　　　date.time ( ) ;

　　　　+new.time ( );

　　　　date.getTime ( ) ;

　　　　date.valueOf ( ) ;　

<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <title></title>
    <style>
        div {
            width: 800px;
            margin: 200px auto;
            color: red;
            text-align: center;
            font: 600 30px/30px "simsun";
        }
    </style>
</head>
<body>
    <div></div>

    <script>
        //模擬日曆
        //需求：天天打開這個頁面都能定時顯示年月日和星期幾
        //步驟：（建立一個當前日期的日期對象，而後獲取其中的年月日和星期，賦值給div）
        //1.建立一個當前日期的日期對象
        //2.而後獲取其中的年月日和星期
        //3.賦值給div


        //1.建立一個當前日期的日期對象
        var date = new Date();
        //2.而後獲取其中的年月日和星期
        var year = date.getFullYear();
        var month = date.getMonth();
        var hao = date.getDate();
        var week = date.getDay();
//        console.log(year+" "+month+" "+hao+" "+week);
        //3.賦值給div
        var arr = ["星期日","星期一","星期二","星期三","星期四","星期五","星期六"];
        var div = document.getElementsByTagName("div")[0];
        div.innerText = "今天是："+year+"年"+(month+1)+"月"+hao+"日 "+arr[week];


    </script>


</body>
</html>

獲取當前日期

------------------------------------------------------

 1 <!DOCTYPE html>
 2 <html>
 3 <head lang="en">
 4     <meta charset="UTF-8">
 5     <title></title>
 6     <style>
 7         div {
 8             width: 1210px;
 9             margin: 200px auto;
10             color: red;
11             text-align: center;
12             font: 600 30px/30px "simsun";
13         }
14     </style>
15 </head>
16 <body>
17     <div></div>
18 
19 <script>
20     var div=document.getElementsByTagName("div")[0];
21     var timer = setInterval(fn,1);
22     function fn(){
23         var nowtime = new Date();
24         var future = new Date("2017/09/05 18:23:15");
25         var timeSum = future.getTime() - nowtime.getTime();
26         var day = parseInt(timeSum/1000/60/60/24);
27         var hour = parseInt(timeSum/1000/60/60%24);
28         var minu = parseInt(timeSum/1000/60%60);
29         var sec = parseInt(timeSum/1000%60);
30         var millsec = parseInt(timeSum%1000);
31         day=day<10?"0"+day:day;
32         hour=hour<10?"0"+hour:hour;
33         minu=minu<10?"0"+minu:minu;
34         sec=sec<10?"0"+sec:sec;
35         if(millsec<10){
36             millsec="00"+millsec;
37         }else if(millsec<100){
38             millsec="0"+millsec;
39         }
40 //
41 //        console.log(day);
42 //        console.log(parseInt(timeSum/1000/60/60/24));
43         if(timeSum<0){
44             div.innerHTML="距離發佈會還有00天00小時00分00秒000毫秒";
45             clearInterval(timer);
46             return;
47         }
48         div.innerHTML="距離發佈會還有"+day+"天"+hour+"小時"+minu+"分"+sec+"秒"+millsec+"毫秒";
49     }
50 
51 </script>
52 </body>
53 
54 </html>

距離發佈會倒計時

string

　　　　var index1　=　str.indexOf(「須要查找的字符串」);

　　　　簡單數據類型沒法綁定屬性和方法：string = 'abc' ；

　　　　string內置對象，能夠綁定屬性和方法 var strObj = new String('abc') ;

　　 string簡單數據類型底層有數據轉換，當簡單類型的string調用了內置對象string的方法後，string默認轉換格式轉換爲String，執行完再轉換回去

　　給索引查字符 charAt / charCodeAt

　　　　　　　　 cahrAt（字符索引值）: 返回索引位置的字符

　　　　　　　　charCodeAt (字符索引值）：返回指定字符的Unicode編碼（萬國碼）／UTF-8 ／ UTF-16 ／都包含ASCII碼

　　　　　　　　字符串長度和字符串所佔字數不一樣： 1個漢字2個字節，一個字母1個字節

　　給字符查索引： indexOf ／ lastIndexOf　　　　　　　　索引值 = str.indexOf/lastIndexOf(想要查詢的字符);

　　　　　　　　若兩個查相同的字符而且字符串裏面有兩個相同的字符，返回的索引值不同／內存的索引值在加載的時候已固定。不會改變

　　URL編碼和編程

　　　　數據傳輸的時候通過編碼再傳遞／encodeURLComponent （）：編碼／ decodeURLComponent ():解碼

　　字符串連接 concat（） var str = oldStr.concat(str);

　　字符串截取：

　　　　var str = oldStr.slice(開始的索引，結束的索引）； // 開始的索引包括自己，結束的索引自己是不在內的

　　　　　　只給開始索引，則從索引截取到最後／索引值爲負值，從後往前截取／結束索引比開始索引小，則返回空字符串／包左不包又

　　　 var str = olldString.substr(開始的索引，截取的長度）

　　　 var str = oldString.substring(開始的索引，結束的索引）

console.log(str.substring(2));  //從索引截取到最後
    console.log(str.substring(2,5));//從索引截,長度個字符串
    console.log(str.substring(-1)); //所有截取
    console.log(str.substring(5,2));//智能調換

　　　　str.trim.() ; //去除字符串先後的空格

　　　　replace替換 var str = oldStr.replace(匹配的字符，替換的字符）　　　 str2.replace(/today/gi,"tomorrow"));

　　　　split 字符串變數組 var str = oldStr.split ( "分隔標誌（不會出如今數組中）「）；

　　　　 str.toLowerCase() ; 轉換成小寫

　　　　 str.toUpperCase() ; 轉換成大寫

　　　　　str.link("連接") ; 建立一個新a標籤

　　　　　str.anchor() ; 建立一個a標籤

Math

　　　 abs 絕對值

　　　　floor 地板函數

　　　　ceil 天花板函數

　　　　round 四捨五入

　　　　random 隨機數

var num = -0.6;
    console.log(Math.abs(num));        //取絕對值
    console.log(Math.floor(num));      //向下取整      //向小取
    console.log(Math.ceil(num));       //向上取整      //向大取
    console.log(Math.round(num));      //四捨五入取整   //正數四捨五入，負數五舍六入
    console.log(Math.random());        //隨機數0-1