Learning Path
浏览 JavaScript 参考手册 相关教程与章节。
HTML、CSS、JavaScript、浏览器 API、前端框架与 UI 工程。
教程
1361
HTML canvas fillRect() 方法 Canvas 对象 实例 绘制 150*100 像素的已填充矩形： YourbrowserdoesnotsupporttheHTML5canvastag. var c=document.getElementById('myCanvas'); var canvOK=1; try {c.getContext('2d');} catch ..
HTML canvas fillText() 方法 Canvas 对象 实例 使用 fillText()，在画布上写文本 'Hello world!' 和 'Big smile!'： YourbrowserdoesnotsupporttheHTML5canvastag. var c=document.getElementById('myCanvas'); var ..
HTML canvas getImageData() 方法 Canvas 对象 实例 下面的代码通过 getImageData() 复制画布上指定矩形的像素数据，然后通过 putImageData() 将图像数据放回画布： var c=document.getElementById('myCanvas'); var ctx=c.getContext('2d'); ctx.fillSt..
HTML canvas isPointInPath() 方法 Canvas 对象 实例 如果点 20,50 位于当前路径中，则绘制一个矩形： YourbrowserdoesnotsupporttheHTML5canvastag. var c=document.getElementById('myCanvas'); var canvOK=1; try {c.getContext('2d'..
HTML canvas lineTo() 方法 Canvas 对象 实例 开始一条路径，移动到位置 0,0。创建到达位置 300,150 的一条线： YourbrowserdoesnotsupporttheHTML5canvastag. var c=document.getElementById('myCanvas'); var canvOK=1; try {c.getContext('2d&..
HTML canvas measureText() 方法 Canvas 对象 实例 在画布上输出文本之前，检查字体的宽度： YourbrowserdoesnotsupporttheHTML5canvastag. var c=document.getElementById('myCanvas'); var canvOK=1; try {c.getContext('2d');} catc..
HTML canvas moveTo() 方法 Canvas 对象 实例 开始一条路径，移动到位置 0,0。创建到达位置 300,150 的一条线： YourbrowserdoesnotsupporttheHTML5canvastag. var c=document.getElementById('myCanvas'); var canvOK=1; try {c.getContext('2d&#..
HTML canvas putImageData() 方法 Canvas 对象 实例 下面的代码通过 getImageData() 复制画布上指定矩形的像素数据，然后通过 putImageData() 将图像数据放回画布： var c=document.getElementById('myCanvas'); var ctx=c.getContext('2d'); ctx.fillSt..
HTML canvas quadraticCurveTo() 方法 Canvas 对象 实例 绘制一条二次贝塞尔曲线： YourbrowserdoesnotsupporttheHTML5canvastag. var c=document.getElementById('myCanvas'); var canvOK=1; try {c.getContext('2d');} catch ..
HTML canvas rect() 方法 Canvas 对象 实例 绘制 150*100 像素的矩形： YourbrowserdoesnotsupporttheHTML5canvastag. var c=document.getElementById('myCanvas'); var canvOK=1; try {c.getContext('2d');} catch (er) {c..
HTML canvas rotate() 方法 Canvas 对象 实例 将矩形旋转 20 度： YourbrowserdoesnotsupporttheHTML5canvastag. var c=document.getElementById('myCanvas'); var canvOK=1; try {c.getContext('2d');} catch (er) {canvO..
HTML canvas scale() 方法 Canvas 对象 实例 绘制矩形，放大到 200%，然后再次绘制矩形： YourbrowserdoesnotsupporttheHTML5canvastag. var c=document.getElementById('myCanvas'); var canvOK=1; try {c.getContext('2d');} catch ..
HTML canvas setTransform() 方法 Canvas 对象 实例 绘制一个矩形，通过 setTransform() 重置并创建新的变换矩阵，再次绘制矩形，重置并创建新的变换矩阵，然后再次绘制矩形。请注意，每当您调用 setTransform() 时，它都会重置前一个变换矩阵然后构建新的矩阵，因此在下面的例子中，不会显示红色矩形，因为它在蓝色矩形下面： Yourbrowserdoesnotsupportthe..
HTML canvas stroke() 方法 Canvas 对象 实例 绘制一条路径，形状是红色的字母 L： YourbrowserdoesnotsupporttheHTML5canvastag. var c=document.getElementById('myCanvas'); var canvOK=1; try {c.getContext('2d');} catch (er)..
HTML canvas strokeRect() 方法 Canvas 对象 实例 绘制 150*100 像素的矩形： YourbrowserdoesnotsupporttheHTML5canvastag. var c=document.getElementById('myCanvas'); var canvOK=1; try {c.getContext('2d');} catch (..
HTML canvas strokeText() 方法 Canvas 对象 实例 使用 strokeText()，在画布上写文本 'Hello world!' 和 'Big smile!'（带渐变）： YourbrowserdoesnotsupporttheHTML5canvastag. var c=document.getElementById('myCanvas'..
HTML canvas transform() 方法 Canvas 对象 实例 绘制一个矩形，通过 transform() 添加一个新的变换矩阵，再次绘制矩形，添加一个新的变换矩阵，然后再次绘制矩形。请注意，每当您调用 transform() 时，它都会在前一个变换矩阵上构建： YourbrowserdoesnotsupporttheHTML5canvastag. var c=document.getElementById..
HTML canvas translate() 方法 Canvas 对象 实例 在位置 (10,10) 处绘制一个矩形，将新的 (0,0) 位置设置为 (70,70)。再次绘制新的矩形（请注意现在矩形从位置 (80,80) 开始绘制）： YourbrowserdoesnotsupporttheHTML5canvastag. var c=document.getElementById('myCanvas'..
HTML DOM console.assert() 方法 Console 对象 实例 如果第一个参数为 false，则再控制台输出信息： [mycode3 type='js'] console.assert(document.getElementById('demo'), '没有 ID 为 'demo' 的元素'); [/mycode3] ..
HTML DOM console.clear() 方法 Console 对象 实例 清除控制台上所有信息： [mycode3 type='js'] console.clear(); [/mycode3] 尝试一下 » 定义和用法 console.clear() 方法用于清除控制台所有信息。 console.clear() 方法在执行成功后，会在控制台输出: 'Console was ..
HTML DOM console.count() 方法 Console 对象 实例 记录 count() 调用次数，并输出到控制台： [mycode3 type='js'] for (i = 0; i < 10; i++) { console.count(); } [/mycode3] 尝试一下 » 定义和用法 console.count() 在调用时会将数字（调用次数）写入到控..
HTML DOM console.error() 方法 Console 对象 实例 将错误信息输出到控制台： [mycode3 type='js'] console.error('这是一个错误。'); [/mycode3] 尝试一下 » 定义和用法 console.error() 方法用于输出错误信息到控制台。 该方法对于开发过程进行测试很有帮助。 提示: 在测试的该方法的..
HTML DOM console.group() 方法 Console 对象 实例 在控制台创建一个分组信息： [mycode3 type='js'] console.log('Runoob'); console.group(); console.log('Runoob，这个在分组里面。'); [/mycode3] 尝试一下 » 定义和用法 consol..
HTML DOM console.groupCollapsed() 方法 Console 对象 实例 在控制台创建一个折叠分组信息： [mycode3 type='js'] console.log('Runoob'); console.groupCollapsed(); console.log('Runoob，这个在折叠的分组里面。'); [/mycode3] ..