math and date、ajax、画布
console.log(Math.PI);//圆周率
console.log(Math.sqrt(4));//平方根2
console.log(Math.abs(-2.3));//绝对值2.3
console.log(Math.ceil(-2.3));//上舍入-2
console.log(Math.floor(-2.3));//下舍入-3
console.log(Math.max(-2,3,6,1));//最大值6
console.log(Math.min(-2,3,6,1));//最小值-2
console.log(Math.random());//0-1之间的随机数
console.log(Math.round(3.5));//把一个数字舍入为最接近的整数。4
console.log(Math.round(3.36));//四舍五入4
console.log(Math.round(3.4));//四舍五入3
console.log(Math.round(-3.4));//四舍五入-3
console.log(Math.round(-3.5));//四舍五入-3
var date=new Date();//返回当日的日期和时间。
console.log(date);
console.log(date.getDate());//从 Date 对象返回一个月中的某一天 (1 ~ 31)。
console.log(date.getDay());//从 Date 对象返回一周中的某一天 (0 ~ 6)。
console.log(date.getMonth());//从 Date 对象返回月份 (0 ~ 11)。
console.log(date.getFullYear());//从 Date 对象以四位数字返回年份。
console.log(date.getHours());//返回 Date 对象的小时 (0 ~ 23)。
console.log(date.getMinutes());//返回 Date 对象的分钟 (0 ~ 59)。
console.log(date.getSeconds());//返回 Date 对象的秒 (0 ~ 59)。
console.log(date.getMilliseconds());//返回 Date 对象的毫秒(0 ~ 999)。
console.log(date.getTime());//返回 1970 年 1 月 1 日至今的毫秒数。
get语法：var born = new Date("July 21, 1983 01:15:00")
document.write(born.getMinutes())
date.setDate(15);//设置 Date 对象中月的某一天 (1 ~ 31)。
date.setMinutes(22);//设置 Date 对象中的分钟 (0 ~ 59)。
date.setHours(11);//设置 Date 对象中的小时 (0 ~ 23)。 语法：dateObject.setHours(hour,min,sec,millisec)
date.setMilliseconds(200);//设置 Date 对象中的毫秒 (0 ~ 999)。
date.setFullYear()(2015);//设置 Date 对象中的年份（四位数字）。 语法：dateObject.setFullYear(year,month,day)
date.setSeconds(24);//设置 Date 对象中的秒 (0 ~ 59)。
date.setMonth(8);//设置 Date 对象中的月 (0 ~ 11)。 语法：dateObject.setMonth(month,day)
console.log(date);
ajax
1、AJAX = Asynchronous JavaScript and XML（异步的 JavaScript 和 XML）。
2、实例：
<html>
<body>
<div id="myDiv"><h3>Let AJAX change this text</h3></div>
<button type="button" onclick="loadXMLDoc()">Change Content</button>
</body>
</html>
接下来，在页面的 head 部分添加一个 <script> 标签。该标签中包含了这个 loadXMLDoc() 函数：
<head>
<script type="text/javascript">
function loadXMLDoc()
{
.... AJAX script goes here ...
}
</script>
</head>
3、创建 XMLHttpRequest 对象：variable=new ActiveXObject("Microsoft.XMLHTTP");
4、向服务器发送请求：如需将请求发送到服务器，我们使用 XMLHttpRequest 对象的 open() 和 send() 方法：
xmlhttp.open("GET","test1.txt",true);
xmlhttp.send();
5、服务器响应：如需获得来自服务器的响应，使用 XMLHttpRequest 对象的 responseText 或 responseXML 属性
eg：document.getElementById("myDiv").innerHTML=xmlhttp.responseText;
6、onreadystatechange 事件：每当 readyState 改变时，就会触发 onreadystatechange 事件。
readyState 属性存有 XMLHttpRequest 的状态信息
onreadystatechange 存储函数（或函数名），每当 readyState 属性改变时，就会调用该函数。
readyState 存有 XMLHttpRequest 的状态。从 0 到 4 发生变化。
0: 请求未初始化
1: 服务器连接已建立
2: 请求已接收
3: 请求处理中
4: 请求已完成，且响应已就绪
status 200: "OK"
404: 未找到页面
画布
1、，<canvas> 元素本身并没有绘制能力（它仅仅是图形的容器）：<canvas id="myCanvas" width="200" height="100"></canvas>
2、<script type="text/javascript">
var c=document.getElementById("myCanvas");
var cxt=c.getContext("2d");//getContext("2d") 对象是内建的 HTML5 对象，拥有多种绘制路径、矩形、圆形、字符以及添加图像的方法。返回一个对象，该对象提供了用于在画布上绘图的方法和属性。
cxt.fillStyle="#FF0000";//红色
cxt.fillRect(0,0,150,75);//矩形，在画布上绘制 150x75 的矩形，从左上角开始 (0,0)。
</script>
3、线条
通过指定从何处开始，在何处结束，来绘制一条线：
Canvas 实例：线条
JavaScript 代码：
<script type="text/javascript">
var c=document.getElementById("myCanvas");
var cxt=c.getContext("2d");
cxt.moveTo(10,10);
cxt.lineTo(150,50);
cxt.lineTo(10,50);
cxt.stroke();
</script>
4、圆形
通过规定尺寸、颜色和位置，来绘制一个圆：
Canvas 实例：圆形
JavaScript 代码：
<script type="text/javascript">
var c=document.getElementById("myCanvas");
var cxt=c.getContext("2d");
cxt.fillStyle="#FF0000";
cxt.beginPath();
cxt.arc(70,18,15,0,Math.PI*2,true);
cxt.closePath();
cxt.fill();
</script>
5、 渐变
使用您指定的颜色来绘制渐变背景：
Canvas 实例：渐变
JavaScript 代码：
<script type="text/javascript">
var c=document.getElementById("myCanvas");
var cxt=c.getContext("2d");
var grd=cxt.createLinearGradient(0,0,175,50);
grd.addColorStop(0,"#FF0000");
grd.addColorStop(1,"#00FF00");
cxt.fillStyle=grd;
cxt.fillRect(0,0,175,50);
</script>
6、图像
把一幅图像放置到画布上：
Canvas 实例：图像
JavaScript 代码：
<script type="text/javascript">
var c=document.getElementById("myCanvas");
var cxt=c.getContext("2d");
var img=new Image()
img.src="flower.png"
cxt.drawImage(img,0,0);
</script>
7、颜色、样式和阴影
属性 描述
fillStyle 设置或返回用于填充绘画的颜色、渐变或模式
strokeStyle 设置或返回用于笔触的颜色、渐变或模式
shadowColor 设置或返回用于阴影的颜色
shadowBlur 设置或返回用于阴影的模糊级别
shadowOffsetX 设置或返回阴影距形状的水平距离
shadowOffsetY 设置或返回阴影距形状的垂直距离
方法 描述
createLinearGradient() 创建线性渐变（用在画布内容上）
createPattern() 在指定的方向上重复指定的元素
createRadialGradient() 创建放射状/环形的渐变（用在画布内容上）
addColorStop() 规定渐变对象中的颜色和停止位置
线条样式
属性 描述
lineCap 设置或返回线条的结束端点样式
lineJoin 设置或返回两条线相交时，所创建的拐角类型
lineWidth 设置或返回当前的线条宽度
miterLimit 设置或返回最大斜接长度
矩形
方法 描述
rect() 创建矩形
fillRect() 绘制“被填充”的矩形
strokeRect() 绘制矩形（无填充）
clearRect() 在给定的矩形内清除指定的像素
路径
方法 描述
fill() 填充当前绘图（路径）
stroke() 绘制已定义的路径
beginPath() 起始一条路径，或重置当前路径
moveTo() 把路径移动到画布中的指定点，不创建线条
closePath() 创建从当前点回到起始点的路径
lineTo() 添加一个新点，然后在画布中创建从该点到最后指定点的线条
clip() 从原始画布剪切任意形状和尺寸的区域
quadraticCurveTo() 创建二次贝塞尔曲线
bezierCurveTo() 创建三次方贝塞尔曲线
arc() 创建弧/曲线（用于创建圆形或部分圆）
arcTo() 创建两切线之间的弧/曲线
isPointInPath() 如果指定的点位于当前路径中，则返回 true，否则返回 false
转换
方法 描述
scale() 缩放当前绘图至更大或更小
rotate() 旋转当前绘图
translate() 重新映射画布上的 (0,0) 位置
transform() 替换绘图的当前转换矩阵
setTransform() 将当前转换重置为单位矩阵。然后运行 transform()
文本
属性 描述
font 设置或返回文本内容的当前字体属性
textAlign 设置或返回文本内容的当前对齐方式
textBaseline 设置或返回在绘制文本时使用的当前文本基线
方法 描述
fillText() 在画布上绘制“被填充的”文本
strokeText() 在画布上绘制文本（无填充）
measureText() 返回包含指定文本宽度的对象
图像绘制
方法 描述
drawImage() 向画布上绘制图像、画布或视频
像素操作
属性 描述
width 返回 ImageData 对象的宽度
height 返回 ImageData 对象的高度
data 返回一个对象，其包含指定的 ImageData 对象的图像数据
方法 描述
createImageData() 创建新的、空白的 ImageData 对象
getImageData() 返回 ImageData 对象，该对象为画布上指定的矩形复制像素数据
putImageData() 把图像数据（从指定的 ImageData 对象）放回画布上
合成
属性 描述
globalAlpha 设置或返回绘图的当前 alpha 或透明值
globalCompositeOperation 设置或返回新图像如何绘制到已有的图像上
其他
方法 描述
save() 保存当前环境的状态
restore() 返回之前保存过的路径状态和属性
createEvent()
getContext()
toDataURL()
math and date、ajax、画布的更多相关文章
- javascript_core之正则、Math、Date
javascript_core之正则.Math.Date 1.RegExp:Regular Expression,创建封装正则表达式: ①正则直接量:var reg=/reg/ig:②var re ...
- JavaScript中Global、Math、Date对象的常用方法
JavaScript当中Global.Math.Date类型常用方法如下: /* js 中 Global对象 是一个不存在的对象,它里面的方法可以调用 常用方法: 1 encodeURI 对uri进行 ...
- Math和Date
Math和Date 一.对象 1.对象的概念 对象的本质:键值对,属性名和属性值 对象的意义:存储数据,编程 对象中的变量:属性 对象中的函数:方法 2.对象的赋值 var obj = {}; var ...
- JavaScript-----13.内置对象 Math()和Date()
1. 内置对象 js对象分为3种:自定义对象(var obj={}).内置对象.浏览器对象. 前两种对象是js基础内容,属于ECMAScript,第三个浏览器对象是js独有的.讲js API的时候会讲 ...
- javascript_core_06之正则、Math、Date
1.RegExp:Regular Expression,创建封装正则表达式: ①正则直接量:var reg=/reg/ig:②var reg=new RegExp(“reg”,“ig”): 2.Reg ...
- i++,++i,Math.max,hasOwnPrototype.ajax,indexOf(),firefox的一些东西,jquery的contains函数,window.open
一.i++与++i的区别 1 var i=0;3 console.log(i++)5 0 1 var j=0; 2 3 console.log(++j) 4 1 a=++i;相当于i=i+1;a=i; ...
- Javascript数组,String对象,Math对象,Date对象,正则表达式
标题栏的滚动<html><head><title>山西众创金融</title></head>function init(){ //1.拿到标 ...
- Java之StringBuffer，StringBuilder，Math，Date，SimpleDateFormat，UUID，File
java.lang 类 StringBuffer java.lang.Object java.lang.StringBuffer 所有已实现的接口: Serializable, Appendable, ...
- 从零开始学习前端JAVASCRIPT — 4、JavaScript基础Math和Date对象的介绍
Math对象的介绍 1:Math对象 Math 对象用于执行数学任务.并不像 Date 和 String 那样是对象的类,因此没有构造函数 Math().您无需创建它,通过把 Math 作为对象使用就 ...
随机推荐
- miniprofiler的对数据库的监测使用。以nancy，petapoco为例
miniprofiler的使用 miniprofiler的详细介绍请看这里http://miniprofiler.com/.(可以对数据库和页面等监控如 ado ef mvc mongodb) 本文以 ...
- 剑指offer六：反转链表
输入一个链表,反转链表后,输出链表的所有元素 public class ListNode { int val; ListNode next = null; ListNode(int val) { th ...
- js压缩图片base64长度
var myCanvas=$('.img-container > img').cropper('getCroppedCanvas'); (function (base64){ var image ...
- OpenLayers控制瓦片的绽放级别
先说说这个功能可能使用到的地方,当我们下载的网上瓦片或者矢量数据的第一级或开始几级效果不是很好时,我们就就想让用户看到这些级别的瓦片.实现这个功能比较简单,主要就是修改Openlayers.map的i ...
- JMeter常用测试元件—学习笔记
线程组 Ramp-Up Period:告诉JMeter达到最大线程数需要多长时间.假定共有10个线程,Ramp-Up Period为100秒,那么JMeter就会在100秒内启动所有线程,并让它们运转 ...
- language model —— basic model 语言模型之基础模型
一.发展 起源:统计语言模型起源于 Ponte 和 Croft 在 1998年的 SIGIR上发表的论文 应用:语言模型的应用很多: corsslingual retrieval distribute ...
- [MVC_Json序列化]Json字符串反序列化成C#对象
上一篇中有Json序列化相关问题得到了解决. 那么结果集为Json串时,如何将Json串转成C#对象呢? 现举例说明: -现有如下字符串数据 string k = "{\"ring ...
- jQuery 查找父元素
function deletesec1Div5(obj){ $(obj).closest(".sec1-div5").remove();}自己写的一段代码,实现了table中的全选 ...
- Android 升级SQLite数据库
每一个数据库版本都会对应一个版本号,当指定的数据库版本号大于当前数据库的版本号时,就会进入到onUpGrade()方法中去执行更新操作.需要为每一个版本号赋予其各自改变的内容然后再onUpgrade( ...
- Win7全自动精简批处理_温柔处理极速修正版/暴力剩女工程测试版
2011htpcfans 发表于 2012-5-11 http://bbs.wuyou.net/forum.php?mod=viewthread&tid=210269&highligh ...