JavaScript详解(二)
js的流程控制
- if语句:
if (条件表达式A){
xx;
}else if (条件表达式B){
xx;
}
else{
xx;
}
- switch语句:
switch (表达式){
case 值1:
xxx;
break;
case 值2:
xxx;
break;
default: //所有case都不满足时执行
xxx;
}
- for语句:
for(初始化语句;循环判断语句;循环执行语句){
xxx;
}
- while语句:
while(循环判断语句){
xxx;
}
- do....while语句:
do{
xxx;
}while(循环判断语句);
JavaScript的本地对象
字符型对象String
有三种定义方法:
- var s = new String('字符串内容');
- var s = String('字符串内容');
- var s = '字符串内容';
字符串的属性length可以返回其长度,可通过索引返回指定位置字符,通过+拼接。
数字转字符串:nub.tostring()
字符串转数字:Number(str)
字符串对象常用方法:
- str.substring(start,end):截取字符串,如果只传一个参数,则默认截取到最后一个为止。左闭右开。
- str.slice(start,end):切片,左闭右开,r若两个参数为负数,必须保证abs(start)>abs(end)。
- str.split("?"):切割,按照指定参数进行切割,返回一个数组。
- str.indexOf("?"):查找并返回匹配字符串出现的位置,若没找到,返回-1.
- str.toUpperCase():全部转换成大写。
- str.toLowerCase():全部转换成小写。
- str.Replace("a","b"):用b替换字符串中的a,只能替换一个。
日期对象Date
定义一个日期对象:var date = new Date();返回的格式如下:
Tue Nov 20 2018 21:22:41 GMT+0800 (中国标准时间)
获取方法:
- date.getFullYear():返回年份
- date.getMonth():返回月份,月份为实际月份减一,即十二月为0.
- date.getDate():返回日期
- date.getHours():返回当前小时
- date.getMinutes():返回当前几分
- date.getSeconds():返回当前多少秒
- date.getDay():返回周期,周日为0.
设置方法:将date换成set将变成对应的设置方法,但没有设置秒,设置年份为四位数字、设置月份范围为0~11、小时为0~23。
还可以以时间戳设置时间,单位是毫秒:date.setTime().
转换方法:原本时间格式是Tue Nov 20 2018 21:42:05 GMT+0800 (中国标准时间)
- date.toString(): Tue Nov 20 2018 21:43:55 GMT+0800 (中国标准时间)
- date.toTimeString(): 21:43:55 GMT+0800 (中国标准时间)
- date.toDateString(): Tue Nov 20 2018
- date.toLocaleString(): 2018/11/20 下午9:43:55
- date.toLocaleTimeString(): 下午9:43:55
- date.toLocaleDateString(): 2018/11/20
数学对象Math
数学对象常用属性有:
- PI :圆周率
- E:常量e,近似于2.71828
- LN2:2的自然对数
- LN10:10的自然对数
- LOG2E:以2为底的e的对数
- LOG10E:以10为底的e的对数
数学对象常用方法:
- Math.abs():取绝对值
- Math.ceil():往上取整
- Math.floor():往下取整
- Math.round():四舍五入取整
- Math.max():返回所有参数中的最大值
- Math.pow(x,y):返回x的y次幂
- Math.sqrt():返回参数的平方根
- Math.random():随即返回一个0~1的数
定时器
创建一个定时器有三种方式:
- 第一种使用setTimeout方法,这个定时器只执行一次。
timer = setTimeout(function(){
//执行语句
},1000); //timer是创建的一个定时器对象,1000是间隔时间,单位是毫秒
- 第二种使用setInterval方法,这种定时器可以一直执行下去。
timer = setInterval(function (){
//执行语句
},1000);
- 第三种也是用setInterval方法,但他是配合另外的函数使用。
setInterval(函数名,1000);
消除定时器
- clearInterval(定时器对象);
- clearTimeout(定时器对象);
定时器小例子:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>定时器</title>
<style>
*{
padding:0;
margin:0;
}
div.content{
height:150px;
margin-top:50px;
text-align: center;
}
.time{
color:red;
font-weight: bolder;
font-size:19px;
}
.end_time{
color:purple;
font-size: 21px;
/*margin-top:65px;*/
}
#clock{
text-align: center;
}
</style>
</head>
<body>
<div class="content">敌军还有<span class="time" second="5">5</span>秒到达战场</div>
<div id="clock"></div>
<script>
otime = document.getElementsByClassName("time");
ocontent = document.getElementsByClassName("content");
oclock = document.getElementById("clock");
var nub = otime[0].getAttribute("second");
// alert(nub);
timer = setInterval(function(){
nub--;
otime[0].innerHTML = nub;
if (nub === 0){
ocontent[0].innerHTML = "<p class='end_time'>全军出击!!!</p>";
clearInterval(timer);
}
},1000);
function fn() {
var data = new Date;
var year =data.getFullYear();
var mon = data.getMonth()+1;
var day = data.getDate();
var hour = data.getHours();
var minute = data.getMinutes();
var second = data.getSeconds();
if (minute<10){
minute = "0" + minute;
}
if (hour<10){
hour = "0" + hour;
}
if (second<10){
second = "0" + second;
}
oclock.innerHTML = year + "年" + mon + "月" + day + "日" + hour + "时" + minute + "分" + second + "秒";
}
fn();
setInterval(fn,1000);
</script>
</body>
</html>

JavaScript详解(二)的更多相关文章
- .NET DLL 保护措施详解(二)关于性能的测试
先说结果: 加了缓存的结果与C#原生代码差异不大了 我对三种方式进行了测试: 第一种,每次调用均动态编译 第二种,缓存编译好的对象 第三种,直接调用原生C#代码 .net dll保护系列 ------ ...
- PopUpWindow使用详解(二)——进阶及答疑
相关文章:1.<PopUpWindow使用详解(一)——基本使用>2.<PopUpWindow使用详解(二)——进阶及答疑> 上篇为大家基本讲述了有关PopupWindow ...
- Android 布局学习之——Layout(布局)详解二(常见布局和布局参数)
[Android布局学习系列] 1.Android 布局学习之——Layout(布局)详解一 2.Android 布局学习之——Layout(布局)详解二(常见布局和布局参数) 3.And ...
- logback -- 配置详解 -- 二 -- <appender>
附: logback.xml实例 logback -- 配置详解 -- 一 -- <configuration>及子节点 logback -- 配置详解 -- 二 -- <appen ...
- 爬虫入门之urllib库详解(二)
爬虫入门之urllib库详解(二) 1 urllib模块 urllib模块是一个运用于URL的包 urllib.request用于访问和读取URLS urllib.error包括了所有urllib.r ...
- [转]文件IO详解(二)---文件描述符(fd)和inode号的关系
原文:https://www.cnblogs.com/frank-yxs/p/5925563.html 文件IO详解(二)---文件描述符(fd)和inode号的关系 ---------------- ...
- Android View 的绘制流程之 Layout 和 Draw 过程详解 (二)
View 的绘制系列文章: Android View 的绘制流程之 Measure 过程详解 (一) Android View 绘制流程之 DecorView 与 ViewRootImpl 在上一篇 ...
- HTTPS详解二:SSL / TLS 工作原理和详细握手过程
HTTPS 详解一:附带最精美详尽的 HTTPS 原理图 HTTPS详解二:SSL / TLS 工作原理和详细握手过程 在上篇文章HTTPS详解一中,我已经为大家介绍了 HTTPS 的详细原理和通信流 ...
- Linux dts 设备树详解(二) 动手编写设备树dts
Linux dts 设备树详解(一) 基础知识 Linux dts 设备树详解(二) 动手编写设备树dts 文章目录 前言 硬件结构 设备树dts文件 前言 在简单了解概念之后,我们可以开始尝试写一个 ...
- pika详解(二) BlockingConnection
pika详解(二) BlockingConnection 本文链接:https://blog.csdn.net/comprel/article/details/94592348 版权 Blocki ...
随机推荐
- java基础源码 (2)--StringBuilder类
Serializable(接口): 是一个IO的序列化接口,实现了这个接口,就代表这个类可以序列化或者反序列化,该接口没有方法或者字段,仅用于标识可串行话的语义. Appendable(接口): /* ...
- AI 伴游小精灵
北京市商汤科技开发有限公司面向青少年研发了一款智能伴游机器人-- AI 伴游小精灵.一经推出,深受孩子们的喜爱,可爱又机智的小精灵会想出很多有趣的小游戏来启迪孩子们思考.今天,小精灵给你提出了一个神奇 ...
- selenium2Library无法启动chrome
使用其他浏览器都没有影响,唯独chrome启动不起来,去掉IE-连接-局域网设置-自动检测设置就OK了
- js原型链理解(2)--原型链继承
1.原型链继承 2.constructor stealing(构造借用) 3.组合继承 js中的原型链继承,运用的js原型链中的__proto__. function Super(){ this.se ...
- Stuts2与SpringMVC
Struts2:一个基于MVC设计模式的Web应用框架,本质上相当于一个servlet.以WebWork为核心,采用拦截器的机制处理用户的请求(Filter). 轻量级的MVC框架.低侵入性,与业务代 ...
- [题解] LuoguP4381 [IOI2008]Island
LuoguP4381 [IOI2008]Island Description 一句话题意:给一个基环树森林,求每棵基环树的直径长度的和(基环树的直径定义与树类似,即基环树上一条最长的简单路径),节点总 ...
- spring boot集成mybatis(3) - mybatis generator 配置
Spring Boot 集成教程 Spring Boot 介绍 Spring Boot 开发环境搭建(Eclipse) Spring Boot Hello World (restful接口)例子 sp ...
- part12 非核心代码异步加载
router文件中的 index component: ()=> import(‘path’) // 这样 访问一个页面 就只请求这个页面的js逻辑 //当app很小的的时候不需要做异步拆分 / ...
- 字符串处理 - ANSI - Unicode - UTF8 转换
#include <stdio.h> #include <windows.h> #include <locale.h> #define BUFF_SIZE 1024 ...
- 82.常用的返回QuerySet对象的方法使用详解:all,select_related
1. all: 返回这个ORM模型的QuerySet对象. articles = Article.objects.all() print(articles) 2.select_related: 查找数 ...