js-DOM ~ 05. Date日期的相关操作、string、查字符串的位置、给索引查字符、字符串截取slice/substr/substring、去除空格、替换、大小写、Math函数、事件绑定、this

2023-06-13,,

内置对象:  语言自带的对象/提供了常用的、基本的功能

打印数组和字符串不用for... in   /   打印josn的时候采用for...in

Date

  获取当前事件:   var date = new Date() ;

          var date = new Date('2017/04/02  9:55:00 ') ;定义一个指定日期的时间对象

  getDate( )    获取日期1-31

  getDay ()    获取今天是周几 0-6

    getMonth ()    月份 0-11

  getFullYear( ) 获取完整年份

  getHours ()     获取小时0-23   

  getMinutes()    获取当前分钟 0-59

  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>

获取当前日期

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

 <!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title></title>
<style>
div {
width: 1210px;
margin: 200px auto;
color: red;
text-align: center;
font: 600 30px/30px "simsun";
}
</style>
</head>
<body>
<div></div> <script>
var div=document.getElementsByTagName("div")[0];
var timer = setInterval(fn,1);
function fn(){
var nowtime = new Date();
var future = new Date("2017/09/05 18:23:15");
var timeSum = future.getTime() - nowtime.getTime();
var day = parseInt(timeSum/1000/60/60/24);
var hour = parseInt(timeSum/1000/60/60%24);
var minu = parseInt(timeSum/1000/60%60);
var sec = parseInt(timeSum/1000%60);
var millsec = parseInt(timeSum%1000);
day=day<10?"0"+day:day;
hour=hour<10?"0"+hour:hour;
minu=minu<10?"0"+minu:minu;
sec=sec<10?"0"+sec:sec;
if(millsec<10){
millsec="00"+millsec;
}else if(millsec<100){
millsec="0"+millsec;
}
//
// console.log(day);
// console.log(parseInt(timeSum/1000/60/60/24));
if(timeSum<0){
div.innerHTML="距离发布会还有00天00小时00分00秒000毫秒";
clearInterval(timer);
return;
}
div.innerHTML="距离发布会还有"+day+"天"+hour+"小时"+minu+"分"+sec+"秒"+millsec+"毫秒";
} </script>
</body> </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

事件绑定      

    addEventListenerevent事件监听器

      后面绑定的事件照样会之心/不会被重叠/ 调用者.addEventListener (“触发事件”。执行函数)

    调用者.触发事件= function (){  } ;

      该方法绑定的事件后面会把前面的层叠掉

    调用者.addEventListener("触发事件 (不带on)“,执行函数)  ;

      该方法调用的不会被层叠掉,绑定的事件都会执行。

    要想传递参数到事件监听器中,可以是用匿名函数

        el.addEventListener( " clisk" ,function () {fn("four")} , false ;

    调用者.attachEvent("触发事件(带on)“)

    this  :

        在addEventListener:事件处理程序会在当前对象的作用域运行,this会指向被调用的对象

        在attachEvent:事件处理程序是在全局作用域下运行,this会指向window

    removeEventLister ;解绑事件

  

js-DOM ~ 05. Date日期的相关操作、string、查字符串的位置、给索引查字符、字符串截取slice/substr/substring、去除空格、替换、大小写、Math函数、事件绑定、this的相关教程结束。

《js-DOM ~ 05. Date日期的相关操作、string、查字符串的位置、给索引查字符、字符串截取slice/substr/substring、去除空格、替换、大小写、Math函数、事件绑定、this.doc》

下载本文的Word格式文档,以方便收藏与打印。