js-DOM ~ 05. Date日期的相关操作、string、查字符串的位置、给索引查字符、字符串截取slice/substr/substring、去除空格、替换、大小写、Math函数、事件绑定、this
内置对象: 语言自带的对象/提供了常用的、基本的功能
打印数组和字符串不用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的更多相关文章
- DateTimeHelper【日期类型与字符串互转以及日期对比相关操作】
版权声明:本文为HaiyuKing原创文章,转载请注明出处! 前言 实现日期和字符串之间的转换以及日期的相关操作: 1.日期格式的字符串输出为Date类型: 2.将Date类型以指定格式输出: 3.将 ...
- SimpleDateFormat格式化日期以及日期的相关操作
一.Java中的日期概述 日期在Java中是一块非常复杂的内容,对于一个日期在不同的语言国别环境中,日期的国际化,日期和时间之间的转换,日期的加减运算,日期的展示格式都是非常复杂的问题. 在J ...
- js中转换Date日期格式
在javascript中直接输出Date得到的结果是这样的: function date(){ var date = new Date(); alert(date); } 结果是:Mon Jun 15 ...
- freemark声明变量,boolean,date,date日期格式转换成String类型的(五)
<br/>assign用来定义变量<#assign name="刘德华"><br/> 获取assign定义变量的值:${name} <br ...
- js的new Date()日期的使用
<script type="text/javascript"> //js获取某个月的天数 function days(year,month){ var dayCount ...
- js的 new Date()日期格式化显示以及js获取时间戳
一.日期格式化显示: 对 new Date() 得到日期的进行格式显示扩展,扩展方法如下: // 对Date的扩展,将 Date 转化为指定格式的String // 月(M).日(d).小时(h).分 ...
- Javascript 日期格式化 相关操作
1.相关扩展函数 //--------------------------------------------------- // 判断闰年 //--------------------------- ...
- MongoDB第四天(操作文档,添加,更新,查询以及对于日期的相关操作)
添加文档: 添加单个文档,多个文档 package com.bjsxt.mongodbdemo; import com.mongodb.client.MongoCollection; import o ...
- js关于new Date() 日期格式
下面是关于Date的对象 var oDay = new Date(); oDay.getYear(); //当前年份 oDay.getFullYear(); //完整的年月日(xx年,xx月,xx日) ...
随机推荐
- AUTOSAR学习之RTE - 可运行实体
本文介绍RTE的运行体(runnable). An AUTOSAR component defines one or more "runnable entities". A run ...
- 【Kubernetes 系列五】在 AWS 中使用 Kubernetes:EKS
目录 1. 概述 2. 版本 3. 预备 3.1. 操作环境 3.2. 角色权限 3.2.1. CloudFormation 完全权限 3.2.2. EKS 读写权限 3.2.3. EC2 相关权限 ...
- WebService1
一.什么是WebService(来源百度百科) Web service是一个平台独立的,低耦合的,自包含的.基于可编程的web的应用程序,可使用开放的XML(标准通用标记语言下的一个子集)标准来描述. ...
- 趣味CSS3效果挑战小汇总
众所周知,在CSS3中产生了诸多优秀的特性,现在就来分享一下我这段时间对于这些特性的效果实践,希望对大家有所启发. 挑战1: 画一个对话框 要画一个对话框,首先来学习做一个三角形.其实非常的简单. & ...
- Go 语言基础——go语言如何优雅的进行测试
我们可以为Go程序编写三类测试,即:功能测试(test).基准测试(benchmark),也称性能测试(example) #### 测试文件的约定 1. 测试文件的主名称应该以被测试文件主名称为先导, ...
- idea打包失败时,强行打包
set target_jar="E:\handSight\fras\Jars" cd Jars del fras-.jar rem 拉取最新代码 call git pull ech ...
- c++json构建与解析组件 RapidJSON 没用过永远不会知道有多好用
参考资料: 官方文档 推荐[腾讯RapidJSON]学习笔记 原理请参考以上资料 构建json Document doc; Document::AllocatorType &allocator ...
- junit单元测试框架
一般我们写代码总想对方法测试一下结果,就存在这些问题: 1.如果方法需要测试,都需要在main方法上调用 2.目前的结果都需要我们人工对比 所以就需要用到 junit 进行测试: 1·下载 junit ...
- 读书分享全网学习资源大合集,推荐Python3标准库等五本书「02」
0.前言 在此之前,我已经为准备学习python的小白同学们准备了轻量级但超无敌的python开发利器之visio studio code使用入门系列.详见 1.PYTHON开发利器之VS Code使 ...
- 利用peerjs轻松玩转webrtc
随着5G技术的推广,可以预见在不久的将来网速将得到极大提升,实时音视频互动这类对网络传输质量要求较高的应用将是最直接的受益者.而且伴随着webrtc技术的成熟,该领域可能将成为下一个技术热点,但是传统 ...