15. javacript高级程序设计-Canvas绘图

1. Canvas绘图

HTML5的<canvas>元素提供了一组JavaScript API，让我们可以动态的创建图形和图像。图形是在一个特定的上下文中创建的，而上下文对象目前有两种。

第一种是2D上下文，可以执行原始的绘图操作，

l 设置填充、描边颜色和模式

l 绘制矩形

l 绘制路径

l 绘制文本

l 创建渐变和模式

第二种是3D上下文，即WebGL上下文。

l 使用GLSL编写的顶点和片段着色器

l 支持类型化数组，即能够将数组中的数据限定为某种特定的数值类型

l 创建和操作纹理

主流浏览器的较新版本都支持<canvas>标签，不过WebGL只有firefox 4+和chrome支持。

时间： 2024-10-13 00:13:42

15. javacript高级程序设计-Canvas绘图的相关文章

JavaScript高级程序设计:Canvas绘图

Canvas 绘制矩形 var drawing = document.getElementById('drawing'); if( drawing.getContext ){ var context = drawing.getContext('2d'); // 绘制矩形 context.fillStyle = '#0000ff'; context.fillRect( 10, 10 , 50 , 50 ); // 绘制半透明红色矩形 context.fillStyle = 'rgba(255,0,

25. javacript高级程序设计-新兴的API

1. 新兴的API requestAnimationFrame():是一个着眼于优化js动画的api,能够在动画运行期间发出信号.通过这种机制,浏览器就能够自动优化屏幕重绘操作 Page Visibility API:让开发人员知道用户什么时候正在看着页面,而什么时候页面是隐藏. Geolocation API:在得到用户许可的情况下,可以确定用户的位置 File API:可以读取文件内容,用户显示.处理和上传 Web Timing:给出了页面加载和渲染过程的很多信息,对性能优化非常有价值 We

12. javacript高级程序设计-DOM2和DOM3

1. DOM2和DOM3 DOM2级规范定义了一些模块,用于增强DOM1级.“DOM2级核心”为不同的DOM类型引入了一些与XML命名空间有关的方法,这些变化只在使用XML或者XHTML,对于HTML文档没有实际意义.除了与XML命名空间有关方法外,“DOM2核心”还定义了以编程方式创建Document实例的方法,也支持了创建DocumentType对象. “DOM2级样式”模块主要针对操作元素的样式信息而开发,其简要特性总结如下: l 每个元素都有一个关联的style样式,可以用来确定和修改行

2. javacript高级程序设计-在HTML中使用JavaScript

1.1 <script>元素 向HTML页面中插入JavaScript的主要方法,就是使用<script>元素,<script>元素定义了一下6个元素: (1). async:可选,表示立即下载脚本,只对外部脚本文件有效 (2). charset:可选,表示通过src属性指定的代码的字符集 (3). defer:可选,表示脚本可以延迟到文档完全被解析和显示之后再执行,只对外部脚本文件有效 (4). language:已废弃,原来用于表示编写代码使用的脚本语言 (5).

24. javacript高级程序设计-最佳实践

1. 最佳实践 l 来自其他语言的代码约定可以用于决定何时进行注释,以及如何进行缩进,不过JavaScript需要针对其松散类型的性质创造一些特殊的约定 l javascript应该定义行为,html应该定义内容,css应该定义外观 l 这些职责上的混乱会导致难以调试的错误和维护上的问题 l javascript执行所花费的事件直接影响到web页面的性能 l DOM交互的开销很大,需要限制DOM操作的次数 l 可以考虑将javascript文件合并为单个文件 l 使用压缩器将文件尽可能变小 l

16. javacript高级程序设计-HTML5脚本编程

1. HTML5脚本编程 l 跨文档消息传递API能够让我们在不降低同源策略安全性的前提下,在来至不同的域的文档间传递消息 l 原生拖放功能可以方便的指定某个元素是否可以拖动,并在放置时做出响应.还可以创建自定义的可拖放元素及放置目标 l 新的媒体元素<audio>和<video>可以拥有自己的与视频和音频交互的API l 历史状态管理让我们不必卸载当前页面即可以修改浏览器的历史状态栈.

14. javacript高级程序设计-表单

1. 表单脚本 1.1 基础知识 <from>元素表示表单: l acceptCharset:服务器能处理的字符集 l action:接受请求的URL l elements:表单中所有控件的集合 l enctype:请求的编码类型 l length:表单中控件的数量 l method:要发送的HTTP请求类型,通常是get或者post l name:表单的名称 l reset():将所有的表单重置为默认值 l submit():提交表单 l target:用于发送和接受请求响应的窗口名称 1.

10. javacript高级程序设计-DOM扩展

1. DOM扩展 1.1 选择符API l querySelector() 接收一个css选择符,返回与该模式匹配的第一个元素 l querySelectorAll() 接收一个css选择符,返回所有匹配的NodeList元素 1.2 HTML5 1.2.1 与类相关的扩充 l getElementsByClassName() 接收一个参数,一个包含一或者多个类名的字符串,返回带有指定类的所有元素的NodeList l classList属性,add(value),contains(value)

1. javacript高级程序设计-JavaScript简介

1. JavaScript简介 JavaScript诞生于1995年,由Netscape公司布兰登·艾奇开发,JavaScript主要包括三个部分: (1). ECMAScript,由ECMA-262定义,提高核心语言功能 (2). 文档对象模型(DOM),提供访问和操作网页内容的方法和接口 (3). 浏览器对象模型(BOM),提供与浏览器交互的方法和接口